Pavel

<p>The “Light Code Block” plugin is a simple and lightweight solution for inserting and displaying code snippets in posts and pages.<br />
It works by adding a custom “LC” button to the TinyMCE (Classic) editor or a code block in the Gutenberg editor.</p>
<p>The inserted code will be shown on the front end in a clean, readable format.</p>
<h3>Usage</h3>
<ul>
<li>Install and activate the plugin.</li>
<li>Go to the post or page edit screen.</li>
<li>In the TinyMCE (Classic) editor, click the <strong>“LC”</strong> button in the toolbar.</li>
<li>In the popup window that opens, paste or write your code, and click <strong>OK</strong>.</li>
<li>Save or update your post.</li>
</ul>
<p>The code will be saved inside a special block and displayed on the front end within a <code><pre></code> tag with the class <code>mce-simple-code-block</code> (i.e., <code><pre class="mce-simple-code-block">...</pre></code>).</p>
<p>To insert code using the Gutenberg editor, you first need to add a Classic (TinyMCE) block, and then use it to insert your code.</p>


Light Code Block

The "Light Code Block" plugin is the simplest and lightest plugin for inserting and displaying code.

redcocker

homolibere

<p>“SyntaxHighlighter TinyMCE Button” provides additional buttons for “Visual Editor(TinyMCE)” and these buttons will help to type or edit <code><pre></code> tag for Alex Gorbatchev’s SyntaxHighlighter.</p>
<p>This plugin is based on “<a href="https://wordpress.org/extend/plugins/codecolorer-tinymce-button/" title="homolibere developed" rel="ugc">CodeColorer TinyMCE Button</a>” and becomes more feature-rich.</p>
<h4>Features</h4>
<ul>
<li>You can operate in Visual Editor, No need to use HTML Editor.</li>
<li>Using two buttons, easy to wrap your code in <code><pre></code> tag and change options of previously-wrapped code.</li>
<li>Once your code is wrapped in <code><pre></code> tag, You can type ‘tabs’ for indent.</li>
<li>Localization: English(Default), 日本語(Japanese, UTF-8).</li>
</ul>
<h4>Compliant plugins</h4>
<p>You can use this plugin with following code syntax highlighter.</p>
<ul>
<li><a href="https://wordpress.org/extend/plugins/wp-syntaxhighlighter/" title="WP SyntaxHighlighter" rel="ugc">WP SyntaxHighlighter</a> (recommend)</li>
<li><a href="https://wordpress.org/extend/plugins/syntax-highlighter-compress/" title="Syntax Highlighter Compress" rel="ugc">Syntax Highlighter Compress</a></li>
<li><a href="https://wordpress.org/extend/plugins/auto-syntaxhighlighter/" title="Auto SyntaxHighlighter" rel="ugc">Auto SyntaxHighlighter</a></li>
<li><a href="https://wordpress.org/extend/plugins/syntax-highlighter-and-code-prettifier/" title="Syntax Highlighter and Code Colorizer for WordPress" rel="ugc">Syntax Highlighter and Code Colorizer for WordPress</a></li>
<li><a href="https://wordpress.org/extend/plugins/syntax-highlighter-mt/" title="Syntax Highlighter MT" rel="ugc">Syntax Highlighter MT</a></li>
<li><a href="https://wordpress.org/extend/plugins/syntaxhighlighterpro/" title="SyntaxHighlighterPro" rel="ugc">SyntaxHighlighterPro</a></li>
<li><a href="https://wordpress.org/extend/plugins/easy-google-syntax-highlighter/" title="Easy Google Syntax Highlighter" rel="ugc">Easy Google Syntax Highlighter</a></li>
<li><a href="https://wordpress.org/extend/plugins/syntaxhighlighter/" title="SyntaxHighlighter Evolved" rel="ugc">SyntaxHighlighter Evolved</a> etc.</li>
</ul>
<p>When using with “SyntaxHighlighter Evolved”, “Load All Brushes” option must be enabled on the “SyntaxHighlighter” setting panel.</p>
<p>This plugin has operating modes optimized for “WP SyntaxHighlighter”, “Syntax Highlighter Compress” or “SyntaxHighlighter Evolved”.</p>
<h4>Notes</h4>
<p>This plugin can work only with the default visual editor(TinyMCE). Other visual editors are not supported.</p>
<p>This plugin is designed to work with a plugin based on Alex Gorbatchev’s SyntaxHighlighter Ver, 2.0 or higher.</p>
<p>You can not use this plugin with some ‘SyntaxHighlighter’-based plugins which do not support <code><pre></code> tag.</p>


SyntaxHighlighter TinyMCE Button

"SyntaxHighlighter TinyMCE Button" provides buttons for Visual Editor and will help to type <pre> tag for SyntaxHighlighter.

Light Code Block vs SyntaxHighlighter TinyMCE Button