Tags: Beginner's Guide

How to Change your Blogger Domain Name

- No Comments

Ever wondered that if you can change your Blogger Domain Name after creating your blog? If you don't know then let me tell you that the answer is Yes. It is possible to change your Blogger Domain Name after creating a blog. Suppose you've created a blog with myname.blogspot.com this name but after some days or months you wish to change it to technoblog.blogspot.com then what would you do? Download its template, backup its all posts and image, all the widgets, a new blog with your new desired name and a lot of other things. The answer is No. Because Blogger allow you to change the Domain name of your blog. So, if you don't know that How to Change your Blogger Domain Name then don't worry today in this tutorial we'll show you that How to Change your Blogger Domain Name.

How to Change your Blogger Domain Name

First of all, Log in to your Blogger Account. Select a Blog and go to Setting >> Basic and look for Blog Address under the Publishing heading.

Press the Edit Button >> Type your New Desired Domain name and Press the Save button.

Congratulations:
You've successfully changed your Blogger Domain name :-)

From Editors Desk

We hope that this article helped you in learning that How to Change your Blogger Domain Name. Share it with your friends and don't forget to subscribe us.

Tags: Beginner's Guide

How to Add Alt Tag to Images in Blogger

- No Comments

We all know that its important to include at least one image to a blogger post and a great percentage of our blog traffic depends on our images. Adding images, optimizing them in a correct way and making them searchable to search engines is a great challenge. But don't worry blogger all of its features, also provides an option to optimize them easily using Alt Tags.

What is Alt Tag/Image Alt?

An Alt tag is actually a HTML attribute which defines an image. Without an Alt tag search engines have no idea about your image or what that image is. Without an Alt tag your image will not be visible to search engines. Search engines use robots that cannot read an image/video. Therefore, by adding an alt tag we give them ability to understand that image. So, if you want to make your image searchable to search engines then its important to add an Alt tag to your Images.
Okay let's come to the tutorial, today in this tutorials we'll learn that How to Add Alt Tag to Images in Blogger.

How to Add Alt Tag to Images in Blogger

Step 1. Log in to your Blogger Account >> Create a New Post >> Add your Image and Click on the Image
Step 2. You'll see several option below the image

Step 3. Click on Image Properties and type your Title Text and Alt Text in the text area and press the Ok button

Note: The ALT text should be of five to six words
Congratulations: You've successfully learned that How to Add Alt Tag to Images in Blogger.

From Editors Desk

We hope that this article helped you in learning How to Add Alt Tag to Images in Blogger. Share it with your friends and don't forget to subscribe us.

Tags: Beginner's Guide / CSS Tricks

How to Add CSS Borders in Blogger - Complete Guide

- 6 Comments

Today, in this article we are going to discuss about CSS Borders. When it comes to our blog design, we use different techniques and methods to make our blog more beautiful. We use CSS transitions, backgrounds, shadows etc. There are hundreds of techniques that you can use to make your blog more beautiful and one of them is border. Simply, we can say that a border is separating line between two elements/sections. You can use borders for your navigation menus, headings, sidebar headings or whatever you want. If you don't know that How to Add CSS Borders in Blogger, so today in this article we'll learn that How to Add CSS Borders in Blogger.

Simple Border

CSS Code ::

border: 4px solid #000000;

The above code is for adding a simple border. 4px is the width of border and #000000 is the color of border. You can change them according to your own need e.g 1px, 2px, 6px, 8px etc. You can use our color code generators for HTML color codes.

Colorful Sides

Colorful Border

CSS Code ::

border-bottom: 3px solid #000000;
border-top: 3px solid #d33a38;
border-left: 3px solid #2aa4cf;
border-right: 3px solid #00cc00;

This is a border having different colors for its four sides. The first line is for bottom border, 3px and #000000 is the width and color of the bottom border. The second line is for top border, 3px and #d33a38 is the width and color of the top border. The third line is for left border, 3px and #2aa4cf is the width and color of the left border. The fourth line is for right border, 3px and #00cc00 is the width and color of the top border.

Border Radius

Border with Radius

CSS Code ::

border: 4px solid #000000;
border-radius:8px;

This is a border with rounded corners. It is done by adding border radius. In the above code 4px is the width of border, #000000 is the color and 8px is radius of the border. You can change then according to your own need.

Colorful Border with Radius

CSS Code ::

border-bottom: 3px solid #000000;
border-left: 3px solid #2aa4cf;
border-right: 3px solid #00cc00;
border-top: 3px solid #d33a38;
border-radius:8px;

This is a colorful border with radius. The first line is for bottom border, 3px and #000000 is the width and color of the bottom border. The second line is for top border, 3px and #d33a38 is the width and color of the top border. The third line is for left border, 3px and #2aa4cf is the width and color of the left border. The fourth line is for right border, 3px and #00cc00 is the width and color of the top border and 8px in the last line is its radius. You can change all these colors, radius and its width according to your own need.

One Sided Border

Left Side

border-left: 4px solid #000000;

Left sided border. 4px is the width and #000000 is the color of the border.

Right Side

border-left: 4px solid #000000;

Left sided border. 4px is the width and #000000 is the color of the border.

Border Top

border-top: 4px solid #000000;

Top Border. 4px is the width and #000000 is the color of the border.

Border Bottom

border-bottom: 4px solid #000000;

Bottom Border. 4px is the width and #000000 is the color of the border.

Border Styles

Dashed Border

CSS Code ::

border: 4px dashed #000000;

Inset Border

CSS Code ::

border: 4px inset #000000;

Double Border

CSS Code ::

border: 4px double #000000;

You can also use different styles for each side.

border-top-style: dotted;
border-right-style: solid;
border-bottom-style: dotted;
border-left-style: solid;

Border Styles with their Names:

You can use any style that you want.

From Editors Desk

We hope that you've completely learned about adding CSS borders. Got a problem? Let us know in the comments. Share this article with your friends and don't forget to subscribe us.

Tags: Beginner's Guide / Blogging Tips

How to Submit your Sitemap to Google Webmaster Tools

- 4 Comments

Started a New Blogger Blog? Want to rank it better in search results? Without optimization it is not possible? There are hundreds of free SEO tools to optimize your blog. But the best free tool that i prefer is Google Webmaster tools. Google Webmaster tool gives all the information about your appearance in search results. In order to make your blog appear in Google search results it is important to submit your blog's sitemap to Google webmaster tools. What happens on submitting your sitemap to Google? In simple words, submitting your sitemap to Google means to notify Google about your blog posts. On submitting your sitemap to Google, it start sending bots to your blog, and crawling your blog pages thus your blog starts appearing in Google search results. So today we are going to learn that How to Submit your Sitemap to Google Webmaster Tools. Also Read How to Submit your Blog to Google Webmaster Tools

How to Submit your Sitemap to Google Webmaster Tools

Step 1. First of all, you've to Submit your site to Google webmaster tools
Step 2. After step 1 go to Webmaster tools homepage and select your site

Step 3. In the left sidebar click on Crawl and then select Sitemaps

Step 4. Now click on Add/Test Sitemap button and type sitemap.xml in the empty field

Step 5. Click on submit sitemap and refresh the page

From Editors Desk

We hope this article helped you in learning How to Submit your Sitemap to Google Webmaster Tools. Share it with your friends and don't forget to subscribe us!

Tags: Beginner's Guide

Show Post Title Before Blog Title in Search Results

- 3 Comments

In our previous articles we've discussed about appearance of your blog in search results, how to improve your appearance in search results and this article is also one of them. By default blogger shows Blog Title before Posts Title in search results but it is not good for better SEO. When you publish a new post, no one know that what it is really about. Post title describes that what this posts is about. Google shows 66 characters of post title in search results. So, if your blog shows blog title before post title then your post title gets chopped because of characters limit and you have less chances to get your blog listed on top in search results. Which means that showing blog title before post title is not good for SEO. Today in this article we'll learn How to Show Post Title Before Blog Title in Search Results for better SEO.

Show Post Title Before Blog Title in Blogger

Step 1. Log in to Blogger Account
Step 2. Go to Template >> Edit HTML and Search (Ctrl+F) for the following piece of code

<title><data:blog.pageTitle/></title>

Step 3. Now replace the above code with the following code

<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>

Step 4. Hit the Save Template button and you're done.

Search Results Before and After Title Optimization

Before Optimization

After Optimization

From Editors Desk

I hope this article helped you in learning how to Show Post Title Before Blog Title in Blogger. Got a Problem? Leave your comment below. Share this article with your friends and don't forget to Subscribe Us.

Tags: Beginner's Guide

How to Submit your Blogger Blog to Google Webmaster Tools

- No Comments

Started a New Blogger Blog? Want to rank it better in search results? Without optimization it is not possible? There are hundreds of free SEO tools to optimize your blog. But the best free tool that i prefer is Google Webmaster tools. Google Webmaster tool gives all the information about your appearance in search results. It gives all the information about your search appearance, broken links, stats, index results and notifies you in case of any problem. By using Google Webmaster tools you can make your blog's appearance better in search results but first of all you have to Submit your Blogger Blog to Google Webmaster Tools. So today in this article we're going to learn How to Submit your Blogger Blog to Google. Also Read Hoe t Submit your Sitemap to Google Webmaster Tools

How to Submit your Blogger Blog to Google

Step 1. Log in to your Google Webmaster tools account
Step 2. Click on Add a Site button

Step 3. Enter your Blog's URL Address and hit the Continue button
Step 4. Now select a method to verify your Authorship. Simple and easy way for verification is to add a HTML Tag. To verify your Blog with this method click on Alternative Method >> HTML Tag

Step 5. Copy the HTML Tag code and go to Blogger Dashboard >> Template >> Edit HTML

Step 6. Now search for the <head> tag and paste that HTML Tag just after/below it
Step 7. Hit the Save Template button and on the Webmaster Tools page click on Verify Button
And you're done... Enjoy Blogging...

Tags: Beginner's Guide / CSS Tricks

How to Add CSS Codes to Blogger Using Template Designer

- 2 Comments

Planning to customize your blog's look using CSS? But having difficulties adding CSS to your blog? We know that customization of blog is not possible without CSS. So, what to do now? Don't worry, here's a short guide on adding CSS codes to blogger. Some bloggers found it difficult to locate ]]></b:skin> tag for adding CSS codes to blogger. So, today we are going to share a short, simple and easy guide on adding CSS codes to blogger without using the Template HTML Editor.

How to Add CSS Codes to Blogger Using Template Designer

Step 1. Log in to your Blogger Account
Step 2. Select a Blog that you want to Customize
Step 3. Go to Template and click on Customize button

Step 4. Click on Advance and add you CSS Code

Step 5. Finally click on Apply to Blog and you're done!
Note:
When you are adding the CSS Codes then be careful that you have to add the CSS without <style type="text/css"> and </style> tags and adding these may result in an error. On changing the template these CSS Codes will be removed.

Tags: Beginner's Guide

How to Automatically Share your Blog Posts on Google+ in Blogger

- No Comments

Notify your followers that you've published a new post on your blog by sharing your posts on Google Plus. You just have to connect your blogger profile to your Google plus profile and start publishing your posts on Google plus without any additional clicks. Whenever you'll publish a new post on your blog it'll be automatically shared to Google plus. So today in this article we are going to learn that How to Automatically Share your Blog Posts on Google+ in Blogger.

How to Automatically Share your Posts on Google+ in Blogger

Step 1. First of all you to Change Your Blogger Profile to a Google Plus Profile
Step 2. After reverting your Blogger Profile to Google+ Profile select any blog and click on Google+ option from the sidebar menu

Step 3. Check the Automatically share after Posting option and you're done
Now when you will publish a new post on your blog, it'll be automatically shared

From Editors Desk

So, friends you've learned that How to Automatically Share your Blog Posts on Google+ in Blogger. Try this feature of Google+ and save your time. Share this article with your friends and don't forget to subscribe us. Take Care!