00:00

How to turn blogger blog into a website

How to turn blogger blogs into a website

Provided that you want to customize your blogger blog to look like a really website then worry no more you are in the right place.

There are few things to consider before turning your blogger blog into a beautiful and handsome looking website I mean a stunning website if you like.

This is the steps I took before coming up with this template that you are seeing . Without wasting any time let's get started.

First you need to know that websites don't have posts. In order to make it clear, we need to disable some of the gadgets or even delete them completely. This are the things that I recommend instead of deleting any widget . I recommend adding display none in the style as shown in the diagram below. how to turn blogger blog into a website Now that much have been said, let me take you through step by step to archieve better results as a web developer even if you have no skills in coding. As you can see on my blog I like the fixed floating navigation and I thing you like the same. So I went on and disabled it and replaced with mine just after the <body> tag. Because of the digital world or the so called DOTCOM WORLD nowadays people are used to animation navigation bar I mean a navigation bar that display an "x" icon after it's opened or clicked.

Next your website should have a search button or a search bar if you may call it just in case someone needs a certain article he or she may end up getting it without any Hussle.

We will go on and disable the Blog1 widget that displays blogger posts on the main page. Remember websites don't have posts on the main page instead we will display it through links. so we are going to disable it by adding the following code of which I won't give you code for free just Buy Me Coffee and you will be directed to a page where you will copy it and past it in between <head> and </head> and those posts will be hidden.

You may also support my work by just buying the template above

Now search for this code in the HTML of your template or you may use gadgets just above Blog1 or paste this code above Blog1 and write your HTML or your home page contents as the way I did.or just copy this code and paste it above Blog1

<div id='main-wrapper'> <b:if cond='data:blog.canonicalUrl == data:blog.canonicalHomepageUrl'> <div class='recent-boxes' id='recent-boxes'> <b:section class='box-sec' id='box-sec' maxwidgets='1' name='Box Layout' showaddelement='yes'/> </div> </b:if> <b:if cond='data:blog.canonicalUrl == data:blog.canonicalHomepageUrl'> <div class='posts-title' style='color:powderblue;'> WRITE YOUR CONTENTS HERE </b:if> </div>

Now let's move contact form to a specific page the so called contact us page make sure to read How to move contact form to your desired page on how to do it.

After that add display none in the style as in the first diagram add your own newsletter subscription. That's all it takes to make it happen congratulations if you reached to this far and if you are having any problems let me know via WhatsApp chat or comments section below or contact me via contact form.