Prism is an amazing lightweight and extensible syntax highlighter that just works by adding a class like language-python to your HTML <pre> or <code> tags. The best part about Prism is that it doesn’t mess up the HTML semantics in any way and comes with multiple themes that look really beautiful.

Installation

Getting it installed on WordPress is super easy if you’re into writing blog posts or articles with code snippets. Of course you could download the library and modify your theme to install it and use, but there’s a plugin that’ll get us there quick and easy – Prismatic.

1. Go to Plugins > Add New in your WP admin.
2. Search for Prismatic and install. Make sure the plugin you install matches with the URL linked above.
3. Go to Settings > Prismatic and change the library to Prism.js.

That’s it!

Usage

Now you can start adding language-{name} or lang-{name} classes to your code blocks. You can find a list of supported languages here.

While adding/editing posts, you could either modify your code blocks as HTML (Edit as HTML) or even better you could just:

1. Click on a code block.
2. Go to Advanced option in the block settings.
3. Add the class there under Additional CSS class(es).

Look & Feel

For some reason if you want to make style changes, then feel free to override the default CSS in your theme’s style.css. You can always do this in the theme editor section – Appearance > Theme File Editor > style.css.