July 19, 2018

Setting Up Custom Blogger Templates

Before reading this article make sure you have gone through the past 5 articles on my blog if you are an absolute beginner.

  1. Start a Blog in Blogger
  2. How to Write A Post in Blogger?
  3. How to Customise Blog Layout and Theme?
  4. Labels/Tags/Menu Bars in Blogger Blog
  5. How to Add Custom Template in Blog?

But if you are little bit into HTML coding then you can follow up straight from here.

  1. How to Remove Powered by Blogger Attribution Widget?
  2. How to Remove Quick Edit Icon aka Screw Driver Icon from Blog?
  3. Remove Subscribe to Posts(Atom) from Blogger

These will portray how with little bit of coding knowledge, you can do hell lot of things on your website design.

Talking about Customization of a Blogger Template, this completely depends upon the choice of a particular designer. In this article I have tried to cover up few fundamental portions that will enhance your custom template to one of your own kind.

Setting Up Custom Blogger Templates

How to edit the custom template?

1. For editing the custom template you'll have to sign in to your blog.
2. Move to the Theme Menu form the blogger dashboard.
3. Click on Edit HTML.
4. Then follow the blocks below.

Editing the custom template [step by step]:

1. Editing the Header Widget

1.Click on Jump to Widget button, and select Header.
2. Here you can add/remove the menus and sub-menus at you comfort. For this, locate the corresponding statement to the Menu you want to redirect to.
3. Usually, most custom templates contain only ' ' or '#' characters in the URL part.
4. You have to change it to the one you want it to redirect.
5. Once you have made necessary changes then simply click on Save Template.
6. Now, go back to your blog's homepage and refresh. You'll see the Menu Bar is changed. Also the sub-menus if added with the links are working. Check the video below.

2. Editing the Main Menu

The Main Menu here indicates to the position of the blog right below the browser's address bar. On the left you'll see some links are present that wont work until edited in HTML code. On the right generally the social plugins are found where you can add/remove any social media icons within them.

1. Visit the Edit HTML page.
2. Then, press Control+F to open find field in the HTML code window.
3. Next, type Main Menu and hit Enter.
4. Once, you see the highlighted text, navigate to the respective buttons and edit them as per necessity.
You can check the video below to find out how it was done.

3. Footer

As the name suggests, this is found at the bottom of any web page. Here, you can find by default the credits of the theme creator is present. I will suggest you to leave it unedited as it reflects the hard work of the developer. However, if you are buying the theme, then you can change the theme at your will.

1. So, click on Jump to Widget and Select Footer(if showing up).
2. Now, you'll see the lines beginning with "Created By" phrase. You can simply retype the URLs provided in the links section and edit the texts to put in your branding.
You can check the video below to find out how it was done.

Other than that there are also minute level editing possible depending on the type of template you have applied to your blog.

Video Tutorial:

1 comment

Avoid Spammy Comments