You are here

How To Add CSS Code In Blogger Template


How To add CSS code in Blogger Template

What is CSS?

  • CSS stands mean Cascading Style Sheets
  • CSS describes the elements of HTML are to be displayed on the screen, or in other media
  • CSS saves a lot of work. It can control the layout of multiple web content all directly
  • External stylesheets are stored in CSS files

How To add CSS code in Blogger Template

Blogger was created by Pyra lab in 1999, which was bought by Google 2003. Blogger provides a good platform for a small blogger to share their experience worldwide.

It works on XML language which uses namespaces and some predefined function that makes its coding more complex to add CSS code in Blogger Template

Generally, due to its high complexity, its use is limited to small bloggers only whereas other bloggers preferred to use WordPress as a blogging platform.

Lots of tricks and widgets are available online for the blogger platform which is created by web developers.

To install any unofficially released widget, you have to add different pieces of code at desired places that’s why most of the newbie finds difficulty to add code.

Here we are sharing a tutorial that helps you to easily add CSS code in the Blogger template.

There are two options to add CSS code in the Blogger template, you can either choose the manual method or you can use the Template Designer option. Let’s learn one by one.

How To Add CSS Code Manually

If you’re not conversant in HTML like languages, you’ve got to go with another method. Make a strong habit to backup your template to prevent any unnecessary change in it.

First of all copy your CSS code, which can seem like


#menubar { list-style-type:none; margin:0; padding:0; overflow:hidden; } #menubar li { float:left; } #menubar li a, #menubar li a:link, #menubar li a:visited { display:block; width:120px; font-weight:bold; color:#FFFFFF; background-color:#98bf21; padding:4px; text-align:center; text-decoration:none; } #menubar li a:hover, #menubar li a:active { background-color:#7A991A; }

Now go to Blogger dashboard / Template / Edit HTML.

Search for the following code in the Blogger template.


Add CSS code in Blogger above it and save your template.

How to Add CSS code with Template Designer

This method is somewhat easy because you have no need to go through the template.
customise template

Click the Customize button, a new window will open up then choose Advanced / Add CSS option and paste add CSS code in blogger in this provided text box.


Click the Apply button to apply this CSS code to the blog.

This is a tips how to add CSS code in Blogger template

If you like the above article please share our article on social media.
#blog and tricks #blogandtricks

Leave a Reply