7B2主题美化 文章中添加渐变提示框

jaysun

文本提示框很多网站都有,不管程序是博客或是其他程序都有不同的风格提示框,提示框能更好的展现需让网友重点观看的内容,比较醒目,今天分享的提示框颜色搭配比较不错,喜欢的关注收藏。

效果图:

2022061102503562.jpg

教程如下:

1、下载文件中的js文件替换B2主题中的文件:b2/Assets/admin/gd_block.js;

2、下面的函数放入主题的 functions.php 中,或新建一个文件,require_once() 方式引入:

function toz($atts, $content=null){
 
    return '<div id="sc_notice">'.$content.'</div>';
 
}
 
add_shortcode('v_notice','toz');
 
function toa($atts, $content=null){
 
    return '<div id="sc_error">'.$content.'</div>';
 
}
 
add_shortcode('v_error','toa');
 
function toc($atts, $content=null){
 
    return '<div id="sc_warn">'.$content.'</div>';
 
}
 
add_shortcode('v_warn','toc');
 
function tob($atts, $content=null){
 
    return '<div id="sc_tips">'.$content.'</div>';
 
}
 
add_shortcode('v_tips','tob');
 
function tod($atts, $content=null){
 
    return '<div id="sc_blue">'.$content.'</div>';
 
}
 
add_shortcode('v_blue','tod');
 
function toe($atts, $content=null){
 
    return '<div id="sc_black">'.$content.'</div>';
 
}
 
add_shortcode('v_black','toe');
 
function tof($atts, $content=null){
 
    return '<div id="sc_xuk">'.$content.'</div>';
 
}
 
add_shortcode('v_xuk','tof');
 
function tog($atts, $content=null){
 
    return '<div id="sc_lvb">'.$content.'</div>';
 
}
 
add_shortcode('v_lvb','tog');
 
function toh($atts, $content=null){
 
    return '<div id="sc_redb">'.$content.'</div>';
 
}
 
add_shortcode('v_redb','toh');
 
function toi($atts, $content=null){
 
    return '<div id="sc_orange">'.$content.'</div>';
 
}
 
add_shortcode('v_orange','toi');
 
///////////////////////////////////////////////////////
 
function one($atts, $content=null){
 
    return '<div id="zm_mhz">'.$content.'</div>';
 
}
 
add_shortcode('zm_mhz','one');
 
function one2($atts, $content=null){
 
    return '<div id="zm_xgh">'.$content.'</div>';
 
}
 
add_shortcode('z_xgh','one2');
 
function one3($atts, $content=null){
 
    return '<div id="zm_tkzj">'.$content.'</div>';
 
}
 
add_shortcode('z_tkzj','one3');
 
function one4($atts, $content=null){
 
    return '<div id="zm_xyz">'.$content.'</div>';
 
}
 
add_shortcode('z_xyz','one4');
 
function one5($atts, $content=null){
 
    return '<div id="zm_gll">'.$content.'</div>';
 
}
 
add_shortcode('z_gll','one5');
 
function one6($atts, $content=null){
 
    return '<div id="zm_xty">'.$content.'</div>';
 
}
 
add_shortcode('z_xty','one6');
 
function one7($atts, $content=null){
 
    return '<div id="zm_yyz">'.$content.'</div>';
 
}
 
add_shortcode('z_yyz','one7');
 
function one8($atts, $content=null){
 
    return '<div id="zm_szh">'.$content.'</div>';
 
}
 
add_shortcode('z_szh','one8');
 
function one9($atts, $content=null){
 
    return '<div id="zm_wbk">'.$content.'</div>';
 
}
add_shortcode('z_wbk','one9');

3、CSS文件:

隐藏内容
评论可见
前往评论

CSS中图片文件在下载的图片文件夹中。


附件
B2主题美化 文章中添加渐变提示框
16.8 K
蓝奏云
****(需购买后查看)
下载文件
附件购买
售价:0 积分

您需要 登录账户 后才能发表评论

发表评论

快捷回复: 表情:
评论列表 (暂无评论,119人围观)

还没有评论,来说两句吧...

目录[+]

取消
微信二维码
微信二维码
支付宝二维码