New Release! Free Special Report on Making Money Blogging
Get immediate download. No email subscription required!

Blogger Help Series - Setting Custom Domain name and More

There are a lot to cover on blogger help so I'll be running a series on it.

This article which is the first of the series takes you step by step through setting up a custom domain name, removing Navbar and borders around template, and changing the Google blogger Favicon to a personalized one.

Now that you have created your Google Blogger blog this series help with blogger guides you through on how to give your blog a professional look.

The first thing you need to do is change the amateur URL of your blog. Dress as you want to be addressed!

When people see that URL (http://myblog.blogspot.com) they won't take you seriously. You need a blogger custom domain name (http://www.myblog.com) especially if you intend to use the blog to make money online.

I even bought a custom domain name for our demonstration blog as you'll see in the article link above where I demonstrated how to create a blog on blogger.

So instead of the ugly and very unprofessional URL http://relationship-issues-and-answers.blogspot.com it will be http://www.relationship-issues-and-answers.com

I can't stress enough how important a blogger custom domain name is to your blog.

Apart from giving your blog a professional look, it gives you some level of ownership. People don't just see the URL in search engines and immediately know the site is using a free hosting service.

How to set up Google Blogger Custom Domains

First you need to create and buy a good domain name or have one ready to use as custom domain.

See the article How to choose domain name for help on how to create user and search engine friendly domain names and step by step process of ordering a domain name from Godaddy.

Setting up your Blogger Custom Domain name

After ordering your domain name create a CNAME Record for the domain name.

CNAME is what will be used to associate your custom domain name with your blog.

CNAME which means 'Canonical Name' is an entity within the Domain Name System (DNS) that specifies where a user can find your web pages or any other URL.

Immediately you login into your Godaddy account page, you will see the domain name you have bought. Just below it, click on 'View in Domain Manager'.

Then on the Domain manager page, click on 'Total DNS Control' link at the bottom of the section tagged 'Total DNS'.

When the page displayed, click on 'Add New CNAME Record' in the box labeled as CNAMES (Aliases).

For the name, enter only the sub-domain of the address you want to use for the blog.

For example, if your domain name is www.mydomain.com then enter 'WWW.' as the Alias Name and enter "ghs.google.com" as the Host Name.

Leave "TTL" at the default setting of 1 hour. Click 'OK' and you're done.

Allow for few days, then sign in to your blogger blog account. In your dashboard Click on 'Settings' followed by 'Publishing'.

It pops up a page that asks you to buy a domain name, just click on the "Advanced Settings" by the top right hand side.

When the advanced setting page displays, Click on 'Switch to Custom Domain'.

Then enter the domain name you have bought in the form of "www.relationship-issues-and-answers.com" or "relationship-issues-and-answers.com".

Enter the Word Verification displayed and click on Save Settings.

Now your blogger original address will automatically redirect to your new domain.

Sidenote: The DNS record set up process for the new domain takes at least 24 hours. So my advice is you wait for some few days before attempting to redirect to your new domain.

You should also note that with blogger custom domain, you can not use both version of the URLs http://relationship-issues-and-answers.com and http://www.relationship-issues-and-answers.com , you can only use one.

The one you decide to use, should be the one you enter in the space for your domain name in your dashboard.

If you encounter any problem refer to Google help

How to Remove Blogger Navbar

The blogger navbar in blue is one of the first things you should remove from your blog. Aside the fact that it is annoying, it also takes readers away from your blog.

In your blogger account, click on 'Design' followed by 'Edit HTML' then with CTRL + F find this code : <b:skin><![CDATA[/* in your template.

Just below it is the following code in the grey box. Now copy the code in red below and paste it immediately below the code in the grey box.

-----------------------------------------------
Blogger Template Style
Name:     
Designer: pYzam Team
URL:      www.pyzam.com
----------------------------------------------- */ 

#navbar-iframe { display: none !important; }

See example below how the code in your template should now look.

Preview your blog and the navbar is gone!.

Blogger Help: How to Remove Borders around your Blogger blog Template

I later realized as I said in the article on the Free best Blogger template that blogger default template doesn't have obvious borders.

But If you uploaded a new template it will likely have several borders which could be annoying.

Click on 'Edit HTML' and patiently scroll through from beginning to the end of the code. As you are scrolling, watch out for borders. They usually read 'border: 1px'

Just change all the 1 by the side of px to 0. So it reads as border: 0px. Do this for all the borders you notice and then Save template.

Click 'View blog'. You should now have a clean blog!.

Adding a Favicon to Google Blogger blog

Favicon is the icon of a website that you see once you load the site just by the URL.

Why do you need a Favicon? Two reasons.

First for identity

Second for professionalism.

Both is what this article series on blogger help wants to help you achieve.

Go to tinypic.com . Upload the image you'll have appear instead everytime someone loads your site. The image should be in .gif format.

After uploading the image at tinypic, copy the link by the side of 'Direct Link for Layout'.

Find </head> in your template and immediately above it, paste this code

<link href="http://YOUR_IMAGE_ADDRESS_HERE.gif" rel="shortcut icon" 
type="image/vnd.microsoft.icon"></link>

but changing the

http://YOUR_IMAGE_ADDRESS_HERE.gif

to the direct link you got from tinypic.

Now your blog should display your desired image instead of the blogger Favicon.

Found What You Read Useful? Then I will love to send you more free tips on this topic. Enter your E-mail Enter your Name We respect your email privacy

Like This Page?

+1 This Post