把WP-GeSHi-Highlight代码高亮插件集成到wordpress文本编辑器

官方金沙娱乐赌场网站_赌博娱乐注册送18现金,4.林丹妻子:谢杏芳谢杏芳和林丹在1997年就已经相恋,距今已经快20年了,如果不是今年爆出的出轨绯闻,他们无疑是当今中国体坛恋爱长跑时间最长的情侣之一,而且,两人的大赛成绩也同样非常骄人,谢杏芳在2009年退役前曾经拿到过羽毛球世界冠军,奥运会银牌等荣誉,林丹则是中国羽毛球的一哥,全满贯得主。,直觉告诉她,“外公可能买到了假货。,据悉,2016年12月2日,云浮“粤W66666”的车牌竞拍创下了150万元的云浮车牌价格纪录,成为云浮“最贵铁皮”。该车牌的竞投得主是某位石材老板。本次“粤W88888”的出现,让人也不禁怀疑是高价购买的。

511遇见

以上图片是我编辑器使用的快捷按钮,在编辑文章代码时不用再手动输入标签,显得十分方便。先分享一下代码:

  1. /**
  2. * wordpress编辑器自定义WP-GeSHi-Highlight快捷标签按钮
  3. */
  4. add_action('admin_print_footer_scripts','eg_quicktags');
  5. function eg_quicktags() {
  6. ?>
  7.  <script type="text/javascript" charset="utf-8">
  8. QTags.addButton( 'eg_pre', 'pre', ' <pre>\n\n </pre>', '', 'q' );
  9. QTags.addButton( 'css_pre', 'pre-css', ' <pre lang="css" line="1" escaped="true">\n\n </pre>', '', 'c' );
  10. QTags.addButton( 'phs_pre', 'pre-php', ' <pre lang="php" line="1" escaped="true">\n\n </pre>', '', 'p' );
  11. QTags.addButton( 'html_pre', 'pre-html', ' <pre lang="html" line="1" escaped="true">\n\n </pre>', '', 'h' );
  12. QTags.addButton( 'js_pre', 'pre-js', ' <pre lang="JavaScript" line="1" escaped="true">\n\n </pre>', '', 'js' );
  13. QTags.addButton( 'p_p', 'p-zhy', ' <p class="alert alert-info" role="alert"> <strong>xxx  </strong> ......  </p>', '', 'zy' );
  14. QTags.addButton( 'h_3', 'h-3', ' <h3 class="text-primary"> <strong> xxx  </strong></h3>', '', 'h3' );
  15.  </script>
  16.  <?php
  17. }

代码解析:

1、QTags.addButton( );

QTags.addButton( '', '', '', '' );

【四对引号,分别表示按钮的ID、按钮显示名、点一下输入内容、再点一下关闭内容(最后一对引号为空则一次输入全部内容),\n表示换行】

QTags.addButton( '按钮ID', '按钮显示名', '点一下输入内容', '点一下关闭内容' );

可以自定义添加多行 QTags.addButton( ); 增加多个按钮!

2、ID必须不同,显示名称随便起个有意义的。

3、代码放在functions.php文件中,建议后面。

4、本站使用个WP是4.5.3完全兼容通过。

5、你如果使用的代码高亮插件是WP-GeSHi-Highlight,下面可以省略:

    (1)pre-css点击插入代码效果
  1.  <pre lang="css" line="1" escaped="true">
  2.  
  3.   </pre>
    (2)pre-php点击插入代码效果
  1.  <pre lang="php" line="1" escaped="true">
  2.  
  3.   </pre>
    (3)pre-html点击插入代码效果
  1.  <pre lang="html" line="1" escaped="true">
  2.  
  3.   </pre>
    (4)pre-js点击插入代码效果
  1.  <pre lang="JavaScript" line="1" escaped="true">
  2.  
  3.   </pre>

为了输入代码方便,我们加入了空格,以上效果都是格式化后的效果,如果你对本站的代码高亮插件的样式感兴趣,建议阅读

WordPress代码高亮插件 WP-GeSHi-Highlight

由于本站基于Bootstrap所有其他都是Bootstrap集成的功能,你可以根据自己的需要添加自己最常用的代码插入按钮,方便自己在文本模式下编辑。


发布日期:

所属分类: Wordpress 插件 标签: