Code Sample

Downloaded 140 times
Version 1.1.0
Released On
Updated On
File Size 43.06 Kb
MD5 Signature 18401fd7b2df3048ecd3b142f3c0e841
Licence GNU General Public License, Version 2 or later

The Code Sample plugin for JCE is a specialized tool for inserting and displaying code snippets in site content. With optional styling using the Prism library, allowing for enhanced visual presentation of code blocks.

Installation

Install using the Joomla Extensions Installer - https://docs.joomla.org/Installing_an_extension

After installation, assign the plugin to an Editor Profile in Editor Profiles -> Features & Layout by dragging the icon into an editor toolbar row.

Add the CodeSample icon to the editor toolbar

Configuration

In Joomla 4 or later, with JCE Pro 2.9.50 or later, the plugin can load the Prism Syntax Higlighter, which is used to highlight and style code inserted by Code Sample in the editor, into the front-end of your site. This can be enabled in the plugin's parameters in System -> Manage -> Plugins, by setting the Load Prism Assets to Yes. An optional URL to an alternate Font Awesome version can also be set.

Load Prism assets in the site front-end

Usage

Click the Code Sample button in the editor toolbar to open the dialog. Select the code Language, eg: Javascript, then type or paste in the code you want to display then click Insert.

Insert code using the Code Sample dialog

To edit the code, click on it to select it, then click the highlighted Code Sample button in the editor toolbar. Make any changes as required and click Update.

Edit code using the CodeSample dialog