为亮点功能添加快捷按钮

其实该功能主要是通过 CSS 样式的调整来实现的,实现方式虽然简单但是前端显示效果确实不错,官方给出的调用方式也极其简单,通过下面两行代码调用:

<ol class="liangdian">
<li><strong>标题标题标题<n/strong>描述描述描述描述描述描述描述描述描述描述描述</li>
<li><strong>标题标题标题</strong>描述描述描述描述描述描述描述描述描述描述描述</li>
复制上一行会增加新的
</ol>

其实就是一个有序列表,并且列表的样式为 class="liangdian" 但是对于平时我个人编辑文章的习惯来看懒得去敲这两行代码于是决定为其在后台增加一个快捷按钮,代码实现非常简单,你只需要将以下代码添加到主题的 functions.php 文件中去即可:

// 亮点功能快捷按钮
function wzt_liangdian($atts, $content=null){ 
    return '<ol class="liangdian">'.$content.'</ol>'; 
}
function appthemes_add_wzt_liangdian() {
?>
    <script type="text/javascript">
        if ( typeof QTags != 'undefined' ) {
            QTags.addButton( 'wzt_liangdian', '亮点展示框', '
<li><strong>亮点标题</strong>亮点描述内容</li>', '' );
        } 
    </script>
<?php 
} 
add_action('admin_print_footer_scripts', 'appthemes_add_wzt_liangdian' ); 
add_shortcode('wzt_liangdian','wzt_liangdian');

其实就是添加一个 QuickTag ,添加完代码后会在后台文本编辑模式下找到一个“亮点展示框”的按钮,双击按钮即可添加一个亮点显示区域,点击按钮后会出现如下代码:

【wzt_liangdian]<li><strong>亮点标题</strong>亮点描述内容</li>[/wzt_liangdian]

因为不同文章亮点不同,无法固定亮点项目数量,目前代码只能添加一个亮点展示框,不过你可以逐一增加 li 标签来增加多个,如下所示:

【wzt_liangdian]<li><strong>亮点标题</strong>亮点描述内容</li><li><strong>亮点标题</strong>亮点描述内容</li>[/wzt_liangdian]

 

 

 

 

 

 

这篇文章如果帮到了你 打赏

展开阅读全文

分享到: 更多 (0)
赞(0)
如果文章内容或图片资源失效或者您对文章有异议,请留言反馈或点击右下角邮件图标发送邮件说明情况,我们会及时处理,谢谢!

评论 抢沙发



觉得文章有用就赞赏支持一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏