Wednesday, 27 March 2013

How to add custom CSS in blogger For the beginners

  If you are looking for customizing your blog's look and feel, CSS (Cascading Style Sheets) is where you need to focus on, 'cause HTML alone doesn't help on styling your blog template. That's where you will need some knowledge in CSS or else you need to know where to use CSS code snippets provide in tutorials on web space.

Quite Risky

So far I've been instructing my readers to use CSS codes directly by editing the blog template. Yeah, it's a risky approach but I was always here to help you if something went wrong. Some readers were taking the risk and made necessary changes as they needed it on their blog. But still I know some bloggers out there who cares the most about blogging and wouldn't like to touch their template as they think it might lead to a chaos where they have to put more effort on fixing their blog issues instead of keep blogging as they used to. But when it comes to advanced design techniques, you need to touch some source codes ;)

Edit Template? No More...

Fortunately, now you don't need to touch your template if you need to customize your blog design with CSS code snippets. Wondering why? Blogger is being user friendly with a cool feature - Custom CSS. If you were a blogger who wouldn't touch your template for any reason even to insert a simple CSS code snippet to make necessary design changes, now you don't have to go for it and not anymore.

Blogger has a space for you to add any sort of custom CSS code snippets to your template and all you need to do is copying and pasting the code snippet. The best thing is that once you add the custom CSS code there, the changes will be reflected in the preview mode before even you save new changes to your template. So it allows you to play with CSS codes safely without spoiling your template and you can apply only if the code snippet works as you expected. It's very safe indeed and you don't need follow safety tips like you would do when you have to edit your blog template. How interesting is that? ;)

Would love to start customizing and makes necessary changes to your blog template with the help of custom CSS feature? Let's get to know where to start.


1. Go to Blogger Dashboard.

2. Click on your Blog Title.

3. Jump to Template tab from left pane.

Note: Before editing your template, you may want to save a copy of it. Read How to Back Up Your Template.

4. Click on Customize button beneath your blog preview.

5. Now you will be directed to Template Designer. Jump to Advanced.

6. On the next pane, click on Add CSS tab.

7. Now on right pane, you will see an empty text area. This is where you gonna add custom CSS snippets. Just add your CSS code snippets and you can see any visible changes below in the live preview.

Note: If you wanna remove or change any custom CSS snippet you have added, you can do it here as your CSS snippets are visible all the time unless you change or reset your template.

8. Once you finished with adding CSS snippets, click Apply to Blog button to make changes.

Infolinks offers an expanded buffet of ad units to generate maximum revenue to your blogs and websites

Generating views to your blog is not only the ultimate aim, But also you need to get some revenue out of it, sounds good right ? infolinks is ready to be customized to tailor-fit your website and blogs. having different solutions range from our tried and true InText to our brand new InFrame. Each product delivers relevant ads to your readers based on the content you write. Overcome banner blindness to increase user engagement on your sites. with the inframe and intext ad format increase the viewers tendencies to click your relevant ad's. So don't forget to integrate infolinks to your blog's or webpage.

after the registration process
As a token of appreciation please do the following to us (referred by me to this site)

after joining to infolinks please send us an email at

with St. Patrick’s Day and MyPublisher ID (PID), like this:

St. Patrick’s Day

Enjoy :-)
New Year Special 2013 

No comments:

Post a Comment