How to remove borders around your posts on your blogger blog

You are here: Home / Tutorials / Blogging / How to remove borders around your posts on your blogger blog

Blogging services such as blogger, Wordpress, Simplesite and others have become important tools for businesses to showcase their products and services as well as interact with a variety of customers from different parts of the World.

These blogging services have pre-made templates that a user (blogger) will pick up one for his/her new/older blog. They also allow bloggers to customize their templates or even install new ones from different companies that design good/professionally-looking templates.

Today I've shared with you the simple techniques for customizing your default blogger template. These tricks will give you a capability to remove the borders around your posts. Significantly, borders around posts are used to separate the contents on a page and put them into sections, hence makes posts stand out and your readers will easily identify the main and sub-contents of the pages.

If you're bored by the presence of this border, then you've come at the right point and you will be able to remove this border in no time from this moment. Follow the simple steps bellow:

First Step:

Second Step:

Select your blog you want to work on by clicking on its title.

Third Step:

Scroll down-wards and within the left navigation bar, select Template. You will be taken to the blogger template designer

Fourth Step:

Under Live on Blog, click on the Edit HTML button.

Fifth Step:

Click Ctrl on your keyboard and while holding that same key, hit the F key (Ctrl+F). Type the following Css code and hit Enter on your keyboard:

.post-outer {

You will be able to see the following code:

.post-outer {
background-color: $(post.background.color);
border: solid 1px $(post.border.color);

Sixth Step:

Modify the code

Within the second line (border: solid 1px...), change 1px to 0 (Zero). The code will lo will look like the one below:

.post-outer {
background-color: $(post.background.color);
border: solid 0 $(post.border.color);

Seventh Step:

Preview your blog to see if your modification works by clicking on Preview Template at the top of the HTML Template Editor. If it works you can save by simply clicking on the Save template button located to the top-left of the HTML Template Editor.

Now you have successfully removed the borders to all of your blog posts. If you change your mind at any time, you can restore by using the steps above and change 0 to any number. But remember adding px after the number. For example you can input 1px, 2px, 3px, etc depending on your preferences.

If you have anything to speak about this tutorial or anything else, feel free to express yourself in our comment box below. If you have something personal you want to share with the author of this blog, you can contact him by using the contact means located on Ourcontact page.

Others are reading this:

Computer basics tutorials!

Learn the computer basics on our free tutorials. All about software, hardware, and other related matters. Get started now!

Advertisement!

Internet basics tutorials!

Learn the Internet basics on our free Internet tutorials. Learn how to surf the web and a variety of other related matters we offer on this blog. Get started now!

The latest posts!

How to remove borders around your posts on your blogger blog

First Step:

Second Step:

Third Step:

Fourth Step:

Fifth Step:

Sixth Step:

Seventh Step:

Related Posts:

Others are reading this:

2 comments:

How to remove borders around your posts on your blogger blog

First Step:

Second Step:

Third Step:

Fourth Step:

Fifth Step:

Sixth Step:

Seventh Step:

Related Posts:

Others are reading this:

Mjknetten

2 comments: