Step 2) Click "Edit HTML"
Step 3) Accept the warning by clicking "Proceed"
Step 4) Find your template's </head> tag
Step 5) Copy and paste the following HTML code (omit the .js includes that aren't relevant to your site to increase page load time):
<!-- Syntax Highlighter Additions START --> <link href="http://alexgorbatchev.com/pub/sh/current/styles/shCore.css" rel="stylesheet" type="text/css" /> <link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeEmacs.css" rel="stylesheet" type="text/css" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushAS3.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushColdFusion.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDelphi.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDiff.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushErlang.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushGroovy.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJavaFX.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPlain.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPowerShell.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushScala.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js" type="text/javascript" /> <script src="http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js" type="text/javascript" /> <script language="javascript" type="text/javascript"> SyntaxHighlighter.config.bloggerMode = true; SyntaxHighlighter.all(); </script> <!-- Syntax Highlighter Additions END -->
Step 6) Click "Save template"
Step 7) Click "Close"
Step 8) Create a new post in HTML mode using the following markup:
<pre class="brush:php;"> <?php $example = range(0, 9); foreach ($example as $value) { echo $value; } </pre>
Step 9) Click "Publish" and you're done!
Additional information on the syntax highlighting code utilized on this blog and illustrated in this tutorial can be found at http://alexgorbatchev.com/SyntaxHighlighter/.
Looking for a cloud-based catalog and CRM platform? Checkout http://rocware.com/
how can i change background colour form back to white?
ReplyDeleteUpdate the line in my posted code that looks like:
Delete<link href="http://alexgorbatchev.com/pub/sh/current/styles/shThemeEmacs.css" rel="stylesheet" type="text/css" />
to reference a theme with a white background such as shThemeDefault.css (as opposed to what I use which you can see is shThemeEmacs.css)
The list of available themes can be found here: http://alexgorbatchev.com/SyntaxHighlighter/manual/themes/
Hey I just wanted to say that I really enjoyed reading your blog. You have good views, keep up the good informative info. Good Quality and very informative Blog! Contact Vinay Hari Education Consultant
Deletethis is really not so use ful way I guess, loading so many js files external is not so good, it affects the speed right?
ReplyDeleteDhanesh Mane
Right. If you only care about having your blog syntax highlight PHP then you'd only include shBrushPhp.js.
DeleteThanks matey, that worked for me.
ReplyDeleteGreat. Glad this post did the trick.
DeleteActually.. :) now that i have said it works i've noticed that it renders OK in Firefox and IE but not on the current version of Google Chrome (on windows 7). In Chrome the line numbering is messed up and there is a heap of whitespace at the end of the code sections; it's un-usably awful. I saw it first on my blog and until I noticed it on yours I thought I'd made a mistake! I guess browser rendering issues have always plagued web developers and I should be no different ;) Do you get this issue rendering your blog in Chrome?
DeleteJust checked my blog using Chrome version 21 on OS X and also get the rendering issue you've described. Without having looked into this issue, I'm guessing that the problem resides within the SyntaxHighlighter library code (as opposed to being a result of how we've implemented SyntaxHighlighter via this tutorial). LMK if you find out otherwise. Thanks.
DeleteI really am trying to get this to work, however it does not work for some reason. I have tried many tutorial, and yet no work. I uploaded your code example as the last post on my blog. Can u see and check what could be the problem? I will appreciate it:
ReplyDeletehttp://hippieitgeek.blogspot.com
I took a look at your site's source and I couldn't find your content wrapped in the proper tag (i.e. <pre class="brush:php;">your php code to be highlighted here</pre>). Take a close look at step 8's text description AND screenshot. LMK if this sets you in the right direction.
DeleteThere's a bug in my SyntaxHighlighter where the last lines are repeated leaving a big blank space.
ReplyDeleteThis is normal on blogger?, In versions prior to 3.0 I did not have this problem.
The numbers also do not hit, it is resetting itself
Please see: http://oneqonea.blogspot.com/2012/04/how-do-i-add-syntax-highlighting-to-my.html?showComment=1345577441814#c7746474800893185628
DeleteThis comment has been removed by the author.
ReplyDeleteperfect, i need one problem.. my error this image screenshot
ReplyDeletehttp://4.bp.blogspot.com/-YHjtODACKsk/URepEY_dGRI/AAAAAAAAAIE/6RfQE62IgO8/s1600/error.png
can you help me ? thanks
Hi Electro Bee,
DeleteI'm not exactly sure what's causing your problem. Others have experienced it too as can be seen by reading the comments above. I think it's a browser/library issue (as opposed to an issue relating to how we've implemented the SyntaxHighlighter library). I've attached two screenshots to this comment so you can see what I see. I'm using Chrome version 24. You can see what I see here and you can see my version of Chrome here. If you figure out what's causing the issue on your end, please post the solution so others can benefit from it. Thanks!
Thanks, this worked. I'm using blogger. I wonder, is it allowed to download the files, and loading them from another location? Like, for example, I set them as google site attachments?
ReplyDeleteWorks well. Thank you.
ReplyDeleteGreat. Glad the post helped you out.
DeleteIs there an easy way to add a custom brush which is not currently hosted anywhere?
ReplyDeleteI found the code for a cocoa/obj-c brush but it is just a file.
http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/
Deletehttp://www.undermyhat.org/blog/2009/09/list-of-brushes-syntaxhighligher/
To host yourself, maybe use https://www.dropbox.com/?
Thank you. I will check both links out.
DeleteHi John,
ReplyDeleteTried the steps mentioned by you above, but It did not work. Following is the link to check.
http://exploreriddles.blogspot.in/2013/07/configpropertyname-bean-context-file.html
I checked the HTML created, it does not have pre tag, so I am not really sure what wrong I am doing?
My html code is following
div dir="ltr" style="text-align: left;" trbidi="on"
br
div
pre class="brush:java;" (I have removed lt, gt)
private String m_beanContext;
private static final String PROP_DATASOURCE_NAME = "";
private MSCISAdapterSourceDB m_dbObj = null;
private static Logger m_theLogger = Logger.getLogger(FSyncBeginAction.class);
public FSyncBeginAction()
{
}
protected ClassPathXmlApplicationContext getBeanContext()
{
return new ClassPathXmlApplicationContext(m_beanContext);
}
/pre (Removed lt and gt)
is there something that I must change?
Thank you very much!
ReplyDeleteYou are very welcome! Glad this post was able to help you out.
DeleteHi all, I have used Syntax highlighting for my blog, but it make my blog run a little slowly, so I created an online tool to help people more easier in formatting source code in blog.
ReplyDeleteCurrently, I have 6 theme for you to choose which kind of color you want to show in your website. I will develope more. Hope this online tool will be useful.
http://www.phamngoctan.com/2013/11/format-source-code-for-blogger.html
I truly like to reading your post. Thank you so much for taking the time to share such a nice information. I'll definitely add this great post in my article section.
ReplyDeletewebsite design
Thanks for the feedback. Makes it all worth while! Glad I was able to help.
DeleteFairly segment of content. I just stumbled upon your site and in accession funds to claim which i acquire actually cherished account your blog posts.Anyway I will be subscribing for your feeds or even I achievement you access persistently swiftly.
ReplyDeletewebsite design
its nice but very hard and too much lengthy ....
ReplyDeletehttp://tipsntricks5.blogspot.com/2014/02/best-facebook-like-popup-box-for.html
ReplyDeleteVery helpful . Thanks! :D
ReplyDeleteHi, I seem to be having very strange issue, I followed your steps but the out put seems to be one word for a line. CSS gets applied but the rendering is different, I pasted the your example code but below is the output.
ReplyDelete$example
= range(0, 9);
foreach
(
$example
as
$value
)
{
echo
Thanks! It helps me a lot.
ReplyDeletethanks
ReplyDeleteIt works very good @ my blog http://studyant.blogspot.com which i am designing. But the problem is CODE is highlighting after the page fully load. though i have added all javascript files in the tag. pls tell me any solution that it highlights only after the syntax hilighter script loads.
ReplyDeletehi i have use your code in my blog www.dotnetspan.com but not working. I thing it's css issue can not load properly.
ReplyDeleteThank you. From where I can get which all the classes i can use like brush:php, brush:cpp ?
ReplyDeleteHere's a list from the SyntaxHighlighter website:
Deletehttp://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/
Easiest and most effective walk-through I was able to find. Thanks for your help.
ReplyDeleteBro Not work
ReplyDeleteThanks that work for me
ReplyDeleteHow do I add syntax highlighting to my Blogger blog?
ReplyDeleteSpybubble Free
thanks.. it worked for me.
ReplyDeletethanx for it........... but its completely not showing in my blog.
ReplyDeletehttp://www.govtjobnotification.in/
How to set the width and height of highlighter?
ReplyDeleteI want not to show the full code. It will be better if it collapse and reader should read the full code scrolling down and right.
How can it be done?
Really Nice Information,Thank You Very Much For Sharing.
ReplyDeleteWeb Designing Company
Thanks for this one, worked as a charm! Your post was linked from here btw: http://www.danielhansen.net/2014/06/how-to-format-code-and-syntax.html
ReplyDeleteThank you so much!
ReplyDeleteSo, what is the status of all this today, in August 2015?
ReplyDeleteI tried following these steps repeatedly in my current blog, as well as in new "clean" blogs created just to test it. None of this works anywhere.
The "official" web site of the author does not seem to mention Blogger as a supported platform. Is it no longer compatible with Blogger?
Thanks for this, worked very well in my blog.
ReplyDeletehttp://chasoliveira.blogspot.com.br/2015/08/bind-com-tipos-nulos.html
Greetings dear,many many thanks for sharing such wonderful information with us.I am eagerly waiting for your next post.Kindly please visit our site for information about css templates
ReplyDeleteI must admit I have popped in a read a good number of your blogs but I have no idea how to post a response over there, so I'll tell you now how good you are at describing the stuff your at - I must admit I find it insightful to read your blogging. Keep the good work, please visit our website for more free piugins
ReplyDeleteit is not working for me:(
ReplyDeletethanks for the great tutorial :)
ReplyDeleteThanks! It worked
ReplyDeleteBut, My concern is the height of the syntax highlighter. How to control the height. Can we write any css for that. Where to write the css
This comment has been removed by the author.
ReplyDeleteThis is definitely the best syntax highlighter library for use in blogs as well as regular website.
ReplyDeleteUseful tutorial,
Thanks
BloggerTalks
Thank you very much for your detailed instructions!
ReplyDeleteI appreciate very much your effort.
Matteo
You're welcome.
ReplyDeleteHi,
ReplyDeleteFor some reason, I do not this layout. Its very simple without any black or line numbers. FYI, I commented other JS libraries except Java and PHP. Can you please let me what I am missing.
thank you ,it is really useful.
ReplyDeleteSyntaxHighlighter.brushes.R = function()
ReplyDelete{
var keywords = 'if else repeat while function for in next break TRUE FALSE NULL Inf NaN NA NA_integer_ NA_real_ NA_complex_ NA_character_';
var constants = 'LETTERS letters month.abb month.name pi';
this.regexList = [
{ regex: SyntaxHighlighter.regexLib.singleLinePerlComments, css: 'comments' },
{ regex: SyntaxHighlighter.regexLib.singleQuotedString, css: 'string' },
{ regex: SyntaxHighlighter.regexLib.doubleQuotedString, css: 'string' },
{ regex: new RegExp(this.getKeywords(keywords), 'gm'), css: 'keyword' },
{ regex: new RegExp(this.getKeywords(constants), 'gm'), css: 'constants' },
{ regex: /[\w._]+[ \t]*(?=\()/gm, css: 'functions' },
];
};
SyntaxHighlighter.brushes.R.prototype = new SyntaxHighlighter.Highlighter();
SyntaxHighlighter.brushes.R.aliases = ['r', 's', 'splus'];
how can i get this code as shBrushR.js
I need R programming code to embed, suggest for that
Your blog has given me that thing which I never expect to get from all over the websites. Nice post guys!
ReplyDeleteregards,
Melbourne Web Designer
Your comment warms my heart. I'm so happy to hear my blog is of value to others. That is its purpose. Cheers mate!
DeleteI like this blog! In return, I want to share some cheap ray ban sunglasses with you.
ReplyDeleteLOL, I have created a new post in a normal mode and I spend hours looking what is wrong!
ReplyDeleteشركتنا من المتميزون في اعمال الاصلاح بدون هدم او تكسير من خلال شركة ركن البيت التي تقدم الكثير والكثير في عمل اللازم وتصحيح الاخطاء التي تسببها تسريبات المياه فنحن مثلا
ReplyDeleteشركة كشف تسربات المياه بجدة تقدم خدمة لعمل الاصلاح بدون اي خراب ونقدم النصيحة للعملاء بالابتعاد عن الاعمال التي تؤدي الي هذا الخراب فتعاملك مع شركة كشف تسربات بجدة لديها الخبرة الكافية تساعدك في الحفاظ علي منزلك كما اننا نتمكن في اننا سوف نرتقي بخدمة لاننا نقوم بالعمل السليم لها كما يوجد لدينا خدمات العوازل التي تمنع التسريبات من الاسقف لكم والحوائط والخزانات من خلال شركة تسمي الاولي في مجالها لذلك نحن نقدم شركة عزل خزانات بالرياض التي تعتبر في عل الخزانات الارضية من الداخل بواسطة مواد متميزة كما نقدم لكم شركة عزل اسطح بالرياض لعمل العوازل التي تمنع جميع التسريبات في الاسقف
https://mmmutsmartmind.blogspot.in/2016/01/threadpool.html
ReplyDeleteIn this page "script class="brush: java" type="syntaxhighlighter""
![CDATA[
//some code here
]]
script
not working now.
Because your website is using https.
ReplyDeletewhen my url is gone through https then syntaxchceker is not working while my blog url go through http its code working fine .So please tell me how can I stop to go thriugh https.
ReplyDeletehttps://mmmutsmartmind.blogspot.in/2016/01/threadpool.html
In this page "script class="brush: java" type="syntaxhighlighter""
![CDATA[
//some code here
]]
script
not working when url go through https now.
Try to disable HTTPS redirection in your server. I am not sure how to do that in yours.
ReplyDeleteI disable HTTPS redirection.I set HTTPS redirection No, even its going in browser through https.Is any other option?
DeleteI disable HTTPS redirection.I set HTTPS redirection No, even its going in browser through https.Is any other option?
ReplyDeleteIt used to work for me, but this no longer works on blogspot https since I get the following error:
ReplyDeletehttps://alexgorbatchev.com/pub/sh/current/scripts/shCore.js net::ERR_CONNECTION_REFUSED
How did you guys make it work???
Moreover, I get the following error:
ReplyDeleteUncaught ReferenceError: XRegExp is not defined
Any ideas on how to solve this?
not working
ReplyDeleteIf you figure out why, please post your findings here. Thank you!
DeleteNice and good article.. it is very useful for me to learn and understand easily.. thanks for sharing your valuable information and time.. please keep updating.more php jobs in hyderabad.
ReplyDelete
ReplyDeleteصيانة غسالات هيتاشى
صيانة هيتاشى
مبيعات يونيون اير
تكييف يونيون اير
صيانة اوليمبيك
صيانة زانوسي
صيانة سامسونج
صيانة توشيبا
صيانة غسالات زانوسي
صيانة غسالات سامسونج
صيانة ثلاجات كريازي
صيانة ثلاجات توشيبا
صيانة سخانات اوليمبيك موقع
صيانة ثلاجات زانوسي موقع
صيانة سامسونج موقع
صيانة توشيبا شركة
صيانة غسالات توشيبا موقع
صيانة ثلاجات توشيبا موقع
صيانة كريازي موقع
صيانة فيليبس
صيانة غسالات فيليبس
صيانة سيمنس موقع
صيانة سخانات سيمنس
صيانة غسالات كريازي
رقم صيانة سيمنس
اسعار تكييف يونيون اير موقع
ReplyDeleteصيانة غسالات هيتاشى
صيانة هيتاشى
مبيعات يونيون اير
تكييف يونيون اير
صيانة اوليمبيك
صيانة زانوسي
صيانة سامسونج
صيانة توشيبا
صيانة غسالات زانوسي
صيانة غسالات سامسونج
صيانة ثلاجات كريازي
صيانة ثلاجات توشيبا
صيانة سخانات اوليمبيك موقع
صيانة ثلاجات زانوسي موقع
صيانة سامسونج موقع
صيانة توشيبا شركة
صيانة غسالات توشيبا موقع
صيانة ثلاجات توشيبا موقع
صيانة كريازي موقع
صيانة فيليبس
صيانة غسالات فيليبس
صيانة سيمنس موقع
صيانة سخانات سيمنس
صيانة غسالات كريازي
رقم صيانة سيمنس
اسعار تكييف يونيون اير موقع
Simple And useful thanks for sharing.
ReplyDeleteInvoice Processing Services Usa
This article is very interesting and helpful. Thank you for sharing!
ReplyDeleteMobile App Developer
• Nice and good article. It is very useful for me to learn and understand easily. Thanks for sharing your valuable information and time. Please keep updatingAzure Online course Bangalore
ReplyDeletethis is not working for me : https://thingmajikz.blogspot.in/
ReplyDeletePretty cool !
ReplyDeleteمنتديات المزارع
منح ماجستير
I read this article. I think You put a lot of effort to create this article. I appreciate your work.
ReplyDeletethesis Writing Service
عزيزى العميل هل تعانى من إنتشار أسراب الحمام والطيور فوق سطح المنزل الخاص بك ؟ هل تبحث عن شركة متخصصة و رائدة لمكافحة الطيور والحمام بالرياض ؟ شركة مكافحة الحمام والطيور بالرياض تقدم لك عميلنا الكريم الحل السريع و الامثل للتخلص من أسراب الحمام التي تنتشر فوق بيتك كما تتنوع خدمات شركة تركيب شبك حمام بالرياض والتى تشتمل على تركيب طارد للحمام فى الرياض فوق أسقف المبانى والمنشآت ، تركيب صناديق لحماية المكيفات من أسراب الحمام والطيور فى الرياض ، المكافحة المستمرة بالاساليب الحديثة ، تركيب شبك على الشبابيك شركة مكافحة حمام بالرياض تسعى دوما إلى توفير خدماتها المتميزة في مجال مكافحة الطيور والحمام فى الكثير من المناطق والمدن المجاورة للرياض .
ReplyDeleteشركة مكافحة الحمام بالرياض
It is free for non commercial use, $570 for commercial use. It it my phone says insufficient storage but i have space
ReplyDeletea bit overkill if you are just needing low pass, high pass, and band pass filters, * Utility can also recover PDA devices, Handheld Computers.
I have read this article it is really helpful for getting amazing tips on related topic. You have described everything in a professional way.
ReplyDeletebuffalo web design companies are available and we Crystal Tech Solution provide professional web designing service in reasonable cost.