Below, you’ll find a detailed guide on how to add the Enlighter – Customizable Syntax Highlighter Shortcodes to your WordPress website, including their parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Enlighter – Customizable Syntax Highlighter Plugin shortcodes not to show or not to work correctly.
Before starting, here is an overview of the Enlighter – Customizable Syntax Highlighter Plugin and the shortcodes it provides:
"Enlighter – Customizable Syntax Highlighter is a WordPress plugin designed to enhance your site's code readability. It helps to highlight syntax, making code easier to understand and read."
- [enlighter]
- [codegroup]
- [enlighter]
Enlighter Customizable Syntax Highlighter [enlighter] Shortcode
The Enlighter shortcode is a powerful tool in WordPress development. It’s used to handle generic shortcodes within the Enlighter plugin. This shortcode takes optional language attributes and content, defaulting to ‘generic’ if no language is specified. It then runs the micro shortcode handler with the given language key, returning the processed content.
Shortcode: [enlighter]
Parameters
Here is a list of all possible enlighter shortcode parameters and attributes:
shortcodeAttributes– The array of parameters passed to the shortcodecontent– The enclosed content within the shortcode, if anytagname– The shortcode tag used, default is emptylang– The language attribute for syntax highlighting, default is ‘generic’
Examples and Usage
Basic Example – A simple usage of the Enlighter shortcode to highlight code in a generic language.
[enlighter lang="generic"]Your code here[/enlighter]Advanced Examples
Highlighting a specific language – In this example, the Enlighter shortcode is used to highlight code written in JavaScript.
[enlighter lang="javascript"]Your JavaScript code here[/enlighter]Using nested shortcodes – The Enlighter shortcode can also be nested within other shortcodes. In the following example, the Enlighter shortcode is nested within a div shortcode to provide a styled container for the highlighted code.
[div style="background-color: #f9f9f9; padding: 10px;"][enlighter lang="php"]Your PHP code here[/enlighter][/div]PHP Function Code
In case you have difficulties debugging what causing issues with [enlighter] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('enlighter', array($this, 'genericShortcodeHandler'));Shortcode PHP function:
function genericShortcodeHandler($shortcodeAttributes=NULL, $content='', $tagname=''){
// default language
$language = (isset($shortcodeAttributes['lang']) ? $shortcodeAttributes['lang'] : 'generic');
// run micro shortcode handler with given language key
return $this->microShortcodeHandler($shortcodeAttributes, $content, $language);
}
Code file location:
enlighter/enlighter/modules/filter/LegacyShortcodeHandler.phpEnlighter – Customizable Syntax Highlighter [codegroup] Shortcode
The Enlighter plugin shortcode ‘codegroup’ is designed to handle code groups in a WordPress post. It assigns unique IDs and themes to each group. This shortcode allows the customization of the ‘theme’ attribute. It also removes any auto-generated HTML editor tags for clean content display.
Shortcode: [codegroup]
Parameters
Here is a list of all possible codegroup shortcode parameters and attributes:
theme– Sets the visual theme for the code block.
Examples and Usage
Basic example – A simple usage of the ‘codegroup’ shortcode without any additional parameters. It uses the default theme set in the Enlighter plugin settings.
[codegroup]Advanced examples
Using the ‘codegroup’ shortcode with a specified theme. This overrides the default theme set in the Enlighter plugin settings for this particular code block.
[codegroup theme="atomic"]Combining the ‘codegroup’ shortcode with other shortcodes. In this example, the ‘codegroup’ shortcode is used to group two ‘code’ shortcodes, each displaying a different piece of code. The ‘codegroup’ shortcode is used to apply the same theme to both code blocks.
[codegroup theme="atomic"]
// Some PHP code here
// Some JavaScript code here
[/codegroup]Note: The ‘theme’ attribute in the ‘codegroup’ shortcode supports all themes available in the Enlighter plugin. In the above examples, ‘atomic’ is used as the theme, but you can replace it with any other valid theme name.
PHP Function Code
In case you have difficulties debugging what causing issues with [codegroup] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('codegroup', array($this, 'codegroupShortcodeHandler'));Shortcode PHP function:
function codegroupShortcodeHandler($shortcodeAttributes=NULL, $content='', $tagname=''){
// default attribute settings
$shortcodeAttributes = shortcode_atts(
array(
'theme' => $this->_config['enlighterjs-theme']
), $shortcodeAttributes);
// html "pre"-tag attributes
$htmlAttributes = array(
'data-enlighter-theme' => $shortcodeAttributes['theme'],
'class' => 'EnlighterJSRAW',
'data-enlighter-group' => uniqid()
);
// assign html attrivutes
$this->_activeCodegroup = $htmlAttributes;
// call micro shortcode handlers
$content = do_shortcode($content);
// remove automatic generated html editor tags (from wpautop())
$content = $this->removeWpAutoP($content);
// disable group flag
$this->_activeCodegroup = NULL;
// return parsed content
return $content;
}
Code file location:
enlighter/enlighter/modules/filter/LegacyShortcodeHandler.phpEnlighter – Customizable Syntax Highlighter [enlighter] Shortcode
The Enlighter shortcode is a powerful tool that enhances your WordPress website’s functionality. It allows you to highlight specific lines of code, offset lines, and control the visibility of line numbers. The shortcode also offers the option to manually group codes and assign unique themes. It’s a versatile tool for developers seeking to customize their website’s look and feel.
Shortcode: [enlighter]
Parameters
Here is a list of all possible enlighter shortcode parameters and attributes:
theme– specifies the visual style of the code blockgroup– allows manual grouping of code blockstab– sets a title for the code block in a tabhighlight– selects specific lines of code to highlightoffset– adjusts the starting line numberlinenumbers– controls the visibility of line numbers
Examples and Usage
Basic example – A simple usage of the Enlighter shortcode to highlight a block of code in a specific language (e.g., ‘php’).
echo 'Hello, World!';
Advanced examples
Using the Enlighter shortcode to highlight a block of code in a specific language (e.g., ‘php’), with a specific theme (e.g., ‘dracula’):
echo 'Hello, World!';
Using the Enlighter shortcode to highlight a block of code in a specific language (e.g., ‘php’), with line numbers enabled:
echo 'Hello, World!';
Using the Enlighter shortcode to highlight specific lines (e.g., lines 1 and 2) in a block of code:
echo 'Hello, World!';\necho 'How are you?';
Using the Enlighter shortcode to display a block of code with a tab title (e.g., ‘Example Code’):
echo 'Hello, World!';
Using the Enlighter shortcode to group multiple blocks of code under the same group (e.g., ‘Group1’):
echo 'Hello, World!';
PHP Function Code
In case you have difficulties debugging what causing issues with [enlighter] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode($lang, array($this, 'microShortcodeHandler'));Shortcode PHP function:
function microShortcodeHandler($shortcodeAttributes=NULL, $content='', $tagname=''){
// default attribute settings
$shortcodeAttributes = shortcode_atts(
array(
'theme' => null,
'group' => false,
'tab' => null,
'highlight' => null,
'offset' => null,
'linenumbers' => null
), $shortcodeAttributes);
// html tag standard attributes
$htmlAttributes = array(
'data-enlighter-language' => trim($tagname),
'class' => 'EnlighterJSRAW'
);
// force theme ?
if ($shortcodeAttributes['theme']){
$htmlAttributes['data-enlighter-theme'] = trim($shortcodeAttributes['theme']);
}
// handle as inline code ?
if ($this->_config['shortcode-inline'] && strpos($content, "\n") === false){
// generate html output
return $this->generateCodeblock($htmlAttributes, $content, 'code');
// linebreaks found -> block code
}else{
// highlight specific lines of code ?
if ($shortcodeAttributes['highlight']){
$htmlAttributes['data-enlighter-highlight'] = trim($shortcodeAttributes['highlight']);
}
// line offset ?
if ($shortcodeAttributes['offset']){
$htmlAttributes['data-enlighter-lineoffset'] = intval($shortcodeAttributes['offset']);
}
// force linenumber visibility ?
if ($shortcodeAttributes['linenumbers']){
$htmlAttributes['data-enlighter-linenumbers'] = (strtolower($shortcodeAttributes['linenumbers']) === 'true' ? 'true' : 'false');
}
// tab-name available ?
if ($shortcodeAttributes['tab']){
$htmlAttributes['data-enlighter-title'] = trim($shortcodeAttributes['tab']);
}
// codegroup active ?
if ($this->_activeCodegroup !== NULL){
// overwrite settings
$htmlAttributes['data-enlighter-group'] = $this->_activeCodegroup['data-enlighter-group'];
}else{
// manual grouping ?
if ($shortcodeAttributes['group']){
$htmlAttributes['data-enlighter-group'] = trim($shortcodeAttributes['group']);
}
}
// generate html output
return $this->generateCodeblock($htmlAttributes, $content);
}
}
Code file location:
enlighter/enlighter/modules/filter/LegacyShortcodeHandler.phpConclusion
Now that you’ve learned how to embed the Enlighter – Customizable Syntax Highlighter Plugin shortcodes, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.
Leave a Reply