【WP美化】WP纯代码添加色块样式、闪光按钮

110
【WP美化】WP纯代码添加色块样式、闪光按钮-七木云
图标素材下载
此内容为付费资源，请付费后查看
￥2
立即购买
您当前未登录！建议登陆后购买，可保存购买订单
付费资源

输代码太麻烦，不如集合到编辑器功能按钮

以下添加到主题的functions.php文件尾部

/*彩色文本框 开始 */
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');
/*彩色文本框 结束 */

<pre class="pure-highlightjs line-numbers"><code class="language-php">/*闪光按钮 开始 */
/*添加蓝色闪光按钮*/
function sg_blue($atts, $content = null) {
 extract(shortcode_atts(array(
 "href" => 'http://'
 ) , $atts));
 return '<a class="sgbtn_blue" href="' . $href . '" target="_blank" rel="nofollow">' . $content . '</a>';
}
add_shortcode('sgbtn_blue', 'sg_blue');
/*添加红色闪光按钮*/
function sg_red($atts, $content = null) {
 extract(shortcode_atts(array(
 "href" => 'http://'
 ) , $atts));
 return '<a class="sgbtn_red" href="' . $href . '" target="_blank" rel="nofollow">' . $content . '</a>';
}
add_shortcode('sgbtn_red', 'sg_red');
/*添加橙色闪光按钮*/
function sg_orange($atts, $content = null) {
 extract(shortcode_atts(array(
 "href" => 'http://'
 ) , $atts));
 return '<a class="sgbtn_orange" href="' . $href . '" target="_blank" rel="nofollow">' . $content . '</a>';
}
add_shortcode('sgbtn_orange', 'sg_orange');
/*添加绿色闪光按钮*/
function sg_lv($atts, $content = null) {
 extract(shortcode_atts(array(
 "href" => 'http://'
 ) , $atts));
 return '<a class="sgbtn_lv" href="' . $href . '" target="_blank" rel="nofollow">' . $content . '</a>';
}
add_shortcode('sgbtn_lv', 'sg_lv');
/*闪光按钮 结束 */
/*彩色按钮 开始 */
/*蓝色按钮*/
function toj($atts, $content=null) {
 extract(shortcode_atts(array("href" => 'http://'), $atts));
 return '<a class="bluebtn" href="' . $href . '" target="_blank" rel="nofollow">' .$content.'</a>';
}
add_shortcode('bb' , 'toj' );
/*黄色按钮*/
function tok($atts, $content=null) {
 extract(shortcode_atts(array("href" => 'http://'), $atts));
 return '<a class="yellowbtn" href="' . $href . '" target="_blank" rel="nofollow">' .$content.'</a>';
}
add_shortcode('yb' , 'tok' );
/*绿色按钮*/
function tol($atts, $content=null) {
 extract(shortcode_atts(array("href" => 'http://'), $atts));
 return '<a class="greenbtn" href="' . $href . '" target="_blank" rel="nofollow">' .$content.'</a>';
}
add_shortcode('gb' , 'tol' );
/*彩色按钮 结束 */
/*添加文本编辑自定义快捷标签按钮 开始 */
 add_action('after_wp_tiny_mce', 'bolo_after_wp_tiny_mce');
 function bolo_after_wp_tiny_mce($mce_settings) {
 ?>
 <script type="text/javascript">
 QTags.addButton( 'v_notice', '绿框', '<div id="sc_notice">绿框</div>\n', "" );
 QTags.addButton( 'v_error', '红框', '<div id="sc_error">红框</div>\n', "" );
 QTags.addButton( 'v_warn', '黄框', '<div id="sc_warn">黄框</div>\n', "" );
 QTags.addButton( 'v_tips', '灰框', '<div id="sc_tips">灰框</div>\n', "" );
 QTags.addButton( 'v_blue', '蓝框', '<div id="sc_blue">蓝框</div>\n', "" );
 QTags.addButton( 'v_black', '黑框', '<div id="sc_black">黑框</div>\n', "" );
 QTags.addButton( 'v_xuk', '虚线', '<div id="sc_xuk">虚线框</div>\n', "" );
 QTags.addButton( 'v_lvb', '绿边', '<div id="sc_lvb">绿边框</div>\n', "" );
 QTags.addButton( 'v_redb', '红边', '<div id="sc_redb">红边框</div>\n', "" );
 QTags.addButton( 'v_organge', '橙边', '<div id="sc_organge">橙边框</div>\n', "" );
 QTags.addButton( 'sgbtn_blue', '蓝色闪光', "[sgbtn_blue href='链接']文本[/sgbtn_blue]" );
 QTags.addButton( 'sgbtn_red', '红色闪光', "[sgbtn_red href='链接']文本[/sgbtn_red]" );
 QTags.addButton( 'sgbtn_orange', '黄色闪光', "[sgbtn_orange href='链接']文本[/sgbtn_orange]" );
 QTags.addButton( 'sgbtn_lv', '绿色闪光', "[sgbtn_lv href='链接']文本[/sgbtn_lv]" );
 QTags.addButton( 'gb', '绿色按钮', "[gb href='链接']绿按钮" );
 QTags.addButton( 'bb', '蓝色按钮', "[bb href='链接']蓝按钮" );
 QTags.addButton( 'yb', '黄色按钮', "[yb href='链接']黄按钮" );
 function bolo_QTnextpage_arg1() {
 }
 </script>
 <?php
 }
/*添加文本编辑 自定义快捷标签按钮 结束 */</code></pre>
<h5>代码说明：</h5>
<pre class="pure-highlightjs line-numbers"><code class="language-php">QTags.addButton( '', '', '', '' )</code></pre>
<div id="sc_tips">四对引号，分别表示按钮的 ID、按钮显示名、点一下输入内容、再点一下关闭内容（最后一对引号为空则一次输入全部内容），n 表示换行；</div>
<div id="sc_tips">形象说明：QTags.addButton( ' 按钮 ID', '按钮显示名', '点一下输入内容', '点一下关闭内容' );
可以自定义添加多行 QTags.addButton( '', '', '', '' );增加多个按钮！</div>
<h5>以下添加到style.css里:不要忘了替换图标链接</h5>
<pre class="pure-highlightjs line-numbers"><code class="language-css">/*彩色文本框样式 开始 */
#sc_notice {
 color: #7da33c;
 background: #ecf2d6 url('http://*/sc_notice.png') -1px -1px no-repeat;
 border: 1px solid #aac66d;
 overflow: hidden;
 margin: 10px 0;
 padding: 15px 15px 15px 35px;
 }
#sc_warn {
 color: #ad9948;
 background: #fff4b9 url('http://*/sc_warn.png') -1px -1px no-repeat;
 border: 1px solid #eac946;
 overflow: hidden;
 margin: 10px 0;
 padding: 15px 15px 15px 35px;
 }
#sc_error {
 color: #c66;
 background: #ffecea url('http://*/sc_error.png') -1px -1px no-repeat;
 border: 1px solid #ebb1b1;
 overflow: hidden;
 margin: 10px 0;
 padding: 15px 15px 15px 35px;
 }
#sc_tips {
 color: #777;
 background: #eaeaea url('http://*/sc_tips.png') -1px -1px no-repeat;
 border: 1px solid #ccc;
 overflow: hidden;
 margin: 10px 0;
 padding: 15px 15px 15px 35px;
}
#sc_blue {
 color: #1ba1e2;
 background: rgba(27, 161, 226, 0.26) url('http://*/sc_blue.png') -1px -1px no-repeat;
 border: 1px solid #1ba1e2;
 overflow: hidden;
 margin: 10px 0;
 padding: 15px 15px 15px 35px;
}
#sc_black {
 border-width: 1px 4px 4px 1px;
 border-style: solid;
 border-color: #3e3e3e;
 margin: 10px 0;
 padding: 15px 15px 15px 35px;
}
#sc_xuk {
 border: 2px dashed rgb(41, 170, 227);
 background-color: rgb(248, 247, 245);
 margin: 10px 0;
 padding: 15px 15px 15px 35px;
}
#sc_lvb {
 margin: 10px 0;
 padding: 10px 15px;
 border: 1px solid #e3e3e3;
 border-left: 2px solid #05B536;
 background: #FFF;
}
#sc_redb {
 margin: 10px 0;
 padding: 10px 15px;
 border: 1px solid #e3e3e3;
 border-left: 2px solid #ED0505;
 background: #FFF;
}
#sc_organge {
    margin: 10px 0;
    padding: 10px 15px;
    border: 1px solid #e3e3e3;
    border-left: 2px solid #EC8006;
    background: #FFF;
}
/*彩色文本框样式 结束 */
/*闪光按钮样式 开始 */
[class*=sgbtn]{display:inline-block;text-indent:0;position:relative;color:#fff;padding:0 10px 0 10px;min-width:160px;height:38px;line-height:38px;opacity:.8;text-align:center;font-family:Ubuntu,sans-serif;font-size:15px;text-decoration:none;border-radius:2px;overflow:hidden;-webkit-transition:all .15s ease-in;transition:all .15s ease-in}[class*=sgbtn]:before{content:'';position:absolute;background:#fff;width:25px;height:50px;top:0;left:-45px;opacity:.3;-webkit-transition:all .25s ease-out;transition:all .25s ease-out;-webkit-transform:skewX(-25deg);transform:skewX(-25deg)}[class*=sgbtn]:hover{opacity:.65}[class*=sgbtn]:hover:before{width:45px;left:205px}.sgbtn_blue{color:#fff;background:#1cb2f5}.sgbtn_red{color:#fff;background:#C00}.sgbtn_orange{color:#fff;background:#F90}.sgbtn_lv{color:#fff;background:#096}a[class*=sgbtn]{color:#fff}a[class*=sgbtn]:hover{color:#fff}
/*闪光按钮样式 结束 */
/*!彩色按钮样式 开始 */
.greenbtn{-moz-box-shadow:0 10px 14px -7px #3e7327;-webkit-box-shadow:0 10px
14px -7px #3e7327;box-shadow:0 10px 14px -7px
#3e7327;background:-webkit-gradient(linear,left top,left
bottom,color-stop(0.05,#77b55a),color-stop(1,#72b352));background:-moz-linear-gr
adient(top,#77b55a 5%,#72b352
100%);background:-webkit-linear-gradient(top,#77b55a 5%,#72b352
100%);background:-o-linear-gradient(top,#77b55a 5%,#72b352
100%);background:-ms-linear-gradient(top,#77b55a 5%,#72b352
100%);background:linear-gradient(to bottom,#77b55a 5%,#72b352
100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77b55a',
endColorstr='#72b352',GradientType=0);background-color:#77b55a;-moz-border-radiu
s:4px;-webkit-border-radius:4px;border-radius:4px;border:1px solid
#4b8f29;display:inline-block;cursor:pointer;color:#fff !important;
;font-family:arial;font-size:13px;font-weight:bold;padding:6px
12px;text-decoration:none;text-shadow:0 1px 0
#5b8a3c}.greenbtn:hover{background:-webkit-gradient(linear,left top,left
bottom,color-stop(0.05,#72b352),color-stop(1,#77b55a));background:-moz-linear-gr
adient(top,#72b352 5%,#77b55a
100%);background:-webkit-linear-gradient(top,#72b352 5%,#77b55a
100%);background:-o-linear-gradient(top,#72b352 5%,#77b55a
100%);background:-ms-linear-gradient(top,#72b352 5%,#77b55a
100%);background:linear-gradient(to bottom,#72b352 5%,#77b55a
100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#72b352',
endColorstr='#77b55a',GradientType=0);background-color:#72b352;}.greenbtn:active{
position:relative;top:1px;}
.bluebtn{-moz-box-shadow:inset 0 1px 0 0 #54a3f7;-webkit-box-shadow:inset 0 1px
0 0 #54a3f7;box-shadow:inset 0 1px 0 0
#54a3f7;background:-webkit-gradient(linear,left top,left
bottom,color-stop(0.05,#007dc1),color-stop(1,#0061a7));background:-moz-linear-gr
adient(top,#007dc1 5%,#0061a7
100%);background:-webkit-linear-gradient(top,#007dc1 5%,#0061a7
100%);background:-o-linear-gradient(top,#007dc1 5%,#0061a7
100%);background:-ms-linear-gradient(top,#007dc1 5%,#0061a7
100%);background:linear-gradient(to bottom,#007dc1 5%,#0061a7
100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#007dc1',
endColorstr='#0061a7',GradientType=0);background-color:#007dc1;-moz-border-radiu
s:3px;-webkit-border-radius:3px;border-radius:3px;border:1px solid
#124d77;display:inline-block;cursor:pointer;color:#fff !important;
;font-family:arial;font-size:13px;padding:6px
24px;text-decoration:none;text-shadow:0 1px 0
#154682}.bluebtn:hover{background:-webkit-gradient(linear,left top,left
bottom,color-stop(0.05,#0061a7),color-stop(1,#007dc1));background:-moz-linear-gr
adient(top,#0061a7 5%,#007dc1
100%);background:-webkit-linear-gradient(top,#0061a7 5%,#007dc1
100%);background:-o-linear-gradient(top,#0061a7 5%,#007dc1
100%);background:-ms-linear-gradient(top,#0061a7 5%,#007dc1
100%);background:linear-gradient(to bottom,#0061a7 5%,#007dc1
100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0061a7',
endColorstr='#007dc1',GradientType=0);background-color:#0061a7;}.bluebtn:active{p
osition:relative;top:1px;}
.yellowbtn{-moz-box-shadow:inset 0 1px 0 0 #fff6af;-webkit-box-shadow:inset 0
1px 0 0 #fff6af;box-shadow:inset 0 1px 0 0
#fff6af;background:-webkit-gradient(linear,left top,left
bottom,color-stop(0.05,#ffec64),color-stop(1,#ffab23));background:-moz-linear-gr
adient(top,#ffec64 5%,#ffab23
100%);background:-webkit-linear-gradient(top,#ffec64 5%,#ffab23
100%);background:-o-linear-gradient(top,#ffec64 5%,#ffab23
100%);background:-ms-linear-gradient(top,#ffec64 5%,#ffab23
100%);background:linear-gradient(to bottom,#ffec64 5%,#ffab23
100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64',
endColorstr='#ffab23',GradientType=0);background-color:#ffec64;-moz-border-radiu
s:6px;-webkit-border-radius:6px;border-radius:6px;border:1px solid
#fa2;display:inline-block;cursor:pointer;color:#333 !important;
;font-family:arial;font-size:15px;font-weight:bold;padding:6px
24px;text-decoration:none;text-shadow:0 1px 0
#fe6}.yellowbtn:hover{background:-webkit-gradient(linear,left top,left
bottom,color-stop(0.05,#ffab23),color-stop(1,#ffec64));background:-moz-linear-gr
adient(top,#ffab23 5%,#ffec64
100%);background:-webkit-linear-gradient(top,#ffab23 5%,#ffec64
100%);background:-o-linear-gradient(top,#ffab23 5%,#ffec64
100%);background:-ms-linear-gradient(top,#ffab23 5%,#ffec64
100%);background:linear-gradient(to bottom,#ffab23 5%,#ffec64
100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffab23',
endColorstr='#ffec64',GradientType=0);background-color:#ffab23;}.yellowbtn:active
{position:relative;top:1px;}
/*!彩色按钮样式 结束 */
</code></pre>
更多按钮素材
温馨提示：本文最后更新于2020-02-17 01:15:08，某些文章具有时效性，若有错误或已失效，请在下方留言或联系站长。
------本页内容已结束，喜欢请分享------

感谢您的来访，获取更多精彩文章请收藏本站。

© 版权声明
版权声明 1 本网站名称：七木云网络
2 本站永久网址：https://www.qimuyun.cn
3 本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系QQ3125752002进行删除处理。
4 本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
5 本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报
6 本站资源大多存储在云盘，如发现链接失效，请联系我们我们会第一时间更新。
THE END
笔记教程
# WP美化
喜欢就支持一下吧
点赞0 分享
admin的头像-七木云
【玩机教程】PHICOMM斐讯R1音响免拆免Root完美复活-七木云
【玩机教程】PHICOMM斐讯R1音响免拆免Root完美复活
【玩机教程】PHICOMM斐讯R1音响免拆免Root完美复活
3年前 830
【知更鸟】wordpress 知更鸟begin主题使用指南-七木云
【知更鸟】wordpress 知更鸟begin主题使用指南
【知更鸟】wordpress 知更鸟begin主题使用指南
5年前 325
【Arcgis教程】arcgis中根据属性选择的方法-七木云
【Arcgis教程】arcgis中根据属性选择的方法
【Arcgis教程】arcgis中根据属性选择的方法
5年前 260
【子比美化】子比主题热门小工具合集插件（最新修复版）-七木云
【子比美化】子比主题热门小工具合集插件（最新修复版）
【子比美化】子比主题热门小工具合集插件（最新修复版）
10个月前 259
【知更鸟】begin主题常见问题-七木云
【知更鸟】begin主题常见问题
【知更鸟】begin主题常见问题
5年前 238
【知更鸟】知更鸟begin各版本主题使用指南[精细版]-七木云
【知更鸟】知更鸟begin各版本主题使用指南[精细版]
【知更鸟】知更鸟begin各版本主题使用指南[精细版]
5年前 202
相关推荐
【玩机教程】PHICOMM斐讯R1音响免拆免Root完美复活-七木云
【玩机教程】PHICOMM斐讯R1音响免拆免Root完美复活
【玩机教程】PHICOMM斐讯R1音响免拆免Root完美复活
3年前 830
【知更鸟】wordpress 知更鸟begin主题使用指南-七木云
【知更鸟】wordpress 知更鸟begin主题使用指南
【知更鸟】wordpress 知更鸟begin主题使用指南
5年前 325
【子比美化】子比主题热门小工具合集插件（最新修复版）-七木云
【子比美化】子比主题热门小工具合集插件（最新修复版）
【子比美化】子比主题热门小工具合集插件（最新修复版）
10个月前 259
【知更鸟】begin主题常见问题-七木云
【知更鸟】begin主题常见问题
【知更鸟】begin主题常见问题
5年前 238
【知更鸟】知更鸟begin各版本主题使用指南[精细版]-七木云
【知更鸟】知更鸟begin各版本主题使用指南[精细版]
【知更鸟】知更鸟begin各版本主题使用指南[精细版]
5年前 202
【子比主题美化】封面图底部/文章角标美化教程-七木云
【子比主题美化】封面图底部/文章角标美化教程
【子比主题美化】封面图底部/文章角标美化教程
12个月前 191
     
  • 168￥开通永久特权享全站资源
    •      
  • 520￥建设同站
    • ￥520
    特别特惠
    ￥699
    立即购买
    标签云
    软件安装网站安全网站优化知更鸟玩机教程抓包子比美化地图下载图床方案南方CASS七牛云WP美化WP插件WP优化WP主题shp数据SEORiPro美化PHP商用Discuz

    归档