How to Hide and Delete Breadcrumb from Blogger Template?

How to Hide and Delete Breadcrumb from Blogger Template

5
data:blog.title
remove Breadcrumb

Breadcrumb is useful for navigating sub-categories to parent category and home page. So this play an important role for making a Blog user friendly. However Breadcrumb is not suitable for all kinds of Blog. It's importance varies according to template niche. However many Blogger wants to remove Breadcrumb from their Blogger template. From my point of view hiding is better than completely removing Breadcrumb. Because if you feel in future that Breadcrumb is useful and should include in your Blogger template then  you can simply again display the Breadcrumb. So in this tutorial I will show you how we can hide and display Breadcrumb in Blogger template.

How to Hide breadcrumb from Blogger template?

For hiding the breadcrumb from Blogger template Please follow the below steps-

Step 1 Log in to your Blogger Account and Go to your Blogger Dashboard

Step 2 Click on Now click on -> Template -> Edit HTML

Step 3 Now find the </b:skin> by pressing Ctrl+F (Windows) or CMD+F (Mac)  

Step 4 Copy the code from below and Paste the code above/before </b:skin> 

.breadcrumbs{display:none !important;}
or
.breadcrumb{display:none !important;}

Step 5 Now simply hit the Save template Button. 

Now check your Blogger template and see that you template Breadcrumb is not showing anymore. However If you want to display the Breadcrumb again then simple remove the added code .breadcrumbs{display:none !important;} and save your template. that's it. Your template Breadcrumb will display again.

How to Delete breadcrumb from Blogger template?

So this is very simple to hide Breadcrumb. But we can completely remove Breadcrumb from our Blogger template. Just follow the below steps-

Step 1 Log in to your Blogger Account and Go to your Blogger Dashboard

Step 2 Click on Now click on -> Template -> Edit HTML

Step 3 Now find the below by pressing Ctrl+F (Windows) or CMD+F (Mac)  
.breadcrumb {border-bottom:1px solid #E2E2E2;height:24px;overflow:hidden;margin:0 0 20px;font-size:86%;font-weight:bold}
.breadcrumb li{float:left}
.breadcrumb li a,.breadcrumb li span{display:block;height:24px;line-height:24px;padding:0 10px}
Step 4 Now delete the whole code block.

Step 5 Now simply hit the Save template Button. 

Note that the code won't be exactly like above it will vary according to design. But in my designed  Blogger template I have used the code like above.  But focus on ".breadcrumb" which is the beginning code of breadcrumb. If you are following this process then you won't able to recover your breadcrumb code again. But if you have a backup then you can include it again. 
How to Hide and Delete Breadcrumb from Blogger Template?
4 Stars stars - "How to Hide and Delete Breadcrumb from Blogger Template?" Breadcrumb is useful for navigating sub-categories to parent category and home page. So this p...

Thanks tutorial you give, make it easier to understand the template.

Welcome Supriyadi..I always try to write within simple word. IF you face any difficulty to understand then feel free to drop comment.

eta delete korlei ki search engine direct post link show korbe??? check my website www.bondua.com please

I want to remove breadcrumbs from my blog, I hope it will help.

Your template hasn't any breadcrumbs..

Facebook Group Community Disqus Channel Code ConverterHide Code Converter Show EmoticonHide Emoticon

Got questions? Ask ’em below! While we’re here, you might like to give any feedback about this Post, Your comment inspire us to continuous Improvement of This Blog and Contents. Your words are your own, so be nice and helpful if you can. Please, only use your REAL NAME, not your business name or keywords. Using business name or keywords instead of your real name will lead to the comment being deleted. Anonymous commenting is not allowed either. Limit the amount of links submitted in your comment. We accept clean XHTML in comments, but don't overdo it please.

Make sure you tick the Notify Me box below the comment form to be notified of follow up comments and replies. Thank you for commenting

Contact Form

Name

Email *

Message *