2 Best Ways To Display Code Snippets Into Your WordPress Post

WordPress is one of the most powerful and popular blogging platforms in the World. There are tons of features in WordPress. I think this is the best platform to work with your passion and knowledge. Also, WordPress is a good choice for those, who just started their blogging career. Because WordPress is easy to understand and more powerful than other blogging platforms. Also, you can get more opportunities to customize your site in WordPress than other platforms. So, Let's move into the main topic. Today I will be teaching you how to display code snippets into your WordPress post.
There are many ways of sharing Code Snippets into your WordPress post but those ways are harder to add to your WordPress site. Peoples who don't know how to edit a WordPress theme they will be unable to add those systems on their site. So, I have been finding out 2 easiest ways of displaying code snippets into your WordPress post.

By using these methods, you can display code snippets into your WordPress posts very easily. You will not need to edit the theme of your site to add those 2 methods of sharing code snippets. So, don't worry about editing the theme. By default when we share HTML or any other codes into our post WordPress Filters them automatically, as a result, we can't display the codes on our posts. That's why I am here to teach you. Read the entire article carefully and you will be able to share code snippets into your WordPress Posts. Without further delay let's start the tutorial.

2 Best Ways Of Sharing Code Snippets Into WordPress Post:

To add 2 of these code sharing methods into your WordPress site just follow the instructions below.

Method 1.

In this method, we will use a Plugin to add code snippets into the post. The Plugin is called Syntax Highlighter Evolved.

How To Add Syntax Highlighter Plugin On Your WordPress Site:

Step 1. Download the plugin from the link below or you can search for the plugin from your WordPress Plugin Dashboard.

Download Syntax Highlighter Evolved

Step 2. Now from your WordPress dashboard navigate to Plugins >> Add New >> Upload. After uploading Activate the plugin.

You can see the default settings of the plugin in the picture above. You can keep the settings default if you want to customize the settings, do it yourself.

How To Display Code Snippets Through Syntax Highlighter Plugin:

There is some Shortcode or BB Code to show the code snippet in Post. For example, if you want to show PHP Code use the shortcode below.

[php] <? php echo “Hello World”; ?> [/ php]

Result:

If you want to show CSS code use the shortcode below.

[css] .entry-title { font-family:”Open Sans”, arial, sans-serif; font-size:16px; color:#272727; } [/css]

Result:

If you share code snippets using this plugin, visitors can easily copy the code.

Read: How To Display Code Snippets Into Blogger Post.

Method 2.

In this method, we are going to use the WordPress default function. By default, WordPress has a function of sharing code snippets into your posts.
You can use <pre> </pre> tag to share code snippets in WordPress. Keep your codes which you want to share between the <pre> </pre> tag.
Example:
<pre> YOUR CODES GOES HERE </pre>

Note: If you want to share Codes using <pre> </pre> tags, you will need to Encode the code by HTML ENCODER. You can use the website below to encode your codes.

Opinionatedgeek.com

That's all, hope you understand. If you have any issues you can comment below.