Esiry.com
Focus on Machine Learning.

Add custom commands to the WordPress text editor

WordPress‘s text editor can directly edit the code of the article, reduce the occurrence of errors, and greatly improve the efficiency. In the visual interface editing, it often fails to achieve the desired result, which is more suitable for editing the text code. Preview, the two complement each other, perfect!

The default text editor has only a few commands, even the hierarchical title commands. Manually entering these can be very tedious and repeatable.

Add custom commands to the WordPress text editor
Now let’s add some common button commands: first level title, second level title, third level title, code, line number code, add the following code between <?php and ?> in the Wordspress theme’s functions.php, if You also need other commands to refer to add.

 /* 文本编辑器自定义按钮 */
function appthemes_add_quicktags() {
?> 
<script type="text/javascript"> 
QTags.addButton( '一级标题', '一级标题', '<h1>', '</h1>' );
QTags.addButton( '二级标题', '二级标题', '<h2>', '</h2>' );
QTags.addButton( '三级标题', '三级标题', '<h3>', '</h3>' );
QTags.addButton( '代码', '代码', '<pre>', '</pre>' );
QTags.addButton( '带行号代码', '带行号代码', '<pre class="prettyprint linenums">', '</pre>' );
</script>
<?php
}
add_action('admin_print_footer_scripts', 'appthemes_add_quicktags' );


Effect chart:

Add custom commands to the WordPress text editor
Instructions:
Select the text, click on the command, the text will be enclosed by the command

 

Your support will encourage us to be creative continuously!

Use [WeChat] Scan QR code for Appreciation

Use [Alipay] Scan QR code for Appreciation

Jumping to PayPal...
赞(0)
Please indicate the source:Esiry » Add custom commands to the WordPress text editor

Comment 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址