给wordpress增加一些比较实用的短代码

wordpress目前是使用较多的博客建站程序之一,不管是主题、插件,还是各种优化、美化方面的教程还是比较多的,遇到问题也可以通过相关搜索到各种解答。现在本站收集到可以给wordpess增加一些比较实用的短代码,具体代码以及添加方法如下,如果有需求请做好模板数据备份在进行操作,以免出现问题可以快速恢复。

1.编辑 WordPress 主题目录下的functions.php文件,添加如下代码:

/*短代码信息框 开始*/
function toz($atts, $content=null){
    return '
'.$content.'
'; } add_shortcode('v_notice','toz'); function toa($atts, $content=null){ return '
'.$content.'
'; } add_shortcode('v_error','toa'); function toc($atts, $content=null){ return '
'.$content.'
'; } add_shortcode('v_warn','toc'); function tob($atts, $content=null){ return '
'.$content.'
'; } add_shortcode('v_tips','tob'); function tod($atts, $content=null){ return '
'.$content.'
'; } add_shortcode('v_blue','tod'); function toe($atts, $content=null){ return '
'.$content.'
'; } add_shortcode('v_black','toe'); function tof($atts, $content=null){ return '
'.$content.'
'; } add_shortcode('v_xuk','tof'); function tog($atts, $content=null){ return '
'.$content.'
'; } add_shortcode('v_lvb','tog'); function toh($atts, $content=null){ return '
'.$content.'
'; } add_shortcode('v_redb','toh'); function toi($atts, $content=null){ return '
'.$content.'
'; } add_shortcode('v_orange','toi'); /* 短代码信息框 完毕*/

2. 将下面的 CSS 代码添加到 style.css 文件中,或者直接在主题的自定义样式中添加

/*彩色信息框*/  
#sc_notice{  
color:#7da33c;  
background:#ecf2d6url(‘img/sc_notice.png’)–1px–1pxno-repeat;  
border:1pxsolid#aac66d;  
overflow:hidden;  
margin:10px0;  
padding:15px15px15px35px;  
}  
#sc_warn{  
color:#ad9948;  
background:#fff4b9url(‘img/sc_warn.png’)–1px–1pxno-repeat;  
border:1pxsolid#eac946;  
overflow:hidden;  
margin:10px0;  
padding:15px15px15px35px;  
}  
#sc_error{  
color:#c66;  
background:#ffeceaurl(‘img/sc_error.png’)–1px–1pxno-repeat;  
border:1pxsolid#ebb1b1;  
overflow:hidden;  
margin:10px0;  
padding:15px15px15px35px;  
}  
#sc_tips{  
color:#777;  
background:#eaeaeaurl(‘img/sc_tips.png’)–1px–1pxno-repeat;  
border:1pxsolid#ccc;  
overflow:hidden;  
margin:10px0;  
padding:15px15px15px35px;  
}  
#sc_blue{  
color:#1ba1e2;  
background:rgba(27,161,226,0.26)url(‘img/sc_blue.png’)–1px–1pxno-repeat;  
border:1pxsolid#1ba1e2;  
overflow:hidden;  
margin:10px0;  
padding:15px15px15px35px;  
}  
#sc_black{  
border-width:1px4px4px1px;  
border-style:solid;  
border-color:#3e3e3e;  
margin:10px0;  
padding:15px15px15px35px;  
}  
#sc_xuk{  
border:2pxdashedrgb(41,170,227);  
background-color:rgb(248,247,245);  
margin:10px0;  
padding:15px15px15px35px;  
}  
#sc_lvb{  
margin:10px0;  
padding:10px15px;  
border:1pxsolid#e3e3e3;  
border-left:2pxsolid#05B536;  
background:#FFF;  
}  
#sc_redb{  
margin:10px0;  
padding:10px15px;  
border:1pxsolid#e3e3e3;  
border-left:2pxsolid#ED0505;  
background:#FFF;  
}  
#sc_organge{  
margin:10px0;  
padding:10px15px;  
border:1pxsolid#e3e3e3;  
border-left:2pxsolid#EC8006;  
background:#FFF;  
}

使用方法:

在文章编辑时插入以下代码即可,注意修改下括号

{v_notice]绿色提示框[/v_notice}

{v_error]红色提示框[/v_error}

{v_warn]黄色提示框[/v_warn}

{v_tips]灰色提示框[/v_tips}

{v_blue]蓝色提示框[/v_blue}

{v_black]黑色提示框[/v_black}

{v_xuk]虚线提示框[/v_xuk}

{v_lvb]绿边提示框[/v_lvb}

{v_redb]红边提示框[/v_redb}

{v_orange]橙边提示框[/v_orange}

给后台文章文本编辑器添加按钮的方法:

如果采用上面的方法在文章编辑时插入以下代码还是不方便,还需要去记忆,那么还可以给后台文本编辑器添加按钮哦,具体的方法如下:

functions.php文件中加入以下代码,就可以在后台文本编辑器上面加上下面这些短代码了:

//添加HTML编辑器自定义快捷标签按钮  
add_action(‘after_wp_tiny_mce’,‘bolo_after_wp_tiny_mce’);  
functionbolo_after_wp_tiny_mce($mce_settings){  
?>  
  
QTags.addButton(‘v_notice’,‘绿框’,‘绿色提示框n’,“”);  
QTags.addButton(‘v_error’,‘红框’,‘红色提示框n’,“”);  
QTags.addButton(‘v_warn’,‘黄框’,‘黄色提示框n’,“”);  
QTags.addButton(‘v_tips’,‘灰框’,‘灰色提示框n’,“”);  
QTags.addButton(‘v_blue’,‘蓝框’,‘蓝色提示框n’,“”);  
QTags.addButton(‘v_black’,‘黑框’,‘黑色提示框n’,“”);  
QTags.addButton(‘v_xuk’,‘虚线’,‘虚线提示框n’,“”);  
QTags.addButton(‘v_lvb’,‘绿边’,‘绿边提示框n’,“”);  
QTags.addButton(‘v_redb’,‘红边’,‘红边提示框n’,“”);  
QTags.addButton(‘v_orange’,‘橙边’,‘橙边提示框n’,“”);  
functionbolo_QTnextpage_arg1(){  
}