• How to start with Blogger in 2019


    Blogger1 is the first choice for most of the people who want to start their career as a Blogger2 that without spending any amount of money. Although most of the people prefer Content Management System (CMS) services over Blogger but still, considering a free account the features and functions provided by it are nowhere available. Considering CMS service providers like WordPress, Joomla, Wix, and some others, Blogger has given more power to its users in either maintaining /editing/publishing blogs. You can see why you should start your Blogging career with Blogger rather than going for Wordpress. Do not confuse for using Blogger twice in the first sentence. There former is the "service provided by Google" and the later is "a person who writes articles (blog posts) on a regular basis". Before getting into the main topic here are a few things that you need to know.
    Complete guide to Blogger blogspot

    What is a Blog?

    A Blog is an abbreviation to Weblog. In fact, the word "Blog" is taken from Web-log. A Blog or Weblog means a website published to the World Wide Web (WWW), with the collection of articles (posts) that are arranged in reverse chronological order. It means the latest posts appear at the top of the Webpage. In the earlier days till 2009, blogs were usually the work of a single individual, there existed only a few blogs from a group of people. But the year 2010, brought vast changes and blogs with multiple authors have arisen. It means the articles (or blog posts) are written by different authors, with varying subjects. Ultimately this paved the way for providing different subjects on a single website. There types of blogs too. Some of them are Personal blogs, Corporate blogs, Aggregated blogs and other. For more on this, you can refer to Wikipedia.

    What is Blogger?

    Blogger is the service provided by Google for publishing articles namely posts. With the changing technologies, Blogger has undergone various transitions. Originally Blogger was not started or founded by Google. It was actually from Pyra Labs, founded in the year 1999. Later in the year 2003, Google bought it and began to introduce vast changes. Blogger now (time of writing this post) is placed in the top 50 Domains list with 25th and 11th ranks in Alexa and Moz respectively. You can start a website on almost all the languages but not all. For more, you can refer to Wikipedia. Blogging is the act of writing posts/articles for a website or blog. Blogging also refers to maintaining the website as per the recommended methods or standards. Starting a blog is easy. Remember it is not that easy to maintain a website. You need to work hard to get success in this field. But never mind, starting a blog is easy. One more thing Blogger and Blogspot are one and the same. You can call it as Blogger or Blogspot, there will be no difference in them.

    Starting with Blogger


    1. Creating your first blog with Blogger
    2. Choosing a nice responsive template for your Blog
    3. Installing template in Blogger
    4. How to edit Blogger template?
    5. Making your first Post

    1. Creating your first blog with Blogger

    Go to Blogger main site.

    A) Sign In with one of your existing Gmail account or even you can create a new account. Choose whatever is better for you.
    B) After completing Sign In the process you need to Review your Google+ profile, if no issues there, continue with the process by clicking on the continue button.
    C) After that, you will be taken to an interface containing a notification and below that a button (CREATE NEW BLOG) to create your first blog (here Blogspot). In the notifications, you will be provided with European laws and some other notices. If you want you to read it otherwise leave it. If you do not want to close it.
    D) Method 1: Click on the button provided (available only when you were creating your first Blogspot). There is another way also.
    Method 2: Under the Blogger logo you will see a down arrow. Click on it, a drop-down appears as "New Blog". Click on New Blog.
    E) Now you will be presented with a dialog box. It contains 2 fields and an option to select a theme (you can change it anytime).
    F) The first field is the title of your Blog. Give there a name relating to the topic you have chosen. You can change it anytime.
    G) The second field (Address) is corresponding to Domain Name. You have to choose a unique name to your blog. Give a unique name there. This also can be changed later but not advised, as it affects your page speed. While choosing the name you will be told whether the name you have given is available or not. If not available you have chose another name, if available simply continue the process.

    Note: Remember these points while choosing a Domain Name (here Address):
    a. Choose a unique name.
    b. Numbers and Hyphen can also be chosen but on max cases do not use them. On using, they may look odd with your URL i.e., Domain Name. It is also important to help users in remembering the URL easily. So give a name that is easy to remember.
    c. Do not include Keywords. You will not be benefited from having Keyword in your Domain Name. Google has removed this feature long time before. Some websites advice you to use a Keyword, but it is not required and is no longer an SEO factor. But it is your choice of choosing your domain name.
    f. The address should be user-friendly i.e., easy to remember. ( helps in returning users)
    g. As you are creating in Blogger and that too a free account your domain name will have an extension as blogspot.com and not simply yourdomainname.com (or any other like .in, .uk etc). Means your URL will look like this yourdomainname.blogspot.com. This is because the blogs we are creating under Blogger which acts as a subdomain under it. So you will see that extension. You have no other chance but to use it. If you want your URL with .com or any other type then you can buy it from any Domain Name providers like Google Domains, Go-daddy (free domain with plans), Wordpress.org, Bluehost etc.
    h. Even if you have a Custom Domain (already bought a domain) then also you need to provide Address here. Later you can change Blogspot address to your domain name.
    i) You have a chance to change your domain name (having .blogspot.com). If you change it in the initial few days then there will be no problem, if you change it after getting good traffic then it affects page speed for returning users. So get it in the first choice. But if you have bought a domain then you will not have a chance to change it unless the provider allows it to change.

    H) Now choose the template you want, click on create blog to see your first Blog. Or you can end the process by clicking on cancel. That's it you have created your first Blog.

    The templates provided by Blogger are good but not user attractive or likable. It is also your choice to or not to change. So first thing after creating your first blog is to change its template. Now the next topic is Choosing a nice template for your blog.

    2. Choosing a nice responsive template for your Blog

    Why am I telling responsive here? For that look into the following answer. Before getting on look into these terms, you can understand easily.

    a. Pagespeed

    It is a measurement of the time taken by your webpage (either your post or Home page or any other) to load on the user device (either mobile or desktop). If your site loads faster then soon you can see fruits from Google. But if your webpage or website has bad load time then you will definitely face some issues with your traffic or even from Google. Also, remember users will not like slow loading pages, they fly away from easily. So it is us to keep this in mind and choose a good template that had a good load time. For this, I will tell tricks further down.

    b. Structured Data Markup

    It is a markup like HTML, used to display rich snippets in the results page of a Search Engine either it is Google, Bing, Yandex or any other. This is very important for Blogger templates as it is a part of SEO. Some of the templates have bugs in Structured Data Markup. So you need to check this before choosing a template. You also can add those markups, only useful to increase the burden on you. But one thing if you like the template then choose it and take some time for editing it. I recommend this because even if the template has bugs you can solve those by using forums, help from different communities and Social Media. So do not bother, but you should consider Structured Data.

    c. Check for Bugs

    Some of the templates have bugs. So you need to be aware of that while checking the template. There will be small issues that you may not find while you are seeing it for the first time. Even if you have bugs refer to communities. If you buy a template then you will be provided with the service and can easily solve bugs. But if it is a free version then you need to depend on forums or communities.

    d. All major requirements (shortcodes)

    This is very important. You will not always depend on the text. Sometimes you will use pre, blockquote, code, tables, and a few others. Those are all called shortcodes. Check whether these shortcodes are present in the chosen template. Otherwise, you have to search or go for forums, communities. Not having this, if added by you then it will increase no of requests or webpage weight. So better choice is to look for these shortcodes too along with the above ones.

    e. SEO and Responsive template

    I will not tell this as a factor but it helps in search results. Almost all the templates provide the same kind of HTML markup in the header tag (not Bootstrap templates). For any template, there are some meta tags that should be added for better Webpage optimization. There are many solutions for getting these tags. One is if you have Adobe Dreamweaver, then it provides all the required tags and you only need to change some values like author name, profile, Website logo, Viewport, Apple touch icon, and few others. The second source is to View Page Source ( Ctrl + U ) of a Blogger site (you can see mine). The third one is help from others. You also have to look whether the Webpage scrolls smoothly. This is also one factor to lose traffic.

    f. Mobile Friendly

    Of all the above this is the major factor for any Website traffic. Now-a-days traffic from Desktop users is declining slowly and Mobile traffic is increasing a lot. So it is must and should that your template should be Mobile Friendly. While checking the template look for the mobile version too in it. Otherwise, you will face a lot of issues in the middle and that makes you start over again. So be careful. For this, you can use Inspect Element ( Ctrl + Shift + I ) in your Browser. All the browsers (maybe not Edge browser) will provide this feature and you need not worry. In the Inspect Tools, you need to select an icon having a table or mobile. This is placed in the left part (symbol after pointing arrow) for Google Chrome and on the right part (symbol before 3 dots) for Mozilla Firefox. Another choice is to go for Mobile-Friendly tool from Google. A very handy tools for checking mobile friendliness.

    g. A test site (optional)

    When you create your first blog, create another blog for testing purposes. The reasons for this are, one to check if the chosen template is working fine or not, there may be cases when you want to add external code or even remove some part of code then definitely the testing blog is very helpful. I user two to there testing blogs because I will change code frequently to make my site SEO Optimize. A better choice if you follow it, otherwise simply neglect it. I will tell further use of this later.

    h. Removing render blocking scripts

    This is the main issues with Blogger templates. Most of them have bad page load time because of using excessive JavaScript or jQuery. Here are a few points you need to consider and I will discuss pagespeed solution here. Using too many link tags and third party scripts can affect page speed badly. So it highly recommended reducing the no of requests your Webpage has to make for complete rendering. Long time back page load time is very bad as discussed above. Later Google found a solution that renders Above the fold of your webpage under one second. "Above the fold", or the top fold of the page, refer to the portion of the page a user can see without scrolling down. It means the first part of your Webpage that is visible to a user should load in one second, the remaining ( other than Above the fold) can be loaded while the user is in interaction with first part of your site. You can refer below image to know what Above the fold is!

    Above the fold from Google to reduce user migration


    Through "Above the fold" Google made Bloggers to render their Webpage first part as quickly as possible i.e., actually under a second. But most of the Websites do not follow this. Google recommends 4 seconds for a complete load of the webpage but more than 70 % of the sites take above 7 seconds to load and also to remember even 0.1-second delay will allow users to lose interest on that site. There are some famous stats on the page speed of some famous websites. If want to see them you can go for Audits in chrome developer tools (through Inspect Element). As a solution to this Google provided two options. One is two install Pagespeed Modules on your server and the rest of the things will be taken care by the server itself. That option is automatic i.e., you need not do anything. Everything is done by Servers either it is optimizing images, Minifying CSS, HTML, JS and others etc. The second option is to manually do everything. You can use Pagespeed Insights for more. There you need to provide your Website URL and click on Analyze. After analyzing you will be shown the results. Based on those you have to modify your website. Images will be provided which are to be optimized and also CSS, HTML will be provided in the Minified form, reduces some of our work. One more to think of is using async. Async means you can execute some other task while the present one is still undergoing. This is particularly helpful when you have third-party URLs like Bootstrap, jQuery, and some others. Using this helps two or more tasks run parallelly. It is very helpful and good for page speed.

    i. Enable Compression and Minified CSS, HTML, JavaScript

    Most of the templates do provide this feature. But you also need to have a look at it once before choosing. Minifying means reducing the weight of CSS, HTML, JavaScript by eliminating spaces, comments, and a few others. It helps in reduction of Webpage weight and has to be considered as one of the major factors in Page load time. You can use different minifiers available on Online. Even Pagespeed Insights provides an output if possible. Compression is also must be required feature in any template. With this feature, your webpage weighs 1/2 or 3/4th of the normal weight.

    j. Reduce no of Requests

    If the no of requests increases for your webpage then it takes more time and causes disinterest in users. For example, your Webpage needs 70 requests for the complete load then it is the indication that your webpage has a bad load time. Reducing those requests 40 - 50 is better and also provides the good user experience. To know how many requests your webpage makes go to webpagetest.org or pingdom.com. The best solution for this is reduce the no of third-party URLs or maintain only the required ones.

    ** Use Bootstrap Blogger Templates (Recommended)


    For all the above issues you can simply use a Bootstrap template as it is fully responsive and also fully mobile friendly unless you edit the wrong part of the code or the developer has forgotten something. Almost all the above can be achieved with these templates. With bootstrap templates, you can simply reduce no of third-party URLs as it contains many of the features which are on many Websites.

    3. Installing template in Blogger

    Now you would have got at least some idea about how a Website ranks, increases ranks, downfalls, increases traffic or even lose traffic. Those are the main points that need to be remembered for Optimizing your Website. The reason why I have discussed them here is that you should have an idea of all those as you were entering into Blogging. I have learned all those at different points of time. But now I am helping you by gathering all the required methods/contents at one place so that it eases your work. You would have already downloaded templates for your blog. If not go to these sites and pick a best / liked one. Themexpose, copybloggerthemes, gooyaabitemplates. You can even consult me for Templates without footer credits. No, we shall see the template installation. Follow the below steps.

    a. When you download a template you will get a zip file. First, you need to unzip it using Winrar or any other equivalent software. If you have Winrar then select the file, right click on it and select Extract to *filename*. Now the folder is unzipped.
    b. Open that folder, check for a file with .xml extension. Open that either with Notepad / Notepad++. Now click anywhere in the opened file. Use Ctrl + A to Select All then copy it using Ctrl + C.
    c. Open a Browser. Sign In with your Google Account, go to Blogger official site. In that, you will see a set of options on the left-hand side. From those click on Theme. Now on the right-hand side, you will see two screens, one is in the form of the Desktop and the other is in the form of Mobile. Under them, you will see two buttons. From them click on Edit HTML.
    d. Now on the right-hand side, you will see another editor having a huge code. Click anywhere in the code. Use Ctrl + A to select all and delete complete code using Backspace. Now you can paste the code you have previously copied. After copying click on Save Theme. Wait until it saves (i.e., turns back to the original color seen before). Go back and view your blog or even watch a preview from Layout.

    Now you have installed your template. Now it time for you to change color and some other parts of your template. The reason for editing is there will be large no of people using Blogger templates. The template you have downloaded may have been used or being used by many of the Bloggers like you and me. So it is recommended to change the appearance of your template so as your template does match with others at least in color.

    4. How to edit Blogger template?

    Well for this I may not provide complete guide because editing a template completely depends on your knowledge. So I can share only a few tricks to ease your work. The reason for not having a guide on editing template is code varies from one template to another. Also, some templates will be with sidebar or without sidebar or one column or two columns etc. So it is not easy to cover every aspect. But to add any code or remove a small part of it you can interact in forums and communities or even then blogs you follow. Remember the below points while editing your template or changing the appearance of it. Both will be discussed under two sections.

    A) Removing code or dedicate some features

    Here you will learn some tricks and guide to edit a template.
    a. Remember using too many animations, features like carousel sliders, Typewriters, many icons etc., have to be removed or reduced. These definitely affect the no of requests your server has to make, also time for rendering them is high. Yes, they look very nice and attract most of the eyes but it is at the cost of your load time. Why you should consider load time is because it is also one of the deciding factors in page rankings. Use page speed Insights (discussed above). There you will get results, if they are more than 90 (for Homepage, posts, pages) (both desktop and mobile) then you have done a great job in choosing or editing the template.
    b. The first thing to do is change primary color of your template. For this, you can use Inspect Element ( Ctrl + Shift + I ). You have used this for changing CSS, HTML parts of your template. For using it, open your website and go to the part of the template where you want to bring changes (here eg: Background color will be discussed). Now right click on the part which you want to change. Inspect gives two parts one is HTML and other is CSS. Go to CSS section and look for the background color of your template and copy that hex code. Go to your Blogger Dashboard. In that click on Theme, then choose Edit HTML. Now find the hex color (copied one) in that code. TO find, first click anywhere in the code and use Ctrl + F to open a find box. There copy the Hex color and press enter, you will be highlighted with blue color wherever the Hex color is present. Change that value a new one. Like this with the name of the element you can simply find it and remove or change them accordingly.
    c. Choosing the matching colors is very important, otherwise, it causes irritation for the user. So if you are editing colors of your template keep that point on your mind. There are some sites for help in choosing matching colors. For more help, you can visit those.

    B) Adding code or adding missing features

    This is where you will find the use of Bootstrap templates. As most of the shortcodes are already defined by the developer, you need not worry about them. If you want some extra features then you can add those code. For this remember below points.
    Structure of Blogger
    a The structure of the code in most of the Blogger templates will be like the following. There will be two important tags. One is Head and other is Body. All the templates will have CSS part in head section. Others like HTML, JavaScript, jQuery are present in body section on most of the templates (here exclude portfolios and some others). But some templates like example Portfolios use a large part of codes in head section. There will be no issues with that. All you need to know is where xyz code is placed.
    b. Always CSS code will be placed between b:skin tags (i.e.,  <b:skin><![CDATA[  and  ]]></b:skin>  ). So when you are adding any code copy the CSS part and paste it just above the closing b:skin tag i.e., ]]></b:skin>. Along with b:skin you will also see style tags ( i.e., <style type='text/css'> or <style> and </style>). This code mainly used with media queries. Media queries are used to define the structure of your template across different devices. Means structure on Desktop, Mobile (different dimensions), Tablet can be varied with media queries. You need not change this part as it will be taken care of by the developer himself. Last one is b:template-skin tags ( i.e., <b:template-skin><![CDATA[ and ]]></b:template-skin>). This part is used to define body layout of your template and also you need not care or edit this part of the code and only you need to know why it is present. These are the tags that will be used to place CSS in the whole template. Other than this you can use inline CSS which will be discussed further.
    c. Most parts of HTML, JavaScript and jQuery will be present in the body section. This is again divided into blog, sidebar, footer. All of those will be taken care of by the developer and you need not worry. When you want to add external scripts always try to choose closing body tag i.e., place code just above </body> tag.
    d. Do not include large scripts or use heavy javascript. Using so will increase your template load time. So be cautious.
    e. If you have third party URLs like fontawesome etc. place them just above the closing body tag and also use async as a solution to render blocking scripts. Do not use too much inline CSS.

    You need to remember all these while editing a template. For better assistant on some topics like adding Social sharing buttons or adding horizontal social share buttons with hiding feature or adding floating social share buttons check those links. Why I am telling this is they help you reduce no of requests by eliminating third-party scripts and fontawesome is included in all the templates you need worry much about speed unless you are using too many icons. A huge resource for HTML and CSS is  W3Schools  it provides all the required features to a blog.

    5. Making your first Post

    I did not discuss changing settings in Blogger. They will be told or helped with a documentation that will be provided with the downloaded file. Do not worry about settings. I will not discuss about writing a post here. But you can see how you should not write your content. You should also see Why H1 tags have to be used with the title of your post and Hiding or Displaying sections or widgets or changing CSS style in posts, pages and Homepage. If you did not like those you are always free to Search on the Internet. To make your first post first Sign In into Blogger, On the left-hand side, you will see the option Posts. Click on it. From right-hand side choose New Post. You will be provided with the editor to write content. Here you will have Compose and HTML. If you are using plain text and does not HTML then use Compose, if you know little HTML you are highly recommended with HTML option. There will be different options as provided in most of the word editing software, choose them accordingly.

    Now everything is complete except submitting your website to different webmasters. For this look below

    Submitting your site to Webmasters

    This will also be not discussed here as it makes this post lengthy and brings uninterest. So check for help on the Internet. You have webmasters from Google, Bing, Yandex, Baidu. But most of the people use Google. But I recommend you to use Google, Bing, and Yandex. They will help you in any way. Read submitting your Website or Blog to Yandex webmaster. For others use the Internet or read Submit your site to Google's Search Console and Submit your site to Bing webmaster. For more assistant use forums and Communities.

    Important SEO factors to be followed

    b. Use hreflang tags
    c. Use meta tags (already discussed above)

    Tools for better Optimizing your site to Search Engines

    a. Search Console
    b. Pagespeed Insights
    c. Pingdom
    d. Webpagetest
    e. GTmetrix
    f. Dareboost
    All those tools are not required except a, b and d. But they all are helpful in different situations.

    Hosting services for Blogger

    You need not worry about hosting in Blogger as Google will take care of everything about servers and you only need to concentrate on Webpage optimization and content delivery.

    For better Search Results

    Use structured data for better search results and also helps to increase traffic to your site. Read Structured data for Blogger and to test your code whether it is correct or not go to Structured data Testing Tool. I will write a post on this soon. But in the beginning stage, you need not worry about structured data.

    That's it about starting your first blog with Blogger. Feel free to interact and if had any issues either go to forums, communities or can consult me. I believe at least some part of this is helpful to you. Extending this you will soon see some more articles. Check out for those too. If you like this post please share and subscribe to Newsletter, promised no spamming. Thank you and have nice Blogging/reading.
  • No comments:

    Post a Comment