Code Syntax Highlighter for Elementor

Code snippets can be hard to scan when they appear as plain text within an article or tutorial. This plugin adds syntax highlighting to code blocks on Elementor-built websites, helping distinguish parts of a snippet and giving technical content a consistent display. It supports programming, scripting, and markup languages, so it can serve a range of development topics.

Add and customize code blocks through an Elementor widget, then choose a visual theme and display options to suit the page. You can also embed code from BitBucket or GitHub using a URL, show line numbers, and highlight selected lines. The plugin fits technical blogs, tutorials, and documentation where readers need to inspect or follow code.

Features

• Language support: Display code in more than 200 programming and markup languages, making the plugin useful for pages covering different coding topics.
• Theme selection: Choose from more than 30 visual themes to adjust how code blocks appear alongside the rest of an Elementor page.
• Repository embeds: Embed code from BitBucket and GitHub by adding a URL, so repository code can appear directly in a page.
• Line display options: Show line numbers and highlight selected lines to help readers locate and follow specific parts of a code snippet.
• Elementor widget: Add and customize code blocks within Elementor's drag-and-drop interface, without needing to write code to configure the widget.
• Responsive display: Code blocks are designed to display across screen sizes, with retina-ready presentation for clear viewing on supported screens.

Best for

• Technical blogs
• Programming tutorials
• Online documentation