Customizing Blogger Template
Here is the full guide of how one can customize blogger template
Quick Navigation
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Changing Menu Links
Changing menu can be done with the layout or with Html editing both are
simple and easy to learn but it may be that some templates do not support
editing menu links from layout, so in this case, you have to do Html editing but
that's no problem.
Moreover, two types of menu are some menu support mega
menu ( mega menu means that when somebody moves the cursor over the link then it
will show posts with thumbnail as to make fancier). So, do not add mega menu
setting if not supported.
By layout
- Go to blogger dashboard, and then go to layout option.
- Then you will find menu option (refer image.
- Then click on edit
- After that, a new small window will appear on which we have to edit menu links
- To add links just enter the site name (for example tech) and enter the URL (for ex - https://example.blogspot.com/search/label/tech ) then click on add link. After that, you can add more links as same.
Add drop downlinks
To add a drop-down link we must take care of the arrangement of link.
- To make a drop-down menu in the blogger site first enters then site name with URL as the main category.
- Now we have to add submenu so add sitemap with the prefix _ ( forex _mobiles) and enter the site URL. Similarly, follow the same to add more sub-menu.
- Now, to add sub sub menu you have to add double underscore ( forex __mobiles under 10000 ) and enter its link then add this.
- After this arrange the link so that mobiles comes under tech and mobiles under 1000 comes under mobiles,
Adding Mega links(if supports)
- To add a mega menu you have to add the site name ( for ex - tech) and in the site URL section enter like this label/mega-menu (forex - tech/mega-menu) then add this and finally, save it.
That's all
By Html
- Go to blogger dashboard, then go to the theme section then click on edit. In Html, you can search for these titles and then replace them.
- To do so press Ctrl+f then search for something that is already in menu (if you find the same keyword more then press enter to move to another and check what is correct, see image for reference).
- After that replace the title and URL with yours.
- If you want to add more links then you can do this by copying the same code of one of the links and paste below them and then change title and links.
- After that click on save.
Changing top navigation links
To change top link like Home, about, contact or privacy policy with
yours. By default, these links are of the template website. Before that, you must
have these pages ( Don't know how to make these)
By layout
in layout option, you will find these links (refer image)
- So, to change them click on edit.
- then replace the URL of the site URL with yours
- you can also add links by own just enter site name (for ex - privacy policy) and enter its link in the site URL section then click on the add link and finally save it.
By Html
- Go to blogger dashboard, then go to theme section then click on Edit Html
- In Html, you can Search for these titles and then replace them.
- To do so press Ctrl+f then search privacy policy (if you find same keyword more than press enter to move to another and check what is correct, see image for reference).
- After that replace the title and URL with yours.
- If you want to add more links then you can do this by copying the same code of one of the links and paste below them and then change the title and links.
- After that click on save.
Change your logo on blogger
A logo is important for everybody as it represents your website, and without
that nothing completes so you must understand how to change logo on
blogger. Before that, you must have a correct size logo (Click here to know the correct size of the blogger).
It is seen that in some blogger template two logos have
to be changed, one is for the desktop version and one for mobile version but that’s
not a problem the steps are same, difference is that you have to change the logo at
two places.
- Go to a layout option, then you will find logo settings in the header section (refer image)
- Click on edit, then remove the previous logo or chose your new logo.
- Below this, you will find an option for placement(that is where you want to place your logo, chose as per your )
- Then click on save.
Change Social media links
Social media links connect your viewer to your social media. Social media links in your site help the viewer to know about you more with social pages or accounts. So, you should have a social media account and you must understand how to add or change social media links in the blogger template.
By layout
In layout, every setting is not given so if you don’t have this option then you have to go for Html editing. However, to change social media links s same as we change the menus and navigation links.
- Go to layout, and find social media plugin settings(refer image)
- Click on edit to change previously added links with your own.
- To add a link to social media, in site name add social platform name ( forex- youtube, Instagram, Facebook, Pinterest) and in site URL enter your social page link.
- Then click on add link. Similarly, you can add more links. After that finally, click on save.
By Html
- Go to blogger dashboard, then go to theme section then click on Edit Html
- In Html, you can search the name of social platforms that are already in the template ( forex – Instagram) and then replace them. To do so press Ctrl+f then search (if you find the same keyword more then press enter to move to another and check what is correct, see image for reference).
- After that replace the URL with yours.
- If you want to add more links then you can do this by copying the same code of one of the links and paste below them and then change title and links.
- After that click on save.
Change favicon from blogger’s default from own
To change blogger favicon you must use classic blogger dashboard(in new blogger there is a problem, as it not showing favicon option in layout)
- Go to layout, and in the top, you will find favicon option, click on edit
- Remove the previous image with own
- Then click on save.
Adding Featured Posts
In blogger, you can add featured posts but you can add only one and don’t have many options to customize them but in some templates, you will find featured posts section by default. So, here I will make you understood how to change featured posts with your own labels. To do so layout method is preferred
.
- Go layout option, then you will find many featured posts ( forex – featured posts 1, featured posts 2 ) we will tell anyone of them as the procedure is the same.
- Click on edit.
- Then you find code look like this 3/business/feat-big.
- Before this, you must understand what these means
Place where the business is written means you can change with any label ( forex- tech ) or with recent and random
And in the last, it was the type that how was it look. So there are many types but you must refer template documentation (find in template folder you downloaded, or find it on google) because not every template supports all types.We have many types likes feat-big,grid-bid,grid-small,col-right,col-left,hot-posts.
Now to change these
- Change the no with your own and in between add any label or recent or random and do not change type as we don’t know which type supports or which not.
- Also not change no. Because by default no. It is best for the template so if you change it it will make template looks bad but if it looks great then keep it.
Change the background of the website
The background of every blog is not supported by every template but some are made to be changed.
To do it go to blogger dashboard, then go to the theme and click on customize(refer image )
- After that on the top left side, you find the option to change the background.
- Click on it then remove the default image and choose your image and upload it.
- Also, you can find here many free quality images to use as a background image.
- Then after changes click on the apply blog(on the top right)
Change template colors
- As like background, this setting is also not supported by all templates.
- Go to blogger dashboard, then go to the themes section
- Click on customize button
- After that on the top left, you will find background option, click on it
- And on the right side, you will find a color-changing option where you can choose colors for your site.
- After changes click on apply on the blog ( top right)
How to change links via Html
- Go to blogger dashboard, then go to theme section then click on Edit Html
- To change links from Html you have to find the title from your website that you want to change.
- To do so press Ctrl+f and forex we search about
- You may find many about keyword press enter to skip to other, then look for about that we want to change.
- After that, you will find about keyword and on its side, there will be a link to it. Just change that link with yours.
- If you want to add another link then copy the code of about and paste below it and change the title of about with yours and also change its link.
- After that click on save
If it shows failed then there is a mistake done while editing in Html then you have to do again.check that every code must have closed tag ( forex <li> code must have it closed tag </li>)
Change default thumbnail
In templates when there is no image in your blogger posts then it will it default thumbnail, we called it no image thumbnail. So, you can also change with own image.
Tip: No image thumbnails also appears when you copy images from another site to your posts. So, don’t do this mistake.
- To change default thumbnail with own thumbnail image, you must have an image that you want to replace.
- If you have links of the image then it is best if not first you have to host your image (you can host image free here https://imgbb.com after that copy image URL and paste somewhere we need later)
- First, go to your blogger site and from the post which showing default thumbnail right-click on it and copy its image address
- Then go to blogger dashboard, then go to themes and then edit Html
- Press Ctrl + F and search the image URL then replace the URL with your own image.
- Then save it.
Sometimes the default thumbnail URL is more than one, so you have to replace all of them.
Guys, this posts is really awesome and is long as it contains full description about customization and we thank you if you subscribe us on youtube https://youtube.com/whizzyshubham
0 Comments