In this post, we will show you a best syntax highlighter for your WordPress posts and pages. If you are a web developer, and have a blogging niche blog, you need to show source code while you are teaching through your blog to your readers. You may write your PHP, CSS, HTML or JavaScript code to your WordPress posts, but it can be quite annoying. Writing your source code into the simple way is not the professional way to showing the codes on the blogs. If you have your own WordPress blog, you would know the power of WordPress plugin. Thanks to WordPress plugins for this issue to resolved, and will show the classes, links, attributes and values in the different colors for better explanation. These are automatic; you don’t need to be worry about.

syntax highlighter for WordPress blogs
A Best Syntax Highlighter. (Image Credit: click here)

There are many syntax highlighter plugins exist for your WordPress blogs. You may try by searching on Google. I have also tried some other syntax highlighter plugins on this blog, and have selected a best highlighter, which encourages me to write here on this post. Therefore, here is how display codes in WordPress posts.

Syntax Highlighter to Display PHP, CSS/HTML and JavaScript Codes on WordPress

  1. Download Syntax Highlighter from WordPress.org (http://wordpress.org/extend/plugins/syntaxhighlighter/). Install it to your desktop.
  2. Now, upload this plugin to your WordPress, and activate it. [ Method: Install Plugin to WordPress » http://www.easible.org/install-plugins-to-wordpress-filezilla/]
  3. Once you have activated, go to Settings » SyntaxHighlighterhow to highlight syntex in wordpressChoose the options, you want to use. These are the settings what we use in this blog. I have chosen Version2.x. If you have found any error in the latest version, you can choose the same version we use. Finally, click on Save Changes.
  4. You have done all the basic steps. How would you show your syntax to highlight in your posts? Just wrap your code in [language], such as or
    . For full list of languages, click here (http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/). Let you want to show your PHP code into your post, then use the below code to show any PHP code inside your post.

    Preview,

    // Facebook Video Shortcode - WordPressians.com
    function wpians_fbvideo($atts, $content = null) {
    extract(shortcode_atts(array(
    "id" => '',
    ), $atts));
    return ' The no. '.$id.' is your Facebook video ID. LOL!';
    }
    add_shortcode("fbvideo", "wpians_fbvideo");
    
  5. Let you want to highlight some lines inside your codes, then you have to write a shortcode parameter given below,

    Preview,

    // Facebook Video Shortcode - WordPressians.com
    function wpians_fbvideo($atts, $content = null) {
    extract(shortcode_atts(array(
    "id" => '',
    ), $atts));
    return ' The no. '.$id.' is your Facebook video ID. LOL!';
    }
    add_shortcode("fbvideo", "wpians_fbvideo");
    

    You may use some other shortcode parameters given in the plugin settings page at the bottom area for better experience.

NO COMMENTS

Leave a Reply