Make Money on the Internet by Blogging - Editing the TemplateWritten by Abdulrehman on June 27th, 2008
In the previous parts of this series I explained how to make a Blog and how to set a domain with it. So far what I’ve covered is how to get your Blog on the Net with its own unique name and domain. Now comes the part where you start making changes to the Blog and make it more user-friendly and more useful for yourself. I’ll be talking of how you can edit the template of your blog, especially for blogger.
Editing the Template
If you’re using Blogger Beta then go to the ‘Layout’ of your blog, and if you are using the Old blogger like me, then go to the ‘Template’ of your Blog. I’ll talk about the Old Blogger first and then I’ll talk about Blogger Beta.
As soon as you open the template of your Blog in the old blogger you’re already on the page which says Edit HTML. Now if you have no idea of HTML then you can read the article which teaches essential HTML tags for Bloggers. The main thing that people usually want to edit in a page is their sidebar. Now in old Blogger whatever you enter between the <div id=”sidebar”> and </div> tags will appear on the sidebar (It may be ‘Sidebar-wrapper’ instead of ‘Sidebar’), however if any other <div> tag is opened in the sidebar make sure that it is close before the sidebar is closed else it will give you errors. What you would want to enter in a sidebar would be probably a link, a link list or some HTML script for another website like a widget, just see the HTML for the thing you want to add to your Blog on the article’s link given above and just place it in the div container of sidebar. If you want to change the color or style else of some object on your blog, there is one easy way which is editing it’s style sheet. In this example I’ll be demonstrating how to change the color of the post-title. Open your blog in a new window, once it is open for Internet Explorer press these buttons one by one [Alt] , [V], [C]. Firefox users should press only [Ctrl + U].
This will open the HTML Source of your blog and for example if you want to change the color of the post title then just search the HTML Source for the title of any article visible on your blog. When it finds it, Search for the tag before the Post Title which has the style for the Post Title in it. Since in this case the style name is Post-title, I will search the Source for post-title.
Since my Blog displays the Post title as a link I will have to edit the ‘a’ style in it, where it has three different properties which are the normal link, visited link and hover link, changing the color of each of these adds more interactivity for the reader.You might be wondering why there is a ‘#main’ before every style here, this indicates that this style is only to be applied in the div container named ‘main’. So you can edit the color of the Post-title link here and then make the same changes to your Blog template as the Style sheet is the same in both cases. Save it and you’re done. Similarly you can change the color, height, font-size, etc. of any other object in your template that uses a style by this method.
The process was only troublesome for the Old Blogger, as for Blogger Beta you can simply add these cool objects by clicking at Page Elements on your Blog’s Layout. You can change colors by clicking on Fonts and Colors. So its very simplified for Blogger Beta as it does not involve any HTML stuff for you to handle. But still I am using my website with the Old Blogger, that is because all editing to the Template cannot be done on the Page Elements alone. Sometimes its more complex and there are some commands that the Blogger Beta does not support, while I am using this Blog I am working to figure out the problem for Blogger Beta and as soon as I’m done fixing it, I’ll switch my Blog to Blogger Beta as many adjustments that this Blog will be needing in the future will not be possible on this old version. Template editing in Blogger Beta is easier than you think it is.
I hope that now you can easily Edit your Blog’s template and add stuff to your page however if you encounter any problems in this process then you can ask me I’d be glad to help, you can click here to subscribe to the Blog by mail incase you do not miss anything.
Related Articles:
2 People have expressed themselves on“Make Money on the Internet by Blogging - Editing the Template”
Leave a Reply
In the previous parts of this series I explained how to make a Blog and how to set a domain with it. So far what I’ve covered is how to get your Blog on the Net with its own unique name and domain. Now comes the part where you start making changes to the Blog and make it more user-friendly and more useful for yourself. I’ll be talking of how you can edit the template of your blog, especially for blogger.
Editing the Template
If you’re using Blogger Beta then go to the ‘Layout’ of your blog, and if you are using the Old blogger like me, then go to the ‘Template’ of your Blog. I’ll talk about the Old Blogger first and then I’ll talk about Blogger Beta.
As soon as you open the template of your Blog in the old blogger you’re already on the page which says Edit HTML. Now if you have no idea of HTML then you can read the article which teaches essential HTML tags for Bloggers. The main thing that people usually want to edit in a page is their sidebar. Now in old Blogger whatever you enter between the <div id=”sidebar”> and </div> tags will appear on the sidebar (It may be ‘Sidebar-wrapper’ instead of ‘Sidebar’), however if any other <div> tag is opened in the sidebar make sure that it is close before the sidebar is closed else it will give you errors. What you would want to enter in a sidebar would be probably a link, a link list or some HTML script for another website like a widget, just see the HTML for the thing you want to add to your Blog on the article’s link given above and just place it in the div container of sidebar. If you want to change the color or style else of some object on your blog, there is one easy way which is editing it’s style sheet. In this example I’ll be demonstrating how to change the color of the post-title. Open your blog in a new window, once it is open for Internet Explorer press these buttons one by one [Alt] , [V], [C]. Firefox users should press only [Ctrl + U].
This will open the HTML Source of your blog and for example if you want to change the color of the post title then just search the HTML Source for the title of any article visible on your blog. When it finds it, Search for the tag before the Post Title which has the style for the Post Title in it. Since in this case the style name is Post-title, I will search the Source for post-title. Since my Blog displays the Post title as a link I will have to edit the ‘a’ style in it, where it has three different properties which are the normal link, visited link and hover link, changing the color of each of these adds more interactivity for the reader.You might be wondering why there is a ‘#main’ before every style here, this indicates that this style is only to be applied in the div container named ‘main’. So you can edit the color of the Post-title link here and then make the same changes to your Blog template as the Style sheet is the same in both cases. Save it and you’re done. Similarly you can change the color, height, font-size, etc. of any other object in your template that uses a style by this method.
The process was only troublesome for the Old Blogger, as for Blogger Beta you can simply add these cool objects by clicking at Page Elements on your Blog’s Layout. You can change colors by clicking on Fonts and Colors. So its very simplified for Blogger Beta as it does not involve any HTML stuff for you to handle. But still I am using my website with the Old Blogger, that is because all editing to the Template cannot be done on the Page Elements alone. Sometimes its more complex and there are some commands that the Blogger Beta does not support, while I am using this Blog I am working to figure out the problem for Blogger Beta and as soon as I’m done fixing it, I’ll switch my Blog to Blogger Beta as many adjustments that this Blog will be needing in the future will not be possible on this old version. Template editing in Blogger Beta is easier than you think it is.
I hope that now you can easily Edit your Blog’s template and add stuff to your page however if you encounter any problems in this process then you can ask me I’d be glad to help, you can click here to subscribe to the Blog by mail incase you do not miss anything.
I am Abdulrehman Agha, the guy behind 3arn.Net. I am 17 years old, and live in Rawalpindi, Pakistan. I'm in Grade 11 studying in Saint Mary's Academy. I started this blog to share my money making experiences with others through the internet.
Copyright © 2007 - 2010 
thanks for your articles, if you do not mind I want to post your article on my blog
[Reply To This Comment]