Title: Code Block – share beautiful code snippets readers can copy Author: bPlugins Published: ଏପ୍ରିଲ 22, 2025 Last modified: ଅଗଷ୍ଟ 29, 2026 --- Search plugins ![](https://ps.w.org/code-snippets-block/assets/banner-772x250.png?rev=3623256) ![](https://ps.w.org/code-snippets-block/assets/icon.svg?rev=3623256) # Code Block – share beautiful code snippets readers can copy By [bPlugins](https://profiles.wordpress.org/bplugins/) [Download](https://downloads.wordpress.org/plugin/code-snippets-block.1.1.5.zip) * [Details](https://ory.wordpress.org/plugins/code-snippets-block/#description) * [Reviews](https://ory.wordpress.org/plugins/code-snippets-block/#reviews) * [Installation](https://ory.wordpress.org/plugins/code-snippets-block/#installation) * [Development](https://ory.wordpress.org/plugins/code-snippets-block/#developers) [Support](https://wordpress.org/support/plugin/code-snippets-block/) ## Description **Turn plain code into beautifully highlighted, copy-ready snippets your readers will love – right inside the Gutenberg editor.** [**Code Snippets Block**](https://bplugins.com/products/code-snippets-block/) | [**Pricing**](https://bplugins.com/products/code-snippets-block/pricing/) | [**Support**](https://bplugins.com/support/) | [**Live Demos**](https://bblockswp.com/demo/code-snippets-block-all-demo/) ### What Is Code Snippets Block? **Code Snippets Block** is a lightweight WordPress code block plugin for displaying programming code with syntax highlighting, copy-to-clipboard functionality, responsive layouts, and multiple visual themes. Add clean and readable code examples to WordPress posts, pages, documentation, tutorials, developer portfolios, knowledge bases, and technical websites without writing custom code. The plugin works directly with the **WordPress Gutenberg Block Editor** and supports popular programming languages including PHP, JavaScript, Python, HTML, CSS, JSON, and SQL. ### Why Use Code Snippets Block? Publishing code in a normal text editor can make technical content difficult to read and copy. Code Snippets Block turns your code into a structured, highlighted, and copy-ready code block. It is useful for developers, technical writers, educators, bloggers, documentation creators, agencies, and anyone publishing programming content with WordPress. ### Free Features * **One-Click Copy Button:** Readers copy the entire snippet to their clipboard in a single click, with customizable text/icon. * **Multiple Syntax Themes:** Choose from pre-styled themes (like Dark, Midnight, and Light) to match your website design. * **Syntax Highlighting:** Improve readability for all major languages – PHP, JavaScript, Python, HTML, CSS, and more. * **Responsive Code Views:** Snippets wrap and resize smoothly on mobile, tablet, and desktop. * **Shortcode Support:** Embed code snippets anywhere on your site. * **Dedicated Block Category:** All blocks are grouped under a “Code” category in the Gutenberg inserter for easy access. * **Optimized & Lightweight:** Assets load only when a block is on the page, with minimal impact on page speed. ### Pro Version Upgrade to [**Pro**](https://bplugins.com/products/code-snippets-block/pricing/) to unlock a suite of 16 interactive developer blocks: * **Run Python (WASM):** A live Python interpreter powered by Pyodide (WebAssembly) that runs in the reader’s browser – no server-side execution, lazy-loaded for speed. * **Code Screencast (Self-Typing):** Animated, character-by-character typing walkthroughs. * **JSON Explorer:** Interactive, collapsible, searchable JSON tree views with match-highlighting and copy-path tools. * **Regex Tester:** A live regular-expression sandbox with highlighted match output. * **Spotlight Code:** Walk readers through specific lines by dimming or blurring the rest, with captioned steps. * **Code Snapshot:** Turn snippets into mockup graphics with window chrome, gradients, and shadows – download as PNG or copy image. * **API Try-It Console:** A functional HTTP/REST client block for live requests with timing, status, and formatted responses. * **Annotated Code:** Clickable badges on specific lines that reveal detailed explanations. * **AI Code Explainer:** Generate plain-English explanations using OpenAI or Anthropic inside the editor. * **Diagram as Code:** Write Mermaid text and render flowcharts, sequence diagrams, class diagrams, Gantt charts, and pie charts. * **Live Code Playground:** An HTML/CSS/JS sandbox in a secure iframe with instant visual previews. * **Code Diff / Comparison:** Highlight added/removed lines in Unified or Split view. * **Multi-Tab Code Switcher:** Organize snippets under tabs (e.g. npm vs yarn, or JavaScript vs PHP). * **Terminal / Command Line:** A styled shell emulator with typing animations and one-click copy of commands. * **Remote Code Embed:** Fetch code from GitHub Gists, raw files, or CodePen pens, styled in your own theme. * **Advanced Code Block Styling:** Custom colors, font sizes, paddings, borders, shadows, alignment, and line numbering. ### How to Use 1. Install and activate the **Code Snippets Block** plugin. 2. In the Gutenberg editor, add the **Code Snippets** block. 3. Paste your code and pick a syntax theme. 4. Adjust settings from the right-side settings sidebar. 5. Publish – your highlighted, copy-ready snippet is live! ### Use Cases * **Programming Tutorials:** Make your snippets easy to read and copy. * **Developer Documentation:** Keep code examples clean and consistent. * **Developer Portfolios:** Showcase your clean code with pride. * **Technical Knowledge Bases:** Present reference code in a professional format. * **Educational Coding Resources:** Help students follow along and copy examples. ### What Can You Do With Code Snippets Block? Code Snippets Block helps you publish programming and developer content directly in WordPress. You can use it to: * Add syntax-highlighted code to WordPress posts and pages. * Create copyable programming examples. * Publish coding tutorials. * Build developer documentation. * Create technical knowledge bases. * Display API examples. * Present JSON data. * Compare different versions of code. * Create interactive HTML, CSS, and JavaScript examples. * Explain programming code with AI. * Create developer-focused portfolio pages. ### Who Is Code Snippets Block For? Code Snippets Block is designed for: * WordPress developers * Web developers * Programming bloggers * Technical writers * Documentation teams * Online educators * Coding tutorial creators * Developer portfolio owners * Software agencies * Technical knowledge-base websites ### How to Add Code with Shortcode Code Snippets Block also supports shortcode-based embedding. 1. Create your code snippet. 2. Copy the generated shortcode. 3. Paste the shortcode into a shortcode-supported area. 4. Save or publish the page. This allows you to display code snippets in different areas of your WordPress website. Liked this plugin? Want a new feature? [Send us some feedback](https://ory.wordpress.org/plugins/code-snippets-block/support@bplugins.com?output_format=md). ### ⭐ Check out the Parent Plugin of this plugin- 🔥 **[b Blocks](https://bblockswp.com/)** – Best gutenberg blocks collections for WordPress. ### ⭐ Check out our other WordPress Plugins- 🔥 **[Html5 Audio Player](https://audioplayerwp.com/)** – Best audio player plugin for WordPress. 🔥 **[Html5 Video Player](https://wpvideoplayer.com/)** – Best video player plugin for WordPress. 🔥 **[PDF Poster](http://pdfposter.com/)** – A fully-featured PDF Viewer Plugin for WordPress. 🔥 **[StreamCast](https://wordpress.org/plugins/streamcast)** – A fully-featured Radio Player Plugin for WordPress. 🔥 **[3D Viewer](https://3d-viewer.bplugins.com/)** – Display interactive 3D models on the webs. ## Screenshots [⌊Code Snippets Admin Dashboard⌉⌊Code Snippets Admin Dashboard⌉[ Code Snippets Admin Dashboard [⌊Add New FAQ (ShortCode)⌉⌊Add New FAQ (ShortCode)⌉[ Add New FAQ (ShortCode) [⌊Default Theme⌉⌊Default Theme⌉[ Default Theme [⌊Dark Theme⌉⌊Dark Theme⌉[ Dark Theme [⌊Tomorrow Theme⌉⌊Tomorrow Theme⌉[ Tomorrow Theme [⌊Solarized Light Theme⌉⌊Solarized Light Theme⌉[ Solarized Light Theme [⌊Twilight Theme⌉⌊Twilight Theme⌉[ Twilight Theme [⌊Porple Theme⌉⌊Porple Theme⌉[ Porple Theme [⌊White Theme⌉⌊White Theme⌉[ White Theme [⌊Github Theme⌉⌊Github Theme⌉[ Github Theme [⌊Gradient-Light Theme⌉⌊Gradient-Light Theme⌉[ Gradient-Light Theme [⌊VSCode-Dark Theme⌉⌊VSCode-Dark Theme⌉[ VSCode-Dark Theme [⌊Codepan Embeb Theme⌉⌊Codepan Embeb Theme⌉[ Codepan Embeb Theme [⌊Far Theme⌉⌊Far Theme⌉[ Far Theme [⌊Gutenberg Block Support⌉⌊Gutenberg Block Support⌉[ Gutenberg Block Support [⌊Gutenberg Block Settings⌉⌊Gutenberg Block Settings⌉[ Gutenberg Block Settings ## Blocks This plugin provides 1 block. * Code The Code Snippets block plugin lets you easily copy, style, and view beautifully highlighted code. ## Installation **From your WordPress dashboard (recommended):** 1. Go to **Plugins Add New**. 2. Search for **“Code Snippets Block”**. 3. Click **Install Now**, then **Activate**. 4. Add the **Code Snippets** block to any post or page in the Gutenberg editor. **Manual installation:** 1. Download the **Code Snippets Block** plugin (_.zip file_). 2. In your admin area, go to **Plugins Add New** and click **Upload Plugin**. 3. Choose the **`code-snippets-block.zip`** file and click **Install Now**. 4. Activate the plugin through the **Plugins** menu in WordPress. ## FAQ ### Is Code Snippets Block free? Yes, Code Snippets Block is a free Gutenberg block plugin. A Pro version with 16 additional developer blocks is also available. ### Does it work with any WordPress theme? Yes, it will work with any standard WordPress theme. ### Which programming languages does it support? The block highlights all major languages, including PHP, JavaScript, Python, HTML, CSS, JSON, and SQL. ### Can visitors copy the code from my site? Yes. Every snippet includes a one-click copy-to-clipboard button, and you can customize its text or icon. ### Can I change the look of the code block? Yes. Choose from multiple built-in color themes and change block settings from the Gutenberg editor’s right sidebar. ### Will this plugin slow down my site? No. The plugin is lightweight and its optimized assets load only on pages where a block is actually used. ### How many times can I reuse the block? You can use the block an unlimited number of times. ### Where can I get support? You can post your questions on the [support forum here](https://wordpress.org/plugins/code-snippets-block/). ## Reviews There are no reviews for this plugin. ## Contributors & Developers “Code Block – share beautiful code snippets readers can copy” is open source software. The following people have contributed to this plugin. Contributors * [ bPlugins ](https://profiles.wordpress.org/bplugins/) * [ Abu Hayat ](https://profiles.wordpress.org/abuhayat/) * [ Freemius ](https://profiles.wordpress.org/freemius/) * [ Prosanta Roy ](https://profiles.wordpress.org/prosanta10/) [Translate “Code Block – share beautiful code snippets readers can copy” into your language.](https://translate.wordpress.org/projects/wp-plugins/code-snippets-block) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/code-snippets-block/), check out the [SVN repository](https://plugins.svn.wordpress.org/code-snippets-block/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/code-snippets-block/) by [RSS](https://plugins.trac.wordpress.org/log/code-snippets-block/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 1.1.5 – 13 July, 2026 * Fixed plugin editor page install issue. * Some Assets optimization and performance issue fixed. #### 1.1.4 – 12 July, 2026 * Added dynamic assets loading. * Fixed assets loading issues. #### 1.1.3 – 5 July, 2026 * Updated all code blocks. * Fixed plugin register issue. #### 1.1.2 – 29 June, 2026 * Updated Dashboard for showcase blocks * Run Python (WASM) block and JSON Explorer block responsive issues fixed #### 1.1.0 – 23 June, 2026 * Added new 16 blocks – Run Python (WASM), Code Screencast (Self-Typing), JSON Explorer, Regex Tester, Spotlight Code, Code Snapshot, API Try-It Console, Annotated Code, AI Code Explainer, Diagram as Code, Live Code Playground, Code Diff / Comparison, Multi-Tab Code Switcher, Terminal / Command Line, Remote Code Embed. * Plugin title change and updated block title * Updated Dashboard for showcase blocks * performance issue fixed #### 1.0.3 – 14 Oct, 2025 * remove extra double #### 1.0.2 – 27 April, 2025 * border issues fixed; * Plugin title change, block title change and some assets updated #### 1.0.1 – 22 April, 2025 * Some issues fixed; * assets added; #### 1.0.0 * Initial Release ## Meta * Version **1.1.5** * Last updated **1 week ago** * Active installations **200+** * WordPress version ** 6.5 or higher ** * Tested up to **7.1** * PHP version ** 7.4 or higher ** * Language * [English (US)](https://wordpress.org/plugins/code-snippets-block/) * Tags * [code block](https://ory.wordpress.org/plugins/tags/code-block/)[Code Highlight](https://ory.wordpress.org/plugins/tags/code-highlight/) [code-snippets](https://ory.wordpress.org/plugins/tags/code-snippets/)[Gutenberg block](https://ory.wordpress.org/plugins/tags/gutenberg-block/) [syntax highlighting](https://ory.wordpress.org/plugins/tags/syntax-highlighting/) * [Advanced View](https://ory.wordpress.org/plugins/code-snippets-block/advanced/) ## Ratings No reviews have been submitted yet. [Your review](https://wordpress.org/support/plugin/code-snippets-block/reviews/#new-post) [See all reviews](https://wordpress.org/support/plugin/code-snippets-block/reviews/) ## Contributors * [ bPlugins ](https://profiles.wordpress.org/bplugins/) * [ Abu Hayat ](https://profiles.wordpress.org/abuhayat/) * [ Freemius ](https://profiles.wordpress.org/freemius/) * [ Prosanta Roy ](https://profiles.wordpress.org/prosanta10/) ## Support Got something to say? Need help? [View support forum](https://wordpress.org/support/plugin/code-snippets-block/) ## Donate Would you like to support the advancement of this plugin? [ Donate to this plugin ](https://www.buymeacoffee.com/abuhayat)