How can I highlight syntax like it appears on stackoverflow?

3 comments

1. HTML language includes a special tag for displaying inline code. To apply it to your text, switch to the ‘Text’ visual editor tab and place the <code> tag before your bit of code, and the </code> tag afterwards.

   If you want to use the backtick ` character for highlighting code like you do on Stack Overflow, check out this plugin by Tom McFarlin.

2. you can create a shortcode for this

   <?php
   add_shortcode('highlight','ravs_hightlight');
   function ravs_hightlight( $atts, $content=""){
     return '<span class="highlight">'.$content.'</span>';
   }
   ?>
   

   paste above code in functions.php.

   use shortcode in wordpress editer like

   [highlight]test for hightlight short code[/highlight]
   

   your html output like

   <span class="highlight">test for hightlight short code</span>
   

   give some css to .highlight class

   Important Link:

   add_shortcode()

3. This subject has been successfully discussed here, and here.

   Bungeshea is right, but you can also and simply add these tags in your text editor (not visual editor):

   [sourcecode language='CorrespondingLanguage']
       //Your code goes here
   [/sourcecode]
   

Comments are closed.