How to Clean Up Your Blogger Template and the follow up Ways To Clean Up Your Blogger Template. This time I thought I’d take a slightly different approach. As a reader, one of the things that overwhelms me when I enter a blog is too much clutter. So I’ve compiled a list of 7 different elements that are easily removable and won’t be missed!
1. Remove the navbar
I’m not too keen on the blogger navbar.
It doesn’t really serve a useful purpose these days and it can clash
with the look of your blog. To remove it:
Go to your
dashboard and select the “Layout” tab. In the top right of the layout
you will see your “Navbar” with an option to “edit.” Click “edit” and a
window will pop up with the option to alter the colour scheme or turn
off the Navbar altogether.
dashboard and select the “Layout” tab. In the top right of the layout
you will see your “Navbar” with an option to “edit.” Click “edit” and a
window will pop up with the option to alter the colour scheme or turn
off the Navbar altogether.
2. Remove clutter from your footer
Blogger adds a whole load of
info to your footer, such as author and time posted, that you likely
don’t want displayed. To clean up the footer all you have to do is:
Blogger adds a whole load of
info to your footer, such as author and time posted, that you likely
don’t want displayed. To clean up the footer all you have to do is:
Go
to your dashboard and select the “Layout” tab. There you will see your
“Blog Post” gadget. Click “edit” on the gadget and a window will pop up.
Under “Page Post Options” you have the ability to un-check (and remove) any
elements.
to your dashboard and select the “Layout” tab. There you will see your
“Blog Post” gadget. Click “edit” on the gadget and a window will pop up.
Under “Page Post Options” you have the ability to un-check (and remove) any
elements.
3. Remove or beautify the “showing posts with label…” message
The
status message that pops up at the top of your page when you search through labels
‘ent all that pretty. You can either remove it completely or you can
pretty it up quite nicely if you desire. Xomisse has a great tutorial here on how to do either option.
The
status message that pops up at the top of your page when you search through labels
‘ent all that pretty. You can either remove it completely or you can
pretty it up quite nicely if you desire. Xomisse has a great tutorial here on how to do either option.
4. Remove the borders around your images
This is
completely a personal preference thing, but the look most people seem to
be going for these days is sleek and clean. Removing the borders from
you images will help add to that look. To do so add this code to your Add
CSS box:
This is
completely a personal preference thing, but the look most people seem to
be going for these days is sleek and clean. Removing the borders from
you images will help add to that look. To do so add this code to your Add
CSS box:
.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
padding: 0 !important;
border: none !important;
background: none !important;
-moz-box-shadow: 0px 0px 0px transparent !important;
-webkit-box-shadow: 0px 0px 0px transparent !important;
box-shadow: 0px 0px 0px transparent !important;
}
.BlogList .item-thumbnail img {
padding: 0 !important;
border: none !important;
background: none !important;
-moz-box-shadow: 0px 0px 0px transparent !important;
-webkit-box-shadow: 0px 0px 0px transparent !important;
box-shadow: 0px 0px 0px transparent !important;
}
5. Remove the dotted lines at the bottom of the page and between the pager
Blogger templates come with a dotted line above their “powered by blogger” attribution and even more dotted line in between the pager (Newer Posts, Home, Older Posts). If you want to remove these lines, simply add this to your Add CSS box:
Blogger templates come with a dotted line above their “powered by blogger” attribution and even more dotted line in between the pager (Newer Posts, Home, Older Posts). If you want to remove these lines, simply add this to your Add CSS box:
.footer-outer {
border: none;
}
border: none;
}
.blog-pager {
background: none;
}
background: none;
}
6. Remove the “Subscribe to Post Atom” message at the bottom of the page
This is a fairly insignificant detail, but if you’re picky and anal like me it might bug you to see this guy hanging around all the time. To remove it search your HTML code and delete the line below:
This is a fairly insignificant detail, but if you’re picky and anal like me it might bug you to see this guy hanging around all the time. To remove it search your HTML code and delete the line below:
<b:include data=’feedLinks’ name=’feedLinksBody’/>
7. Remove the comments from your About and Contact pages
This area isn’t necessarily an ideal space for comments. It’s probably a good idea to keep it as straightforward and organized as possible for anyone who needs to find your contact info or wants to read your bio. To disable comments:
This area isn’t necessarily an ideal space for comments. It’s probably a good idea to keep it as straightforward and organized as possible for anyone who needs to find your contact info or wants to read your bio. To disable comments:
Head to the dashboard, go to “Pages” and click “edit” on the page in question. Once your in that page look to your right sidebar, click “Options” and under “Reader Comments” select “don’t allow, hide existing.”
Example:
Preview:
/*-- mobile view findme -- */ .mobile { background-image: none !important; } .mobile { background-color: #FFFFFF } /*-- mobile slider -- */ .mobile #sidebar-wrapper { Display: none; } /*-- mobile display1 --*/ @media screen and (max-width:930px){ #HTML3{display:none;} } /*-- mobile display2 --*/ @media screen and (max-width:930px){ #HTML11{display:none;} } /*-- button see more -- -- */ .jump-link { text-transform: capitalize; margin: 0 auto; font-size: 14px; letter-spacing: 2px; text-align: center; padding-top: 8px; } .jump-link a { border: 1px solid; padding: 8px; } /*-- findme-header display -- */ .header h1 { display:none; } /*-- findme-header menu -- */ .header-inner { margin-bottom: -68px!important; } /*-- findme-tabs spacing -- */ .tabs-inner .widget li a { padding-right: 11px; padding-left: 11px; } /*-- findme-post footer -- */ .post-footer { margin: 0; } /*-- set name="main.border.radius to 6px -- */ /*-- findme-nav spacing -- */ body .navbar { height: 26px; } .content-inner { padding-top: 0px; } /*-- findme-menu top fixed -- */ #PageList1 { position: fixed; top: -30px; left: 0px; z-index: 999; width:100%;} /*-- findme-search box fixed -- */ #hbz-searchbox { position: fixed; top: 0px; right: 0px; z-index: 999; width:100%]]></b:skin> <!--Custom Notice CSS by exeideas.com--> <style> .cookie-choices-info {z-index:999999!important; background-color:#333333!important; border-bottom: 1px solid #6FC415; box-shadow: 1px 2px 2px #000!important; padding:3px 0px!important;} .cookie-choices-info .cookie-choices-text{font-size:14px !important; color:#dddddd!important;} .cookie-choices-info .cookie-choices-button{ background-color: #6FC415!important; border-radius: 1px!important; box-shadow: 2px 3px 2px #000!important; padding:6px!important; text-transform: none!important;} </style> <!--end Custom CSS -->