How to install a plugin on a blog Prettify Syntax Highlighter

How to install a plugin on a blog Prettify Syntax Highlighter -

Plugin Syntax highlighter function to display pieces of code programming language that we stick to the positngan blog that text script code looks different by writing instead of script code, if our blog is a blog to discuss the programming language for example, then the plugin syntax higlighter shall you post, because every description script programming language code affixed to the blog posts will be presented with a format different writing so it is easy to read and appealing to the eye.

Many higlighter syntax plugin can one, the one that I like is " Prettify ". because the plugin this one arguably mild, not much use external javascript and easy to install.

Step Installing plugins Prettify on the blog

For example, if you have successfully installed the plugin prettify this then like to see the results below. You can see the script blog dihiglight use the plugin.
How do I install the plugin syntax highlighter on a blog berflatform blogspot using the plugin "Prettify". following steps:


1. Log into your blogger account, then select Press the Menu template and Edit HTML.

2. on the template Editors please Press the CTRL + F to search

3. Find the code then please paste the following script immediately before the code .

4. Search code and sisikap the following code before the code

 ?   / * syntax highlighter * / ?  

5. Find the code]]]]> and paste the following code before the code. This is to manipulate the view snippet, you can modify the following css liking.

 / * syntax highlighter * / pre.prettyprint, code.prettyprint {? Background-color: black; ? Padding: 5px; ? Color # fff; border: 1px solid gray; overflow: auto; pre .nocode {? background-color: none; ? Color: # 000} pre .str {? Color: # FFC0CB pre .kwd} {? Color: # f0e68c; ? Font-weight: bold} {pre .com? Color: # 87ceeb pre .typ} {? Color: # 98fb98 pre .lit} {? Color: # FFA07A pre .pun} {? Color: # fff} pre .pln {? color: # fff} {pre .tag? color: # f0e68c; } Pre .atn {? Color: # bdb76b; ? Font-weight: bold} {pre .atv? Color: # 0EE0 pre .dec} {? Color: # 98fb98 ol.linenums} {/ * IE indents via margin-left * /? Margin-top: 0; ? Margin-bottom: 0; ? Color: #AEAEAE} li.L0, li.L1, li.L2, li.L3, li.L5, li.L6, li.L7, li.L8 {} li.L1, li.L3, li.L5 , li.L7, li.L9 {/ * Alternate shading for lines * /? background: # 555; } 

6. For code that you want to highlight, use the HTML mode to the editors of your articles and place the piece of code between the tags

 like the example below: 
 
 
 
 // code here ...... 
 
 
 

Tweet