DUX主题4.1版本发布已经有一段时间了，该版本增加了一个文章和页面内容亮点的功能，关于该功能的前端显示大致如下：

  1. DUX主题亮点1蝈蝈要安静 | 一个不学无术的伪程序员
  2. DUX主题亮点2蝈蝈要安静 | 一个不学无术的伪程序员

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

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

其实就是一个有序列表，并且列表的样式为 class="liangdian" 但是对于平时我个人编辑文章的习惯来看懒得去敲这两行代码于是决定为其在后台增加一个快捷按钮，于是也就有了这篇文章，编辑器添加按钮的方式我之前也说过，当然你也可以参照下面几篇文章了解一下：

代码实现非常简单，你只需要将以下代码添加到主题的 functions.php 文件中去即可：

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

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

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

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

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

如此，添加完成。