一般主题编辑器增加标签
标签其实WordPress后台编辑器里已经内置了一些标签,但是这些标签远远不能满足我们日常的使用,所以只能我们自己DIY了,
vieu主题增加标签
通过阅读源码我们得知,vieu主题的标签在\vieu\include\modules\mo_editbutton.php目录下,我这里就教大家加几个我经常用到的吧,有
H2毛笔标
H2设置标
H2下载标
H2微信标
H2QQ标
我们只需要将以下代码放进\vieu\include\modules\mo_editbutton.php文件末尾即可
QTags.addButton( ‘H2pen’, ‘H2毛笔标’, ‘<h2 class=”section-title”><span><i class=”fa fa-paint-brush”></i>’, ‘文字</span></h2>’,”,’H2毛笔’ );
QTags.addButton( ‘H2set’, ‘H2设置标’, ‘<h2 class=”section-title”><span><i class=”fa fa-gear”></i>’, ‘文字</span></h2>’,”,’H2设置’ );
QTags.addButton( ‘H2download’, ‘H2下载标’, ‘<h2 class=”section-title”><span><i class=”fa fa-cloud-download”></i>’, ‘文字</span></h2>’,”,’H2下载’ );
QTags.addButton( ‘H2wechat’, ‘H2微信标’, ‘<h2 class=”section-title”><span><i class=”fa fa-wechat”></i>’, ‘文字</span></h2>’,”,’H2微信’ );
QTags.addButton( ‘H2mht’, ‘H2QQ企鹅标’, ‘<h2 class=”section-title”><span><i class=”fa fa-qq”></i>’, ‘文字</span></h2>’,”,’H2QQ’ );
代码解析
QTags.addButton( ”, ”, ”, ” );
【四对引号,分别表示按钮的ID、按钮显示名、点一下输入内容、再点一下关闭内容(最后一对引号为空则一次输入全部内容),\n表示换行】
形象说明: QTags.addButton( ‘ 按钮ID’, ‘按钮显示名’, ‘点一下输入内容’, ‘点一下关闭内容’ );
可以自定义添加多行 QTags.addButton( ”, ”, ”, ” ); 增加多个按钮!
然后添加样式文件到/vieu/static/css/main.css文件,将以下代码添加进main.css末尾即可,一般不建议在代码中间加,防止自己弄错了也方便后期好维护。【当然大佬除外】
/*标签*/
h2 i[class^=”icon-“]:before,
h2 i[class*=” icon-“]:before,
h2 i.fa:before {
display: inline;
margin-left: 0;
margin-right: 0;
}
.section-title {
position: relative;
margin-bottom: 1em;
font-size: 12px;
letter-spacing: 1px;
font-weight: 700;
}
.section-title:before {
content: “”;
position: absolute;
top: 50%;
left: 0;
margin-top: 3px;
width: 100%;
border-bottom: 4px solid #F4F6F7;
}
.section-title span {
position: relative;
display: inline-block;
padding-right: 1.4em;
background: #fff;
}
.row+.section-title {
margin-top: 3em;
}
.section-title+p {
margin-top: 2em;
}
方法二
方法很简单,依样画葫芦即可。在主题的functions.php 文件下加入以下代码:
add_action(‘admin_print_scripts’, ‘my_quicktags’); function my_quicktags() { wp_enqueue_script( ‘my_quicktags’, get_stylesheet_directory_uri().’/my_quicktags.js’, array(‘quicktags’) ); } |
---|
然后创建一个my_quicktags.js文件,按钮便是在这里自定义的,先给出个定义< h1 >
标签的例子:
QTags.addButton( ‘h1’, ‘h1’, “\n<h1>”, “</h1>\n” ); //快捷输入h1标签 |
---|
未经允许不得转载:作者:知道君, 转载或复制请以 超链接形式 并注明出处 夏末浅笑。
原文地址:《#教程#简单两步给wordpress后台编辑器增加H2毛笔标、设置标、微信标等》 发布于2019-08-27
评论 抢沙发