Skip to main content

How to add custom theme to new blogger?

Even though blogger come with many themes they don't seems satisfying but luckily we don't have to rely on these themes you can add one of your own either by creating it by yourself or just download it from any site.
There are many such sites which will provide you free templates for blogger. Just Google for "Free blogger templates".

So below are the steps to set up a custom theme for blogger.

Step I

Go to your blogger dashboard as shown in Fig.1.


Fig. 1

Select 'Template' option from the panel to the left hand side of the dashboard. The option is circled in the Fig. 1.

Step II

Clicking on template will bring the Template page (Refer Fig.2). If you scroll down on this page you will find different basic templates provided by blogger.They are quite beautiful in-fact but we are talking about adding a custom theme so we won't go in detail of this :) .

Method 1) The one way of creating a custom theme is by clicking on "Customize" button just beside "Edit HTML" button (Red circled in Fig.2). In this you can select any theme from the basic blogger themes and then customize it. This includes changing the height/width of the sections present on blogger or changing the icon on the blogger or font etc.
You can refer this link.

Method 2) Second way (and the one that we are demoing here ) you can download a theme from any site where you can find the free blogger template.Usually the provide you zip files. Unzip the zip file and there will be couple of files, one of them would be and XML file. Open this file and copy all the contents of this file.
    - Now click on Edit HTML button (Refer Fig.2).




Fig. 2

Step III

After clicking on "Edit HTML" button a pop up will appear (Refer Fig. 3). There will be a warning asking if you really want to proceed or you can use Blogger's template designer( this is same as mention in step II in Method I).
So click on Proceed button (Shown in Fig 3.)


Fig. 3

Step IV

After clicking the Proceed button it will show you the template XML code for the current theme.Clear the contents of this template and paste the XML content of the new template that you copied in step II - Method 2. and click on "Save Template" ( Circled in Fig. 4). There might be some warnings saying that some gadgets will be lost (This is due to the new template might not have been designed for them ) or they will ask you if you want to add them to your new template select your choices.

Fig. 4


And that's it you are set. Now just click on "view blog" button on dashboard  or just hit your blogger URL and your will see the new template applied to your blogger.

Hope this tutorial helps you. If you have any doubt just add your comment and I will try to resolve it ASAP.

Happy Blogging :)
Labels:

Comments

Post a Comment

.

Popular posts from this blog

Create Table in Liquibase

For creating table using liquibase you can use below code and add it in your liquibase file. <createTable tableName=“employee”>      <column name="id" type="int">      <constraints primaryKey="true" nullable="false"/>   </column>      <column name="first_name" type="varchar(255)"/>   <column name="last_name" type="varchar(255)"/>   <column name="username" type="varchar(255)">      <constraints unique="true" nullable="false"/>   </column> </createTable> The use is pretty simple it's the way it looks : Tag: <createTable></createTable> This is an opening/ending tag for creating a table. These tags will enclose column sub tags which will define columns for the table. Attribute:   tableName : Name of the table which you want to create. (This is a mandatory  
Post a Comment
Read more

How databasechangeloglock and databasechangelog table used by liquibase?

Liquibase takes care of executing the query on the database while maintaining the list of queries executed and also maintaining the locks over the tables simultaneously. The two tables that are used by the liquibase for this purpose are : Databasechangeloglock : This table have following columns ID | LOCKED| LOCKGRANTED | LOCKEDBY. This maintains the locks information granted to the user. The primary purpose of this table is to make sure that two machines don't attempt to modify the data at the same time. Databasechangelog : This table have following columns ID | AUTHOR | FILENAME | DATEEXECUTED | ORDEREXECUTED | EXECTYPE | MD5SUM | DESCRIPTION | COMMENTS | TAG | LIQUIBASE This table maintains the list of the statements that are executed on the database.
Post a Comment
Read more

ReferenceError: dhtmlXGrid is not defined : Resolved

For the errors like : ReferenceError: dhtmlXDataView is not defined ReferenceError: dhtmlXGrid is not defined ReferenceError: dhtmlXTree is not defined ReferenceError: dhtmlXTreeGrid is not defined etc I have been working on dhtmlx for long time now and this is one of the most basic exception faced by the developer and which in fact is very easy to resolve. Reasons: 1. You are actually referring to a wrong location of the JS file.    - This is a very common mistake done and most of the time we are so damn sure that we don't even care about checking the path once. Even though you have copied it from your existing project where it is working, if you face this issue don't forget to check the path once, it won't harm you. 2. Check for relative path.    - So now you have copied it and paste it in your new file where you are going to use the dhtmlx component and when you open your file you get this error and it becomes frustrating knowing that same thing is wo
6 comments
Read more