How to Add Custom Theme in Blogger Blog or Website?

A guide for customization of blogger blog or Website. From choosing the best theme for our blog and applying it to the website.

What is a Custom theme?

Blogger itself provides many stylish and categorized themes in its themes section but when it comes to attracting more viewers to the blog we need our site to look attractive and beautiful. Many bloggers leave their blog just like a setup by a blogger, some choose the theme options from the themes section of the blogger and some take their theme from the blogger's default theme section and customize them as they want, but the professionals choose a different way they make their own template or theme or they download or buy a custom theme from a website like gooyaabitemplates.com, btemplates.com, templatesyard.com or themeforest.net. In this video, we will be trying to apply a theme from the templatesyard theme store.

How to Choose a good Template for Our Blog/Website?

While downloading or buying a theme for our website you must keep some points in your mind because some templates will affect your site's performance. The important points for buying or downloading a template are as follows:
  • Make sure the template must be attractive and well customized.
  • Try to download an SEO-friendly template to improve site performance.
  • The template should be customizable after being applied to the website.
  • Try to buy the templates than downloading them because downloaded templates leave a copyright mark on our website which cannot be removed.
  • After applying customize the templates social and redirect links in the layout section.

How to Remove copyright from the template you downloaded?

The templates downloaded from the sites listed above are both available for buying and free downloading but the downloaded templates will leave a copyright mark on your site as shown in the image below:
the copyright can be seen in the down-left corner of the image.

This copyright sign cannot be removed unless you officially buy the template from the websites you downloaded. If you try to remove the copyright from changing the code of the templates this will make your site always redirect to the site from where the template is downloaded and you cannot stop the redirection unless you again add the copyright code to the templates HTML which you removed to remove the copyright code.

How to Download the templates?

the distinct custom templates can be downloaded from many sites. This article will be downloading the 'TECH TIMES' template from templatesyard.com and customize it for our blogger website. Follow these steps to download the template:
  1. Go to templatesyard.com
  2. Scroll down and choose the templates you need.
  3. Click on the template and a new page will open where you can see the demo of the template.
  4. Now Scroll Down and you will see the Download and buy option click on what you prefer and the downloading will start shortly in form of a zip file.
  5. Open your file explorer and extract the zip file with software like Winrar or 7-zip.
  6. There will be an XML file in the zip which will be visible after extracting the zip file. This file is the code of the templates which we are going to apply to our site.

How to apply the template to our website in Blogger?

We have successfully downloaded the template and extracted the zip file, Now it's time to apply it to the site. To apply Go to blogger.com and sign in to your blogger account and follow these steps:
  1. Go to the themes section of the blogger website and click on the down arrow right of the customize button and click on restore.
  2. Now select the XML file you extracted from the downloaded zip and click open.
  3. It will take some time to get restore the theme and get applied to your website.
  4. Now go to Your website URL and the template might be applied to your website.
  5. If you have downloaded the same TECH TIMES template it will look like follows.
  6. Now your site might be looking attractive and beautiful.

How to Customize the template?

You must have observed that the template shows TECH TIMES in the header and not your actual header and some additional links and widgets on your website that you don't want to be shown. To change this go to the Layout section of the blogger and change the header from TECH TIMES to what you want it to be then remove or hide the unwanted widgets and extra links. if you have about and contact page then links it to the website by adding their respective URL in the respective widgets in which they are appearing on the websites.

Take a look at my tutorial on how to add syntax highlighting in blogger with prism.js library if you wabt to write coding tutorials in your blog.

Now Your Website is ready and looking Very much attractive than before.