Pages

How to insert code in the article | Blogger | Formatting

While writing articles about programming, you have to write codes frequently in the articles. The problem is that you could not write code simply using the font and formatting of the text that the rest of your blog is using. Otherwise it won't look cool. But its kind of tricky to format the codes in your blogger article compared to the wiki or something else.
Well here's what I do for my formatting. Its not great, but I like the simplicity and separation both.
Suppose you have to write this article.

Hello World, Below is my code
Integer i = 1;

First of all, open your blogger and in the place to write the article, Write all the non-code article. Now blogger has two modes(Compose, Html). Go to the compose mode and Just in the place where you want to write your code, write this line
<code>code</code>

Now come back to the Compose mode. You can see the text "code" is actually in the format of a code. You could now copy your actual code, and then select the text "code" in the article editor and then paste it. You could also add custom CSS to make it different, like add border, background etc.

There are also custom javascripts and css syntax Highlighter out there in the internet. But I personally don't like them because they are a little bit big work in the beginning and they also kind of degrade the response time and add the volume of data to be transferred on each page load.

Simplicity is Beauty

No comments:

Post a Comment

If you like to say anything (good/bad), Please do not hesitate...