效果样式↑

开始添加

识别文章类型

WordPress文章类型识别方式：

is_sticky(); #判断文章是否被置顶，是返回True，否返回False

post_password_required(); #判断文章是否设置了密码查看，是返回True，已输入或无密码返回False

get_post_status(); #返回文章的状态，返回值包含: publish, pending, draft, auto-draft, future, private, inherit, trash

找到WP主题的博客列表设置文件，一般是： wp-content/themes/[主题名]/blog-list (or content).php
根据上述识别方式，在列表文件的合适位置中添加下面几行：

添加对应的CSS设置

在CSS文件中添加下面几行，一般是：

wp-content/themes/[主题名]/assets/css/style.css:

.top{ position: absolute;content: '';top: 10px;left: -20px;padding: 0 26px;border-top: none;z-index: 1;color: #fff;transform: rotate(-45deg);font-size: 12px;background: #5cd9ce;} 

.pwd{ position: absolute;content: '';top: 10px;left: -20px;padding: 0 26px;border-top: none;z-index: 1;color: #fff;transform: rotate(-45deg);font-size: 12px;background: #dd001b;} 

.pvt{ position: absolute;content: '';top: 10px;left: -20px;padding: 0 26px;border-top: none;z-index: 1;color: #fff;transform: rotate(-45deg);font-size: 12px;background: #ffc700;}

#需要阴影效果的话可以多加这个属性： box-shadow: 1px 2px 3px #9c9a9a;

到这就完事了，清除一下浏览器缓存后就应该能看到效果了。