Rashid Sharafat

<p><strong>Oriole One Instant Copy</strong> enhances the standard WordPress Gutenberg Code block (<code>core/code</code>) by injecting a small, accessible “Copy” button into the top-right corner of every code block on your site — automatically, on every existing and future post.</p>
<p>No shortcodes. No block-editor changes. No database modifications. Pure progressive enhancement.</p>
<h4>How it works</h4>
<p>The plugin uses vanilla JavaScript to detect every <code>pre.wp-block-code</code> element after the page loads and appends a lightweight Copy button. When clicked, the button copies the code text to the system clipboard using the modern <code>navigator.clipboard</code> API, with a <code>document.execCommand</code> fallback for older browsers.</p>
<p>The stored post content is never touched. If you deactivate or uninstall the plugin, your posts are exactly as they were before.</p>
<h4>Key Features</h4>
<ul>
<li><strong>Automatic</strong> — works on all existing and future posts without any editor involvement.</li>
<li><strong>Lightweight</strong> — total asset footprint under 5 KB combined (CSS + JS). Zero dependencies.</li>
<li><strong>Accessible</strong> — keyboard navigable, <code>aria-label</code> support, <code>focus-visible</code> outlines, screen-reader text, reduced-motion aware, high-contrast mode support.</li>
<li><strong>Smart enqueueing</strong> — assets are loaded only on pages that actually contain a Gutenberg code block, not on every page of your site.</li>
<li><strong>Clipboard API with fallback</strong> — uses <code>navigator.clipboard.writeText()</code> on secure contexts and falls back to <code>execCommand('copy')</code> for legacy environments.</li>
<li><strong>Duplicate-proof</strong> — skips any code block that already has a copy button to avoid conflicts with other plugins.</li>
<li><strong>Theme-safe</strong> — uses <code>currentColor</code> and semi-transparent backgrounds; works with light and dark themes without hardcoding colours.</li>
<li><strong>No jQuery</strong> — vanilla JavaScript only.</li>
<li><strong>No tracking, no telemetry, no external requests</strong> — 100% self-hosted.</li>
<li><strong>Multisite compatible</strong>.</li>
</ul>
<h4>Settings</h4>
<p>Find the settings under <strong>Settings <span aria-hidden="true" class="wp-exclude-emoji">→</span> Oriole One Instant Copy</strong>:</p>
<ul>
<li><strong>Enable / Disable</strong> the button globally.</li>
<li><strong>Button text</strong> — customise the label shown on the button (default: “Copy”).</li>
<li><strong>Success text</strong> — customise the label shown after copying (default: “Copied!”).</li>
<li><strong>Position</strong> — Top Right (additional positions planned for v2).</li>
</ul>
<h4>Developer Notes</h4>
<p>All settings use the WordPress Settings API with <code>sanitize_callback</code> and proper nonce handling via <code>settings_fields()</code>. No custom REST endpoints, no Gutenberg/React dependencies, no build tools required.</p>
<p>The plugin defines the following PHP constant and classes:</p>
<ul>
<li><code>ORIOLE_OIC_VERSION</code> — current plugin version string.</li>
<li><code>Oriole_OIC_Plugin</code> — main bootstrap class (singleton).</li>
<li><code>Oriole_OIC_Settings</code> — settings page and storage class.</li>
</ul>
<p>Option stored in <code>wp_options</code>: <code>oriole_oic_settings</code> (autoloaded, single serialised array).</p>


Oriole One Instant Copy

Automatically adds a lightweight, accessible Copy button to every Gutenberg code block. No shortcodes, no database changes.

WebberZone

Ajay

<p><strong>WebberZone Code Block Highlighting</strong> is the easiest way to add syntax highlighting to your WordPress site. It extends the native Gutenberg <code>core/code</code> block with <a href="https://prismjs.com/" rel="nofollow ugc">Prism.js</a> highlighting — no shortcodes, no block replacement, no risk of breaking existing posts.</p>
<p>Simply activate the plugin and your code blocks will instantly display beautiful, readable syntax highlighting on the frontend. Choose from 40+ programming languages and 21 colour themes, all controlled from the block editor’s Inspector Controls sidebar.</p>
<h3>Two highlighting modes</h3>
<p>Pick the rendering mode that best fits your site from the settings page:</p>
<ul>
<li><strong>Client-side (default)</strong> — <a href="https://prismjs.com/" rel="nofollow ugc">Prism.js</a> highlights your code in the browser. Best for interactive features such as copy-to-clipboard and expand/collapse.</li>
<li><strong>Server-side (highlight.php)</strong> — Code is pre-highlighted on the server with <a href="https://github.com/scrivo/highlight.php" rel="nofollow ugc">highlight.php</a>, so no Prism.js or any other JavaScript is loaded for highlighting. Ideal for performance, Core Web Vitals, AMP-style setups, and strict content-security policies.</li>
</ul>
<p>Both modes use the same 21 Prism themes and produce visually identical output, so you can switch between client-side and server-side rendering at any time without changing how your code blocks look.</p>
<h3>Why use this plugin?</h3>
<ul>
<li><strong>Safe by design</strong> — Works as a filter on top of <code>core/code</code>. Existing posts are never invalidated. Deactivate the plugin and your blocks are still valid standard WordPress code blocks.</li>
<li><strong>Zero configuration</strong> — Activate and start writing. No setup wizard, no shortcodes.</li>
<li><strong>No highlighting JavaScript in server mode</strong> — Server-side mode pre-renders syntax colours on the server. No Prism.js or any other JavaScript is enqueued for highlighting.</li>
<li><strong>Smart asset loading</strong> — Theme CSS (and, in client mode, Prism JS) only load on pages that actually contain code blocks. Pages without code stay fast.</li>
<li><strong>Per-block controls</strong> — Set language, theme, line numbers, word wrap, title, highlighted lines, and max height individually for each block.</li>
<li><strong>Developer-friendly</strong> — Filters to add languages, override themes, and force asset loading.</li>
</ul>
<h3>Supported languages</h3>
<p>40 languages including: Apache Config, Bash, C, C++, C#, CSS, Dart, Docker, F#, Go, GraphQL, Groovy, Haskell, HTML, Java, JavaScript, JSON, JSX, Kotlin, Lua, Markdown, Nginx, Objective-C, Perl, PHP, PowerShell, Python, R, Ruby, Rust, Sass, Scala, SQL, Swift, TOML, TSX, TypeScript, Vim, XML, YAML. Use the <code>wzcbh_languages</code> filter to add or remove entries from the language picker.</p>
<h3>Included themes (21)</h3>
<p>A11y Dark, Coldark Cold (Light), Coldark Dark, Dracula, Duotone Dark, Duotone Light, GitHub (Light), Gruvbox Dark, Gruvbox Light, Lucario, Material Dark, Material Light, Night Owl, Nord, One Dark, One Light, Shades of Purple, Solarized Dark, Synthwave ’84, VS Code Dark+, Xonokai (Monokai).</p>
<h3>Per-block features</h3>
<ul>
<li><strong>Language selector</strong> — Choose the programming language from the sidebar; applies the correct Prism grammar automatically.</li>
<li><strong>Line numbers</strong> — Toggle line numbers per block, with a configurable start line.</li>
<li><strong>File title / label</strong> — Add an optional filename or label displayed in the code block toolbar.</li>
<li><strong>Highlight lines</strong> — Specify lines or ranges (e.g. <code>1,3-5</code>) to visually highlight using Prism’s line-highlight plugin.</li>
<li><strong>Max height with expand/collapse</strong> — Set a maximum height in pixels; an expand/collapse toolbar button appears automatically.</li>
<li><strong>Word wrap</strong> — Toggle soft word wrapping per block.</li>
</ul>
<h3>Global settings</h3>
<ul>
<li>Highlighting mode — client-side (Prism.js) or server-side (highlight.php)</li>
<li>Default colour scheme (theme)</li>
<li>Default language</li>
<li>Default line numbers toggle and start value</li>
<li>Default word wrap</li>
<li>Copy-to-clipboard button</li>
<li>Show language label in toolbar</li>
<li>Font size</li>
</ul>
<h3>Developer filters</h3>
<ul>
<li><code>wzcbh_languages</code> — Filter the language list array (<code>slug => label</code>)</li>
<li><code>wzcbh_color_scheme_css_url</code> — Override the Prism theme CSS URL</li>
<li><code>wzcbh_force_load_assets</code> — Force Prism assets to load on every page</li>
</ul>
<h3>GDPR</h3>
<p>WebberZone Code Block Highlighting does not collect personal data, set cookies, or communicate with any external services.</p>
<h3>Contribute</h3>
<p>The plugin is open source and available on <a href="https://github.com/WebberZone/webberzone-code-block-highlighting" rel="nofollow ugc">GitHub</a>. Pull requests for bug fixes and new features are welcome. Please use the <a href="https://wordpress.org/support/plugin/webberzone-code-block-highlighting/" rel="ugc">WordPress.org support forum</a> for support and <a href="https://github.com/WebberZone/webberzone-code-block-highlighting/issues" rel="nofollow ugc">GitHub Issues</a> for confirmed bug reports.</p>
<h3>Translations</h3>
<p>Help translate WebberZone Code Block Highlighting into your language on <a href="https://translate.wordpress.org/projects/wp-plugins/webberzone-code-block-highlighting" rel="nofollow ugc">WordPress.org</a>. See the <a href="https://make.wordpress.org/polyglots/handbook/rosetta/theme-plugin-directories/" rel="nofollow ugc">Translator Handbook</a> for guidance.</p>
<h3>Other plugins by WebberZone</h3>
<ul>
<li><a href="https://wordpress.org/plugins/contextual-related-posts/" rel="ugc">Contextual Related Posts</a> — Display fast, intelligent related posts to keep visitors on your site longer</li>
<li><a href="https://wordpress.org/plugins/top-10/" rel="ugc">Top 10</a> — Track daily and total visits and display popular and trending posts</li>
<li><a href="https://wordpress.org/plugins/add-to-all/" rel="ugc">WebberZone Snippetz</a> — Manage custom HTML, CSS and JS snippets across your site</li>
<li><a href="https://wordpress.org/plugins/knowledgebase/" rel="ugc">Knowledge Base</a> — Create a knowledge base or FAQ section on your WordPress site</li>
<li><a href="https://wordpress.org/plugins/better-search/" rel="ugc">Better Search</a> — Contextual search results sorted by relevance</li>
<li><a href="https://wordpress.org/plugins/autoclose/" rel="ugc">Auto-Close</a> — Automatically close comments, pingbacks, trackbacks and manage revisions</li>
<li><a href="https://wordpress.org/plugins/popular-authors/" rel="ugc">Popular Authors</a> — Display popular authors in a WordPress widget</li>
<li><a href="https://wordpress.org/plugins/where-did-they-go-from-here/" rel="ugc">Followed Posts</a> — Show related posts based on what your visitors have already read</li>
<li><a href="https://wordpress.org/plugins/webberzone-link-warnings/" rel="ugc">WebberZone Link Warnings</a> — Add accessible warnings for external links and target=”_blank” links</li>
</ul>


WebberZone Code Block Highlighting

Syntax highlighting for the Gutenberg Code block — Prism.js, 21 themes, 40+ languages, plus an optional server-side highlighting mode.

Oriole One Instant Copy vs WebberZone Code Block Highlighting