正在努力加载中~请稍等~

当前位置:首页>源码分享>B2源码> B2主题美化给文章添加彩色角标

B2主题美化给文章添加彩色角标

B2主题美化给文章添加彩色角标

1.修改b2主题目录下 /b2/Modules/Settings/Post.php 文件,在$gg_meta = new_cmb2_box 之前添加:

// 文章添加角标开始
$post_meta = new_cmb2_box(array(
'id' => 'b2_post_onecad_jb',
'title' => __( '文章角标', 'b2' ),
'object_types' => array('post','document','page'),
'context' => 'normal',
'priority' => 'high',
'show_names' => true
));
$post_meta->add_field(array(
'name' => sprintf(__('列表需要显示角标','b2'),$g_name),
'id' => 'b2_post_onecad_lb',
'type' => 'select',
'options'=>array(
0=>__('推荐','b2'),
1=>__('VIP','b2'),
2=>__('原创','b2'),
3=>__('免费','b2'),
4=>__('积分','b2')
),
'default'=>0,
'desc'=> __('支持 HTML,尽量短小才好看。','b2')
));
add_filter('post_side_settings', 'wporg_custom');
// 文章添加角标结束

B2主题美化给文章添加彩色角标

2.修改b2主题目录下 b2/Modules/Templates/Modules/Posts.php 文件,在第一个$hove_avatar前添加以下代码:

$index_jiaobiao =get_option('b2_one_main_tab2')['index_jiaobiao']; 
if($index_jiaobiao == '1'){
$b2_post_onecad_lb= get_post_meta($v['id'],'b2_post_onecad_lb',true);
if($b2_post_onecad_lb == ''){
$meta_jiaobiao_html ='<span>'.$b2_post_onecad_lb.'</span>';}
else if($b2_post_onecad_lb ==0){
$meta_jiaobiao_html ='<span class="tipss huodong b2-radius">推荐</span>';}
else if($b2_post_onecad_lb ==1){
$meta_jiaobiao_html = '<span class="tipss remen b2-radius">VIP</span>';}
else if($b2_post_onecad_lb ==2){
$meta_jiaobiao_html ='<span class="tipss jingping b2-radius">原创</span>';}
else if($b2_post_onecad_lb ==3){
$meta_jiaobiao_html ='<span class="tipss tuijain b2-radius">免费</span>';}
}

B2主题美化给文章添加彩色角标

3.在第二步同文件中,大概167行的文章列表中添加以下代码:

'.$meta_jiaobiao_html.'

B2主题美化给文章添加彩色角标

4.在主题目录或子主题目录的style.css中添加样式代码:

/*角标样式*/.tipss {
position: absolute;
top: 10px;
left: 10px;
z-index: 1;
width: 50px;
height: 20px;
color: #fff;
line-height: 20px;
text-align: center;
font-size: 13px;
z-index: 5;
}
.yellow {background-color: #ff6000;}
.huodong{background:#00d084}
.remen{background:#fcb900}
.jingping{background:#cf2e2e}
.guanggao{background:#00d084}
.tuijain{background:#ff6900}
.yuliu{background:#0693e3}

5.大功告成,现在在后台文章编辑中就能看到列表角标设置选择了。

这个教程仅是给网格列表添加了角标,其他列表也可以使用此方法添

文章链接:https://sjcnh.cn/1265.html
文章标题:B2主题美化给文章添加彩色角标
文章版权:@花醉 所发布的内容,部分为原创文章,转载请注明来源,网络转载文章如有侵权请联系我们!我们将在24小时内极速处理!
本文最后更新发布于2023年07月19日 11时11分56秒,某些文章具有时效性,若有错误或已失效,请在下方留言或联系:841134898@qq.com
本文声明 本站上的部份代码,教程,软件,插件来自会员发布以及互联网收集,不代表本站立场,仅供网友个人学习交流或测试研究使用,未经原版权作者许可,禁止用于任何商业途径!请用户仔细辨认内容的真实性,避免上当受骗!本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。请在下载24小时内删除!若您喜欢本文可附上原文链接随意转载。如无意侵害了您的权益,请发送邮件841134898@qq.com 或点击右侧 私信:花醉 反馈,我们将尽快处理。如果遇到付费才可观看的文章,建议升级终身VIP。全站所有资源“任意下免费看”。本站资源少部分采用7z压缩,为防止有人压缩软件不支持7z格式,建议下载7-zip。zip、rar解压,建议下载WinRAR。

给TA赞助
共{{data.count}}人
人已赞助
!
您也想出现在这里吗?点击联系我们吧!
点击投个广告吧
共有 0 条评论
    暂无讨论,说说你的看法吧
个人中心

有新商品 购物车

有可用券 优惠劵
今日签到

有新私信 私信列表

有新消息 消息中心
快速搜索
在线客服
关注我们
  • 手机扫码打开网页

  • 微信公众号

语言切换
返回顶部