All Stories

Thursday, December 31, 2020

When you upload a template, sometimes you can see posted dates of blog posts showing as "undefined". This is not a error in the template. To fix this problem you need to change "Timestamp Format" of your blog.

Posted Date Undefined Error in Blogger

First go to your blog "Settings" --> "Language and formatting".

Select "Timestamp Format" from drop-down menu similar to "Friday, June 13, 2014" format.

Important: You need to change "Timestamp Format". Not "Comment Timestamp Format".

Timestamp Format in Blogger

Click on "Save settings" button and you are done.

How to Fix Posted Date Undefined Error in Blogger

When you upload a template, sometimes you can see posted dates of blog posts showing as "undefined". This is not a error in the template. To fix this problem you need to change "Timestamp Format" of your blog.

Posted Date Undefined Error in Blogger

First go to your blog "Settings" --> "Language and formatting".

Select "Timestamp Format" from drop-down menu similar to "Friday, June 13, 2014" format.

Important: You need to change "Timestamp Format". Not "Comment Timestamp Format".

Timestamp Format in Blogger

Click on "Save settings" button and you are done.

Posted at December 31, 2020 |  by Online Ustaad

Thursday, December 24, 2020

Are you wondering how to create a Blogger account? Many of us do, because Blogger is one of the most popular blogging platforms out there and it can provide us with an extraordinary, fun way to express ourselves in the online world. Not only is it Blogger a very large blogging website, but it's also full of categories that you can blog on. You have complete control over what you want to blog, and that does make Blogger an amazing platform to begin with. Yet you do have to wonder how to create a blog on Blogger! We are here to help you understand all of that and so much more as fast as possible, thanks to a detailed guide that will showcase all the necessary instructions in a very easy to read manner.

how to create blogger account

Creating a Google account

What you need to know here is that Google owns Blogger, and because of that you will need to use a Google account to sign in to this platform. You can create a Google account now and then you will be able to continue to the platform without a problem. By creating a Google Account you will be able to access a wide range of Google apps and services like Drive or Mail for example. Visit the page above and share all the necessary information in order to create the necessary Google Account. Thankfully, the process is very easy and it will take only a few minutes of your time. In case you already have a Google Account, you will need to sign on the Blogger page.

create a google account

Creating your blog

Once you are located on the Blogger page, you will need to press the New Blog button in order to start a blog. You will receive a new window where you will learn how to create a Blogger account. This will enable you to share all the necessary information.
  • Make sure that you add a title for your blog in the Title area. This is very important because it will allow you to entice the visitor to read more about you and your content. So, try to make the title relevant and appealing
  • In order for users to find your blog, you will need to create an Address for it. Your blog will have a blogspot.com address, but you will need to choose what goes before blogspot.com. Basically, you can opt for something like abcdef.blogspot.com or anything like that. Remember that this can be modified in the long run. The great thing here is that you will immediately be able to see if that address is available or not. This means you will have the ability to check the address availability really fast.
  • The next step will require you to choose from any of the presets that are available at this point. Starting with a Template is a good idea, but do remember that this can be modified afterwards as well. So it's a good idea to just pick a template and move onward.
create a blogger account

Once you have the blog title, address and template ready to go, you will have to press the Create blog! button. This process will take a little bit until it's completed properly, so just wait for a few seconds as the new blog will soon be added to the blog list. So, if you were wondering how to create a blog on Blogger, this is the simplest way to do it.

Maybe the best thing about how to create a Blogger account is that the entire process is very easy to do. Even beginners will have no problem creating and setting up an account. The customization options are plentiful here, so you shouldn't have any problem setting your account really fast!

Although the blog address will be available, you can't call that a blog unless you start writing content in there. Obviously, you will need to learn how to write a post on Blogger, and we are here to help you with that right now.

In order to start writing, you will need to click the Create a new post link or you can press the New Post button. Once you do that, you will gain immediate access to the post editor and here you can write the blog as well as make any necessary changes to content that you already wrote.

create new blogger post

Write a title for your post

Your post needs to have a title. Towards the top of the Blogger editor you will see that there is a Post title box. Add in the desired post title there. This shouldn't eat up a lot of your time, just try to come up with a post title that is enticing, very easy to use and a delight to read for your audience. A catchy title can be great. Don't opt for the clickbait title that you can see nowadays, make your title feel informative and fun to read as that's what you want. If you want to write a first post, you need to make it introductory. Write about the goals you have, the type of content you want to add and so on. It will not be easy to write down the first words, but if you create a good title it will be easier for you to translate thoughts into words!

create blogger post title

Start the writing process

You can create a Blogger post in 2 ways. You can either write the post in HTML or you can use the word processor included here. You have a button located in the top left corner which helps you switch between any of these two writing models. The HTML editor helps you create better web content and you can also use it to insert some special web functions. On the other hand, the word processor is more than qualified to offer you all the extra help you might need here.

blogger post compose html

Customizing text

If you want, you will be able to customize the text you want without a problem. You will have the ability to use the toolbar located on top of the editor to modify the text as you see fit. This includes formatting, color, size, alignment and so on. You have a Normal drop-down that helps you change the type of content you want to add, so you should consider changing between the desired heading type as you see fit. This also changes the way search engines process your content, so keep that in mind.  If possible, try to break the content into easy to read pieces. Use the Headings in a strategic manner.

blogger post heading

Add an image to your post

If you want to make your blog post enticing, you should try to add at least an image. These images make posts a lot easier to read and it's a good idea to make the most out of images if you want to share a great experience for your audience. You will have an "Insert Image" button right above your text editor, on the toolbar. There are multiple options, you can either upload them from your PC/Mac, you can share a link or you can use your webcam to take a picture if you want. However, if you link to other websites, make sure that you showcase their copyright or just refrain from doing that to begin with. There are many sites who do not agree with the idea of having their content stolen, so try to stay away from that!

insert image in Blogger post

Modify the post settings

If you look on the right side of your Post Editor, you will be able to access some Post settings. Remember that these make it easy for you to customize your post right before you choose to publish it!

blogger post settings
  • Labels are useful if you want to group multiple posts which are very similar to one another.
  • Schedule allows you to publish your content at a later date. It can come in handy if you don't want to share multiple articles at the same time.
  • Permalink is an option that allows you to select the way your post will be linked to in the future. Usually it will maintain the title structure, but there are other link types you can choose from as well.
  • Location enables you to add a location tag for your post. It's a very good tool for those that move/travel often
  • Options allows you to modify some features like the user ability to comment on a post for example. You can also choose the way your HTML code is interpreted here as well.

Previewing

A great thing about previewing your post is that you will be able to see how it looks when a reader will access it. This is the right time when you need to check your post for any errors, be it grammar or structural ones.

preview blogger post

Save the post for later

This is not the same as scheduling. When you save the post for later, it means that the post just isn't finished at this time and you will continue to work on it at a later time. You can see this as a draft for your future post.

save blogger post

Publishing the post

If you double or triple checked the post and there are no errors, then you are good to go. Still, it's a good idea to go through it at least one more time to ensure that all the content you want is there and you don't have to make any more changes. Add all the necessary labels and tags, make sure that you inserted any links, images and other information that you might need.

Once everything is ready, you will just have to press the Publish button located at the top of the panel. This is when Blogger will automatically redirect you to the Posts page. Here you will see the post right on top.

publish blogger post


Don't believe that your work is done at this point. In fact, it's far from that. You still have a long way to go before you properly optimize and improve your blog. After all, people won't be drawn in to your blog if you have just a single one to begin with. Work hard to write great posts as they will be able to make your blog stand out in the long haul.

Of course, you do need patience. Writing a good blog does require time and you shouldn't rush the content creation. Prioritize quality over quantity all the time. If you don't do that, the experience will be very well worth it in the end.

How can you expand your blog?

As we mentioned earlier, writing a single post is great but it won't draw in a lot of traffic. If you want to write a good post, one that will bring in lots of readers and views, you want to post as often as possible.

Quality content will always bring in traffic. Update the blog as often as you can. If you can share at least a post per week, you should do that. A good stream of posts will always come in handy, so make sure that you always write some good, enticing content that will help populate your blog.

If possible, we recommend you to create a post Schedule as this will help you better optimize the way you post. This way you will be able to prepare your content beforehand, so you can have it ready when you want to create a new post. The best approach is to write more than 1 post at a time. One can be posted and the others can be kept for a later date if you so desire.

create blogger posts

Write for a niche

Generalized content works but it won't really deliver good results for your audience. If you want to get the best results, we recommend you to find a niche as fast as possible. Not only does a niche help you target specific users, but it will also help you become an authority on that topic. We recommend you to research a niche and become an expert on it. This is the best way to create a large audience for a niche and from here to reaching success in blogging will be just a small step.

Don't rush the content creation process, especially if you write for a niche. Creating redundant content will just keep people away. As long as you take your time and focus on results for your audience, the experience will be an amazing one. Of course, use the proper content structure in order to cater to the needs of search engines, all while maintaining the content relevant for humans as well!

Reader interaction

Once you learn how to create a blog on Blogger you can create more than a blog in order to reach multiple audiences. But the idea here still remains, you will need to interact with the audience. The community will grow more and more as you put out content, so make sure that you always interact with the audience.

Read the comments and moderate them, make sure that you remove spam. Also, reply to people that are interested in what you write. This will help create and nurture a community around your content, which can be very interesting to do!

blogger comments

Advertising your blog

Your blog will need advertising if you want it to grow really fast. One of the best ways you can do that is by sharing it with people anywhere you can. From social networks to social media or any other location, all of these are great places where you can share your blog. We recommend you to try and do the following:
  • Post a short headline and a link to your article on Twitter
  • Single Blogger is a Google Product, make sure that you use the Google buttons in order to share on Google Plus and perform other similar actions.
  • Encourage readers and friends to share your Blogger posts on Facebook and anywhere they can. This will help you reach a large audience really fast.
  • Make sure that you comment on forums and other blogs. Link to your post there if it's meaningful for that particular topic. This type of practice is called backlinking and it's very good for SEO.

Place ads

Ads are very important if you want to monetize the blog. You won't be able to monetize your blog with AdSense unless you have a blog active for around 6 months, so keep that in mind. You also need to have at least 18 years of age and you also have to obey the TOS. AdSense allows you to receive payments based on the amount of impressions generated by your blog.

sign up for AdSense

Blog customization

You can modify just about anything you want on Blogger, it all comes down to you to make the right changes! For example, you will be able to press Layout and then you can modify the block content for each section of your blog. You also have the ability to Add a Gadget if you want. Blogger has lots of add-ons to choose from, all of which can help you better define your blog!

If you want to customize your Template, keep in mind that there are multiple customization options to choose from. You can also keep the template you have now. Programmers can press the Edit HTML button so they can modify the CSS and HTML code.

blogger template edit HTML

Stat tracking

Blogger has a dedicated option named Stats where you have the ability to monitor the blog performance. Here you have the ability to see the amount of views you get. This way you can identify what posts are performing better than others. As a result, you know what content works great for your audience in the longer term!

Learning how to create a Blogger account is really easy and you can feel free to create multiple blogs if you want. Just make sure that you write content for all of them. Plus, you can also monetize each one of your blogs if you so desire. Take your time and make sure that you provide valid information for your readers. This should be the main reason to create a Blogger account in the first place!

How to Create a Blogger Account?

Are you wondering how to create a Blogger account? Many of us do, because Blogger is one of the most popular blogging platforms out there and it can provide us with an extraordinary, fun way to express ourselves in the online world. Not only is it Blogger a very large blogging website, but it's also full of categories that you can blog on. You have complete control over what you want to blog, and that does make Blogger an amazing platform to begin with. Yet you do have to wonder how to create a blog on Blogger! We are here to help you understand all of that and so much more as fast as possible, thanks to a detailed guide that will showcase all the necessary instructions in a very easy to read manner.

how to create blogger account

Creating a Google account

What you need to know here is that Google owns Blogger, and because of that you will need to use a Google account to sign in to this platform. You can create a Google account now and then you will be able to continue to the platform without a problem. By creating a Google Account you will be able to access a wide range of Google apps and services like Drive or Mail for example. Visit the page above and share all the necessary information in order to create the necessary Google Account. Thankfully, the process is very easy and it will take only a few minutes of your time. In case you already have a Google Account, you will need to sign on the Blogger page.

create a google account

Creating your blog

Once you are located on the Blogger page, you will need to press the New Blog button in order to start a blog. You will receive a new window where you will learn how to create a Blogger account. This will enable you to share all the necessary information.
  • Make sure that you add a title for your blog in the Title area. This is very important because it will allow you to entice the visitor to read more about you and your content. So, try to make the title relevant and appealing
  • In order for users to find your blog, you will need to create an Address for it. Your blog will have a blogspot.com address, but you will need to choose what goes before blogspot.com. Basically, you can opt for something like abcdef.blogspot.com or anything like that. Remember that this can be modified in the long run. The great thing here is that you will immediately be able to see if that address is available or not. This means you will have the ability to check the address availability really fast.
  • The next step will require you to choose from any of the presets that are available at this point. Starting with a Template is a good idea, but do remember that this can be modified afterwards as well. So it's a good idea to just pick a template and move onward.
create a blogger account

Once you have the blog title, address and template ready to go, you will have to press the Create blog! button. This process will take a little bit until it's completed properly, so just wait for a few seconds as the new blog will soon be added to the blog list. So, if you were wondering how to create a blog on Blogger, this is the simplest way to do it.

Maybe the best thing about how to create a Blogger account is that the entire process is very easy to do. Even beginners will have no problem creating and setting up an account. The customization options are plentiful here, so you shouldn't have any problem setting your account really fast!

Although the blog address will be available, you can't call that a blog unless you start writing content in there. Obviously, you will need to learn how to write a post on Blogger, and we are here to help you with that right now.

In order to start writing, you will need to click the Create a new post link or you can press the New Post button. Once you do that, you will gain immediate access to the post editor and here you can write the blog as well as make any necessary changes to content that you already wrote.

create new blogger post

Write a title for your post

Your post needs to have a title. Towards the top of the Blogger editor you will see that there is a Post title box. Add in the desired post title there. This shouldn't eat up a lot of your time, just try to come up with a post title that is enticing, very easy to use and a delight to read for your audience. A catchy title can be great. Don't opt for the clickbait title that you can see nowadays, make your title feel informative and fun to read as that's what you want. If you want to write a first post, you need to make it introductory. Write about the goals you have, the type of content you want to add and so on. It will not be easy to write down the first words, but if you create a good title it will be easier for you to translate thoughts into words!

create blogger post title

Start the writing process

You can create a Blogger post in 2 ways. You can either write the post in HTML or you can use the word processor included here. You have a button located in the top left corner which helps you switch between any of these two writing models. The HTML editor helps you create better web content and you can also use it to insert some special web functions. On the other hand, the word processor is more than qualified to offer you all the extra help you might need here.

blogger post compose html

Customizing text

If you want, you will be able to customize the text you want without a problem. You will have the ability to use the toolbar located on top of the editor to modify the text as you see fit. This includes formatting, color, size, alignment and so on. You have a Normal drop-down that helps you change the type of content you want to add, so you should consider changing between the desired heading type as you see fit. This also changes the way search engines process your content, so keep that in mind.  If possible, try to break the content into easy to read pieces. Use the Headings in a strategic manner.

blogger post heading

Add an image to your post

If you want to make your blog post enticing, you should try to add at least an image. These images make posts a lot easier to read and it's a good idea to make the most out of images if you want to share a great experience for your audience. You will have an "Insert Image" button right above your text editor, on the toolbar. There are multiple options, you can either upload them from your PC/Mac, you can share a link or you can use your webcam to take a picture if you want. However, if you link to other websites, make sure that you showcase their copyright or just refrain from doing that to begin with. There are many sites who do not agree with the idea of having their content stolen, so try to stay away from that!

insert image in Blogger post

Modify the post settings

If you look on the right side of your Post Editor, you will be able to access some Post settings. Remember that these make it easy for you to customize your post right before you choose to publish it!

blogger post settings
  • Labels are useful if you want to group multiple posts which are very similar to one another.
  • Schedule allows you to publish your content at a later date. It can come in handy if you don't want to share multiple articles at the same time.
  • Permalink is an option that allows you to select the way your post will be linked to in the future. Usually it will maintain the title structure, but there are other link types you can choose from as well.
  • Location enables you to add a location tag for your post. It's a very good tool for those that move/travel often
  • Options allows you to modify some features like the user ability to comment on a post for example. You can also choose the way your HTML code is interpreted here as well.

Previewing

A great thing about previewing your post is that you will be able to see how it looks when a reader will access it. This is the right time when you need to check your post for any errors, be it grammar or structural ones.

preview blogger post

Save the post for later

This is not the same as scheduling. When you save the post for later, it means that the post just isn't finished at this time and you will continue to work on it at a later time. You can see this as a draft for your future post.

save blogger post

Publishing the post

If you double or triple checked the post and there are no errors, then you are good to go. Still, it's a good idea to go through it at least one more time to ensure that all the content you want is there and you don't have to make any more changes. Add all the necessary labels and tags, make sure that you inserted any links, images and other information that you might need.

Once everything is ready, you will just have to press the Publish button located at the top of the panel. This is when Blogger will automatically redirect you to the Posts page. Here you will see the post right on top.

publish blogger post


Don't believe that your work is done at this point. In fact, it's far from that. You still have a long way to go before you properly optimize and improve your blog. After all, people won't be drawn in to your blog if you have just a single one to begin with. Work hard to write great posts as they will be able to make your blog stand out in the long haul.

Of course, you do need patience. Writing a good blog does require time and you shouldn't rush the content creation. Prioritize quality over quantity all the time. If you don't do that, the experience will be very well worth it in the end.

How can you expand your blog?

As we mentioned earlier, writing a single post is great but it won't draw in a lot of traffic. If you want to write a good post, one that will bring in lots of readers and views, you want to post as often as possible.

Quality content will always bring in traffic. Update the blog as often as you can. If you can share at least a post per week, you should do that. A good stream of posts will always come in handy, so make sure that you always write some good, enticing content that will help populate your blog.

If possible, we recommend you to create a post Schedule as this will help you better optimize the way you post. This way you will be able to prepare your content beforehand, so you can have it ready when you want to create a new post. The best approach is to write more than 1 post at a time. One can be posted and the others can be kept for a later date if you so desire.

create blogger posts

Write for a niche

Generalized content works but it won't really deliver good results for your audience. If you want to get the best results, we recommend you to find a niche as fast as possible. Not only does a niche help you target specific users, but it will also help you become an authority on that topic. We recommend you to research a niche and become an expert on it. This is the best way to create a large audience for a niche and from here to reaching success in blogging will be just a small step.

Don't rush the content creation process, especially if you write for a niche. Creating redundant content will just keep people away. As long as you take your time and focus on results for your audience, the experience will be an amazing one. Of course, use the proper content structure in order to cater to the needs of search engines, all while maintaining the content relevant for humans as well!

Reader interaction

Once you learn how to create a blog on Blogger you can create more than a blog in order to reach multiple audiences. But the idea here still remains, you will need to interact with the audience. The community will grow more and more as you put out content, so make sure that you always interact with the audience.

Read the comments and moderate them, make sure that you remove spam. Also, reply to people that are interested in what you write. This will help create and nurture a community around your content, which can be very interesting to do!

blogger comments

Advertising your blog

Your blog will need advertising if you want it to grow really fast. One of the best ways you can do that is by sharing it with people anywhere you can. From social networks to social media or any other location, all of these are great places where you can share your blog. We recommend you to try and do the following:
  • Post a short headline and a link to your article on Twitter
  • Single Blogger is a Google Product, make sure that you use the Google buttons in order to share on Google Plus and perform other similar actions.
  • Encourage readers and friends to share your Blogger posts on Facebook and anywhere they can. This will help you reach a large audience really fast.
  • Make sure that you comment on forums and other blogs. Link to your post there if it's meaningful for that particular topic. This type of practice is called backlinking and it's very good for SEO.

Place ads

Ads are very important if you want to monetize the blog. You won't be able to monetize your blog with AdSense unless you have a blog active for around 6 months, so keep that in mind. You also need to have at least 18 years of age and you also have to obey the TOS. AdSense allows you to receive payments based on the amount of impressions generated by your blog.

sign up for AdSense

Blog customization

You can modify just about anything you want on Blogger, it all comes down to you to make the right changes! For example, you will be able to press Layout and then you can modify the block content for each section of your blog. You also have the ability to Add a Gadget if you want. Blogger has lots of add-ons to choose from, all of which can help you better define your blog!

If you want to customize your Template, keep in mind that there are multiple customization options to choose from. You can also keep the template you have now. Programmers can press the Edit HTML button so they can modify the CSS and HTML code.

blogger template edit HTML

Stat tracking

Blogger has a dedicated option named Stats where you have the ability to monitor the blog performance. Here you have the ability to see the amount of views you get. This way you can identify what posts are performing better than others. As a result, you know what content works great for your audience in the longer term!

Learning how to create a Blogger account is really easy and you can feel free to create multiple blogs if you want. Just make sure that you write content for all of them. Plus, you can also monetize each one of your blogs if you so desire. Take your time and make sure that you provide valid information for your readers. This should be the main reason to create a Blogger account in the first place!

Posted at December 24, 2020 |  by Online Ustaad

Tuesday, December 22, 2020

In the past, adding a custom contact form for Blogger was quite a complex process, and many bloggers were forced to use third party websites. However, even after Blogger launched its own contact form gadget, it was still considered as highly inadequate. This is because the official gadget would only be implemented on the footer the sidebar. Most bloggers preferred having a separate blogger contact form placed on its own page to make their blogs appear well arranged and more professional as well.

Having a well laid-out Blogger contact form is very important. This is the tool that visitors, companies, and brands can use to contact you and it is simply a must-have feature for every blogger. If you are not comfortable with sharing your main email address directly on your blog, then a custom Blogger contact form offers an effective way in which people can easily reach you.
5 Best Custom Blogger Contact Form Widgets

Why you should use a Blogger Contact Form?

If you are still stuck on third party providers, you should definitely consider switching to the official custom contact form for Blogger since it has various unique benefits, like:
  • Messages are delivered immediately - As the blog administrator, you will receive a message immediately the visitor clicks send.
  • Reliable - It is the official form developed by Blogger, which makes it more trustworthy and reliable way to initiate contact as compared to using third-party services.
  • Questions - The contact form offers a platform for your visitors to ask specific questions that they might have regarding the blog you wrote or your business in general. It can be an excellent way of capturing leads and even lead to conversions if you are selling a certain product or service.
  • Feedback - Visitors can easily comment on your blog by leaving their feedback through your contact form. This feedback can help you determine which post to do next or what areas to address based on the visitors' comments.
  • Information or service request - For those who are using the blog as a way of marketing a product or service, potential clients can use the custom contact form for Blogger to reach out and request additional information.

How to Add Blogger Contact Form Gadget

Before adding a custom Blogger contact form to a static page, we need to add the default contact form in the blog's sidebar to make it functional:

1. Log into your Blogger dashboard and go to "Layout" > click on the "Add a gadget" link on the page elements area.


2. Select "More Gadgets" below the "Basics" tab and click the "+" button to add the Contact Form Gadget.

blogger contact form

Hiding Blogger Contact Form from the Sidebar

Once the contact form has been added, next step is to hide it so that it will appear only in the static page.

1. Go to "Template" and press the "Edit HTML" button. Once the code editor opens, click anywhere inside the code area and press CTRL + F keys (or Command + F for mac) to open the search box.


2. Type or paste the following tag inside the search box and hit Enter to find it:
]]></b:skin>
3. Just above the ]]></b:skin> tag, add this CSS code:
#ContactForm1{display: none !important;}
4. Click the "Save template" button on the upper left side and view your blog. The contact form widget should be gone.

Adding Custom Blogger Contact Form in a Static Page

Finally, now that we enabled the functionality of the contact form, let's add a custom contact form in our Blogger blog...

1. Go to "Pages" and click the "New page" button. If you already have a Contact us page, just click the "Edit" link below the page title.

2. Once the Page editor opens, fill up the page title with Contact/Contact Us or any title you want to show. It is recommended doing this before anything in order to make the permalink SEO friendly.


3. Click on the HTML tab as there we will add the code to make the custom Blogger contact form work. On the right site, change the Page settings to hide ("Don't allow" or "Don't allow, hide existing") the reader comments, then click the "Done" button:

contact static page

4. Below are 5 custom Blogger contact form styles. Pick your favorite and copy the code provided, then paste the code inside the HTML box of your page editor:


Simple Contact Form

custom blogger contact form

<style type="text/css">
.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%;padding:40px 0}.contactf-name,.contactf-email{float:left;width:48.25%}.contactf-name{margin-right:3.5%}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:0 0 20px;padding:10px 15px;font-size:12px;letter-spacing:1px;color:#444;background:#F3F3F3;border:medium none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.contact-form-name,.contact-form-email{height:37px}.contact-form-email-message{height:170px}.contact-form-button-submit,.contact-form-button-submit:hover{width:13%;height:30px;font:normal 12px Arial;letter-spacing:1px;color:#444;display:block;outline:none;margin-bottom:20px;text-align:center;background:#E6E6E6;border:0;cursor:pointer}.contact-form-button-submit:active{outline:none;-webkit-box-shadow:none;box-shadow:none}.contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;height:11px !important;width:11px !important;}
</style>

<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><div class="form"><form name="contact-form"><div class="contactf-name"><input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="NAME" onblur='if (this.value == "") {this.value = "NAME";}' onfocus='if (this.value == "NAME") {this.value = "";}'  /></div><div class="contactf-email"><input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="EMAIL" onblur='if (this.value == "") {this.value = "EMAIL";}' onfocus='if (this.value == "EMAIL") {this.value = "";}'/></div><div style="clear:both"></div><div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5" value="MESSAGE" onblur='if (this.value == "") {this.value = "MESSAGE";}' onfocus='if (this.value == "MESSAGE") {this.value = "";}'></textarea></div><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="SEND" /><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></form></div></div></div>

Contact form with CSS rainbow divider

colorful contact form for Blogger

<style type="text/css">
.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%;padding:0}hr{position:relative;height:.75em;border:0;overflow:hidden;margin:0}hr:before{content:"";display:block;position:absolute;top:0;left:0;height:.75em;width:5.1em;background:#C4DD83;box-shadow:5em 0 0 0 #F4FCC9,10em 0 0 0 #FDCD78,15em 0 0 0 #ED786F,20em 0 0 0 #D99DBF,25em 0 0 0 #C39EDC,30em 0 0 0 #679DE2,35em 0 0 0 #62C2E3,40em 0 0 0 #F4FCC9,45em 0 0 0 #FDCD78,50em 0 0 0 #ED786F,55em 0 0 0 #D99DBF,60em 0 0 0 #C39EDC}.contactf-name,.contactf-email{float:left;width:49.25%}.contactf-name{margin-right:1.5%}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:25px 0 0;padding:10px;font-size:15px;color:#ccc;border-color:#E8E8E8;border-width:2px 2px 4px;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.contact-form-name,.contact-form-email{height:40px}.contact-form-email-message{height:100px}.contact-form-button-submit,.contact-form-button-submit:hover{margin-top:25px;width:100%;height:40px;font-size:15px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,0.25);background:#EE786F;border:0;border-bottom:2px solid #D4685C;outline:none;cursor:pointer;-webkit-box-shadow:inset 0 -2px #D4685C;box-shadow:inset 0 -2px #D4685C}.contact-form-button-submit:active{top:1px;outline:none;-webkit-box-shadow:none;box-shadow:none}.contact-form-cross{border:medium none !important;box-shadow:none !important;padding:0 !important;height:11px !important;width:11px !important;}
</style>
<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><hr><div class="form"><form name="contact-form"><div class="contactf-name"><input class="contact-form-name" id="ContactForm1_contact-form-name" name="Name" size="30" type="text" value="Name" onblur='if (this.value == "") {this.value = "Name";}' onfocus='if (this.value == "Name") {this.value = "";}'/></div><div class="contactf-email"><input class="contact-form-email" id="ContactForm1_contact-form-email" name="E-mail address" size="30" type="text" value="E-mail address" onblur='if (this.value == "") {this.value = "E-mail address";}' onfocus='if (this.value == "E-mail address") {this.value = "";}'/></div><div style="clear:both"></div><div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Type your message here..." rows="5" type="text" value="Type your message here..." onblur='if (this.value == "") {this.value = "Type your message here...";}' onfocus='if (this.value == "Type your message here...") {this.value = "";}'></textarea><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Send Message" /><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></div></form></div></div></div>

Blogger Contact Form with CSS Ribbon

contact form with ribbon

<style type="text/css">
.widget.ContactForm{z-index:1}.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%;padding:25px 0;background:#EBEBE3;-webkit-border-radius:2%;-moz-border-radius:2%;border-radius:2%}.contact-form-widget .form{width:91%;margin:0 auto}.ribbon{font:16px Arial;text-transform:capitalize;text-shadow:0 1px 2px rgba(0,0,0,0.25);position:relative;background:#6B5F53;color:#fff;text-align:center;padding:1em 2em;margin:0 -16px}.ribbon:before,.ribbon:after{content:"";position:absolute;display:block;bottom:-1em;border:1.5em solid #584C40;z-index:-1}.ribbon:before{left:-1.7em;border-right-width:1.2em;border-left-color:transparent}.ribbon:after{right:-1.7em;border-left-width:1.2em;border-right-color:transparent}.ribbon .ribbon-content:before,.ribbon .ribbon-content:after{content:"";position:absolute;display:block;border-style:solid;border-color:#42362A transparent transparent;bottom:-1em}.ribbon .ribbon-content:before{left:0;border-width:1em 0 0 1em}.ribbon .ribbon-content:after{right:0;border-width:1em 1em 0 0}.contactf-name,.contactf-email,.contactf-message{text-align:left;margin-top:25px;color:#a1937b;font-size:13px}.contactf-name,.contactf-email{float:left;width:100%}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:10px 0 0;padding:10px;font-size:12px;color:#aaa;border-color:#DBD6D1;border-width:1px;box-shadow:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.contact-form-name,.contact-form-email{height:35px}.contact-form-email-message{height:100px}.contact-form-button-submit,.contact-form-button-submit:hover{margin-top:25px;width:100%;height:37px;font:normal 12px Arial;outline:none;letter-spacing:1px;color:#fff;text-align:center;cursor:pointer;text-shadow:1px 1px 0 #ffe8b2;color:#7c5d1b;border:1px solid #d6a437;background:#febd4b;background:-webkit-gradient(linear,0 0,0 100%,from(#fed970) to(#febd4b));background:-webkit-linear-gradient(#fed970,#febd4b);background:-moz-linear-gradient(#fed970,#febd4b);background:-ms-linear-gradient(#fed970,#febd4b);background:-o-linear-gradient(#fed970,#febd4b);background:linear-gradient(#fed970,#febd4b);-pie-background:linear-gradient(#fed970,#febd4b)}.contact-form-button-submit:active{color:#7c5d1b;border:1px solid #d6a437;background:#febd4b;background:-webkit-gradient(linear,0 0,0 100%,from(#febd4b) to(#fed970));background:-webkit-linear-gradient(#febd4b,#fed970);background:-moz-linear-gradient(#febd4b,#fed970);background:-ms-linear-gradient(#febd4b,#fed970);background:-o-linear-gradient(#febd4b,#fed970);background:linear-gradient(#febd4b,#fed970);-pie-background:linear-gradient(#febd4b,#fed970)}.contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;height:11px !important;width:11px !important;}
</style>
<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><h2 class="ribbon"><strong class="ribbon-content">Shoot Me an Email</strong></h2><div class="form"><form name="contact-form"><div class="contactf-name">Your name:<input class="contact-form-name" id="ContactForm1_contact-form-name" name="Name" size="30" type="text" value="Name" onblur='if (this.value == "") {this.value = "Name";}' onfocus='if (this.value == "Name") {this.value = "";}'  /></div><div class="contactf-email">E-mail address *:<input class="contact-form-email" id="ContactForm1_contact-form-email" name="E-mail address" size="30" type="text" value="E-mail address" onblur='if (this.value == "") {this.value = "E-mail address";}' onfocus='if (this.value == "E-mail address") {this.value = "";}'/></div><div style="clear:both"></div><div class="contactf-message">Message *:<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Type your message here..." rows="5" value="" placeholder="Type your message here..." value="Type your message here..." onblur='if (this.value == "") {this.value = "Type your message here...";}' onfocus='if (this.value == "Type your message here...") {this.value = "";}'></textarea><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="SEND MESSAGE" /><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></div></form></div></div></div>

Minimal Contact Form

minimal contact form for Blogger

<style type="text/css">
.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%;padding:25px;background:#fff}.contact-title{text-align:center;font:41px fantasy;color:#121212;margin-bottom:25px}.contactf-name,.contactf-email{float:left;width:47%}.contactf-name{margin-right:6%}.name-icon img,.email-icon img{background:transparent!important;border:medium none!important;box-shadow:none!important;padding:11px 0!important;width:16px !important;height:16px !important;}.name-icon,.email-icon{position:absolute;z-index:1}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:0 0 25px;padding:10px 10px 10px 25px;font:bold 16px cursive;text-shadow:0 1px 2px #ddd;color:#121212;background:transparent!important;border-color:#121212;border-width:0 0 2.5px;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.contact-form-name,.contact-form-email{height:40px}.contact-form-email-message,.contact-form-email-message:hover,.contact-form-email-message:focus{padding:10px!important}.contact-form-email-message{height:150px;border-width:2.5px!important}.contact-form-button-submit,.contact-form-button-submit:hover{background:#121212!important;width:30%;height:37px;font:bold 13px "Lucida Grande";letter-spacing:2px;color:#fff;text-align:center;border:medium none;cursor:pointer;display:block;margin:0 auto;outline:none}.contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;width:11px !important;height:11px !important;}
</style>
<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><h2 class="contact-title">Get in touch.</h2><div class="form"><form name="contact-form"><div class="contactf-name"><div class="name-icon"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicBdZI3RKtCeDCK5XpZMrAyFb4-ErXbbys02fJgwlpSM9QffnJjswi1eZH6L2RjIY73vKkXN-OrgUdQsTNQvSP2connHgGWfQ3VR8-TakAXHpCUHt-kT4y2i46cMwboNoHUzEyUimA8cna/s1600/avatar%25281%2529.png" width="16" height="16" /></div><input class="contact-form-name" id="ContactForm1_contact-form-name" name="Name" size="30" type="text" value="Name" onblur='if (this.value == "") {this.value = "Name";}' onfocus='if (this.value == "Name") {this.value = "";}'  /></div><div class="contactf-email"><div class="email-icon"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWrwdewyuEbbCa8X0YnY6AkpMQ5mDdrqHh4fRYopPjWuwDOiXf2k7019DPgDCRB8MoL3V2v-NK5Mn9b9X6DgqaUgSUQKWawAZ-61JEtdueaNUCgOceTItjiRtdkdzqX9ufgLeIwZ8HfKGx/s1600/envelope%25281%2529.png" width="16" height="16" /></div><input class="contact-form-email" id="ContactForm1_contact-form-email" name="E-mail address" size="30" type="text" value="E-mail address" onblur='if (this.value == "") {this.value = "E-mail address";}' onfocus='if (this.value == "E-mail address") {this.value = "";}'/></div><div style="clear:both"></div><div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Type your message here..." rows="5" value="Type your message here..." onblur='if (this.value == "") {this.value = "Type your message here...";}' onfocus='if (this.value == "Type your message here...") {this.value = "";}'></textarea><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="SEND" /><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></div></form></div></div></div>

Contact form with speech bubble



<style type="text/css">
.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%}.contactf-name,.contactf-email{float:left;width:50%}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:0 0 15px;padding:10px;font-size:14px;color:#777;background:#E2DEDB;border:1px solid #CBC7C4;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px}.contact-form-name,.contact-form-email{height:33px}.contact-form-email-message{height:130px}.contactf-message{position:relative}.contactf-message:after,.contactf-message:before{border-bottom:50px solid transparent;border-left:80px solid #E2DEDB;bottom:-32px;content:'';position:absolute;right:50%;margin-right:-100px}.contactf-message:before{border-left:80px solid #CBC7C4;bottom:-34px;right:50.3%;margin-right:-101px}.cbluebutton{margin-top:25px;width:30%;height:35px;float:right;font-size:15px;color:#fff;display:inline-block;text-align:center;background:linear-gradient(to bottom,#339ad9 0%,#224bbc 100%);box-shadow:0 1px 1px rgba(34,75,188,0.5);border:0;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px}.cbluebutton span .contact-form-button-submit{background:linear-gradient(to bottom,#52b1e2 0%,#397fd0 100%);font:bold 16px "Helvetica Neue",sans-serif;height:35px;width:100%;color:#FFF;text-shadow:0 1px 1px #224BBC;display:inline-block;box-shadow:0 1px 1px rgba(255,255,255,0.3) inset;cursor:pointer;outline:none;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px}.contact-form-button-submit:active{top:1px;outline:none;-webkit-box-shadow:none;box-shadow:none}.contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;width:11px !important;height:11px !important;}
</style>
<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><div class="form"><form name="contact-form"><div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Message" rows="5" value="Message" onblur='if (this.value == "") {this.value = "Message";}' onfocus='if (this.value == "Message") {this.value = "";}'></textarea></div><div class="cbluebutton"><span><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Send" /></span></div><div class="contactf-name"><input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="Name" onblur='if (this.value == "") {this.value = "Name";}' onfocus='if (this.value == "Name") {this.value = "";}'  /></div><div class="contactf-email"><input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="E-mail" onblur='if (this.value == "") {this.value = "E-mail";}' onfocus='if (this.value == "E-mail") {this.value = "";}'/></div><div style="clear:both"></div><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></div></form></div></div>

5. After you added the code, click the "Publish" button on the upper right side. Now you should be able to see the Blogger contact form live on your static page. To ensure that everything works fine, you can send a message as a test. The message should be delivered to your inbox in a matter of seconds, just make sure that you're checking the email that you're using with your Blogger account.

Frequently Asked Questions about the Custom Contact Form for Blogger

Where do the messages go?

Once a visitor asks a question or sends feedback through the Blogger contact form, it is instantly delivered to the email associated with your Blogger account. If a blog has several administrators, then all the individual administrators will receive the comments or questions asked by the visitor.

What is the benefit of using a separate "Contact Us" page?

Even though it all comes down to your personal preferences, your blog will look more professional if it has a separate page for the custom contact form for Blogger. It gives you credibility and also offers you the chance to add a specific call to action in the new "Contact Us" page.

Is it possible to add extra fields?

Unfortunately, no. You can't add custom fields such as website, phone number or mailing address since Blogger uses special tags in order to transfer data. In any case, the default fields are well laid-out and will help you to get the basic information you need about your visitors.

I have installed the Blogger contact form, but it is not working. What could be the problem?

There are several reasons why you may be having trouble setting up your contact form. The simplest way to troubleshoot is to countercheck the email you linked to the blog and also reinstall the form again.

Ultimately, by using the custom Blogger contact form you gain from consistency in the type of information you request and also reduce spam since you will not have to display your email directly on the blog.

5 Best Custom Blogger Contact Form Widgets

In the past, adding a custom contact form for Blogger was quite a complex process, and many bloggers were forced to use third party websites. However, even after Blogger launched its own contact form gadget, it was still considered as highly inadequate. This is because the official gadget would only be implemented on the footer the sidebar. Most bloggers preferred having a separate blogger contact form placed on its own page to make their blogs appear well arranged and more professional as well.

Having a well laid-out Blogger contact form is very important. This is the tool that visitors, companies, and brands can use to contact you and it is simply a must-have feature for every blogger. If you are not comfortable with sharing your main email address directly on your blog, then a custom Blogger contact form offers an effective way in which people can easily reach you.
5 Best Custom Blogger Contact Form Widgets

Why you should use a Blogger Contact Form?

If you are still stuck on third party providers, you should definitely consider switching to the official custom contact form for Blogger since it has various unique benefits, like:
  • Messages are delivered immediately - As the blog administrator, you will receive a message immediately the visitor clicks send.
  • Reliable - It is the official form developed by Blogger, which makes it more trustworthy and reliable way to initiate contact as compared to using third-party services.
  • Questions - The contact form offers a platform for your visitors to ask specific questions that they might have regarding the blog you wrote or your business in general. It can be an excellent way of capturing leads and even lead to conversions if you are selling a certain product or service.
  • Feedback - Visitors can easily comment on your blog by leaving their feedback through your contact form. This feedback can help you determine which post to do next or what areas to address based on the visitors' comments.
  • Information or service request - For those who are using the blog as a way of marketing a product or service, potential clients can use the custom contact form for Blogger to reach out and request additional information.

How to Add Blogger Contact Form Gadget

Before adding a custom Blogger contact form to a static page, we need to add the default contact form in the blog's sidebar to make it functional:

1. Log into your Blogger dashboard and go to "Layout" > click on the "Add a gadget" link on the page elements area.


2. Select "More Gadgets" below the "Basics" tab and click the "+" button to add the Contact Form Gadget.

blogger contact form

Hiding Blogger Contact Form from the Sidebar

Once the contact form has been added, next step is to hide it so that it will appear only in the static page.

1. Go to "Template" and press the "Edit HTML" button. Once the code editor opens, click anywhere inside the code area and press CTRL + F keys (or Command + F for mac) to open the search box.


2. Type or paste the following tag inside the search box and hit Enter to find it:
]]></b:skin>
3. Just above the ]]></b:skin> tag, add this CSS code:
#ContactForm1{display: none !important;}
4. Click the "Save template" button on the upper left side and view your blog. The contact form widget should be gone.

Adding Custom Blogger Contact Form in a Static Page

Finally, now that we enabled the functionality of the contact form, let's add a custom contact form in our Blogger blog...

1. Go to "Pages" and click the "New page" button. If you already have a Contact us page, just click the "Edit" link below the page title.

2. Once the Page editor opens, fill up the page title with Contact/Contact Us or any title you want to show. It is recommended doing this before anything in order to make the permalink SEO friendly.


3. Click on the HTML tab as there we will add the code to make the custom Blogger contact form work. On the right site, change the Page settings to hide ("Don't allow" or "Don't allow, hide existing") the reader comments, then click the "Done" button:

contact static page

4. Below are 5 custom Blogger contact form styles. Pick your favorite and copy the code provided, then paste the code inside the HTML box of your page editor:


Simple Contact Form

custom blogger contact form

<style type="text/css">
.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%;padding:40px 0}.contactf-name,.contactf-email{float:left;width:48.25%}.contactf-name{margin-right:3.5%}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:0 0 20px;padding:10px 15px;font-size:12px;letter-spacing:1px;color:#444;background:#F3F3F3;border:medium none;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.contact-form-name,.contact-form-email{height:37px}.contact-form-email-message{height:170px}.contact-form-button-submit,.contact-form-button-submit:hover{width:13%;height:30px;font:normal 12px Arial;letter-spacing:1px;color:#444;display:block;outline:none;margin-bottom:20px;text-align:center;background:#E6E6E6;border:0;cursor:pointer}.contact-form-button-submit:active{outline:none;-webkit-box-shadow:none;box-shadow:none}.contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;height:11px !important;width:11px !important;}
</style>

<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><div class="form"><form name="contact-form"><div class="contactf-name"><input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="NAME" onblur='if (this.value == "") {this.value = "NAME";}' onfocus='if (this.value == "NAME") {this.value = "";}'  /></div><div class="contactf-email"><input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="EMAIL" onblur='if (this.value == "") {this.value = "EMAIL";}' onfocus='if (this.value == "EMAIL") {this.value = "";}'/></div><div style="clear:both"></div><div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5" value="MESSAGE" onblur='if (this.value == "") {this.value = "MESSAGE";}' onfocus='if (this.value == "MESSAGE") {this.value = "";}'></textarea></div><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="SEND" /><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></form></div></div></div>

Contact form with CSS rainbow divider

colorful contact form for Blogger

<style type="text/css">
.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%;padding:0}hr{position:relative;height:.75em;border:0;overflow:hidden;margin:0}hr:before{content:"";display:block;position:absolute;top:0;left:0;height:.75em;width:5.1em;background:#C4DD83;box-shadow:5em 0 0 0 #F4FCC9,10em 0 0 0 #FDCD78,15em 0 0 0 #ED786F,20em 0 0 0 #D99DBF,25em 0 0 0 #C39EDC,30em 0 0 0 #679DE2,35em 0 0 0 #62C2E3,40em 0 0 0 #F4FCC9,45em 0 0 0 #FDCD78,50em 0 0 0 #ED786F,55em 0 0 0 #D99DBF,60em 0 0 0 #C39EDC}.contactf-name,.contactf-email{float:left;width:49.25%}.contactf-name{margin-right:1.5%}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:25px 0 0;padding:10px;font-size:15px;color:#ccc;border-color:#E8E8E8;border-width:2px 2px 4px;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.contact-form-name,.contact-form-email{height:40px}.contact-form-email-message{height:100px}.contact-form-button-submit,.contact-form-button-submit:hover{margin-top:25px;width:100%;height:40px;font-size:15px;color:#fff;text-align:center;text-shadow:0 1px 2px rgba(0,0,0,0.25);background:#EE786F;border:0;border-bottom:2px solid #D4685C;outline:none;cursor:pointer;-webkit-box-shadow:inset 0 -2px #D4685C;box-shadow:inset 0 -2px #D4685C}.contact-form-button-submit:active{top:1px;outline:none;-webkit-box-shadow:none;box-shadow:none}.contact-form-cross{border:medium none !important;box-shadow:none !important;padding:0 !important;height:11px !important;width:11px !important;}
</style>
<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><hr><div class="form"><form name="contact-form"><div class="contactf-name"><input class="contact-form-name" id="ContactForm1_contact-form-name" name="Name" size="30" type="text" value="Name" onblur='if (this.value == "") {this.value = "Name";}' onfocus='if (this.value == "Name") {this.value = "";}'/></div><div class="contactf-email"><input class="contact-form-email" id="ContactForm1_contact-form-email" name="E-mail address" size="30" type="text" value="E-mail address" onblur='if (this.value == "") {this.value = "E-mail address";}' onfocus='if (this.value == "E-mail address") {this.value = "";}'/></div><div style="clear:both"></div><div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Type your message here..." rows="5" type="text" value="Type your message here..." onblur='if (this.value == "") {this.value = "Type your message here...";}' onfocus='if (this.value == "Type your message here...") {this.value = "";}'></textarea><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Send Message" /><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></div></form></div></div></div>

Blogger Contact Form with CSS Ribbon

contact form with ribbon

<style type="text/css">
.widget.ContactForm{z-index:1}.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%;padding:25px 0;background:#EBEBE3;-webkit-border-radius:2%;-moz-border-radius:2%;border-radius:2%}.contact-form-widget .form{width:91%;margin:0 auto}.ribbon{font:16px Arial;text-transform:capitalize;text-shadow:0 1px 2px rgba(0,0,0,0.25);position:relative;background:#6B5F53;color:#fff;text-align:center;padding:1em 2em;margin:0 -16px}.ribbon:before,.ribbon:after{content:"";position:absolute;display:block;bottom:-1em;border:1.5em solid #584C40;z-index:-1}.ribbon:before{left:-1.7em;border-right-width:1.2em;border-left-color:transparent}.ribbon:after{right:-1.7em;border-left-width:1.2em;border-right-color:transparent}.ribbon .ribbon-content:before,.ribbon .ribbon-content:after{content:"";position:absolute;display:block;border-style:solid;border-color:#42362A transparent transparent;bottom:-1em}.ribbon .ribbon-content:before{left:0;border-width:1em 0 0 1em}.ribbon .ribbon-content:after{right:0;border-width:1em 1em 0 0}.contactf-name,.contactf-email,.contactf-message{text-align:left;margin-top:25px;color:#a1937b;font-size:13px}.contactf-name,.contactf-email{float:left;width:100%}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:10px 0 0;padding:10px;font-size:12px;color:#aaa;border-color:#DBD6D1;border-width:1px;box-shadow:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}.contact-form-name,.contact-form-email{height:35px}.contact-form-email-message{height:100px}.contact-form-button-submit,.contact-form-button-submit:hover{margin-top:25px;width:100%;height:37px;font:normal 12px Arial;outline:none;letter-spacing:1px;color:#fff;text-align:center;cursor:pointer;text-shadow:1px 1px 0 #ffe8b2;color:#7c5d1b;border:1px solid #d6a437;background:#febd4b;background:-webkit-gradient(linear,0 0,0 100%,from(#fed970) to(#febd4b));background:-webkit-linear-gradient(#fed970,#febd4b);background:-moz-linear-gradient(#fed970,#febd4b);background:-ms-linear-gradient(#fed970,#febd4b);background:-o-linear-gradient(#fed970,#febd4b);background:linear-gradient(#fed970,#febd4b);-pie-background:linear-gradient(#fed970,#febd4b)}.contact-form-button-submit:active{color:#7c5d1b;border:1px solid #d6a437;background:#febd4b;background:-webkit-gradient(linear,0 0,0 100%,from(#febd4b) to(#fed970));background:-webkit-linear-gradient(#febd4b,#fed970);background:-moz-linear-gradient(#febd4b,#fed970);background:-ms-linear-gradient(#febd4b,#fed970);background:-o-linear-gradient(#febd4b,#fed970);background:linear-gradient(#febd4b,#fed970);-pie-background:linear-gradient(#febd4b,#fed970)}.contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;height:11px !important;width:11px !important;}
</style>
<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><h2 class="ribbon"><strong class="ribbon-content">Shoot Me an Email</strong></h2><div class="form"><form name="contact-form"><div class="contactf-name">Your name:<input class="contact-form-name" id="ContactForm1_contact-form-name" name="Name" size="30" type="text" value="Name" onblur='if (this.value == "") {this.value = "Name";}' onfocus='if (this.value == "Name") {this.value = "";}'  /></div><div class="contactf-email">E-mail address *:<input class="contact-form-email" id="ContactForm1_contact-form-email" name="E-mail address" size="30" type="text" value="E-mail address" onblur='if (this.value == "") {this.value = "E-mail address";}' onfocus='if (this.value == "E-mail address") {this.value = "";}'/></div><div style="clear:both"></div><div class="contactf-message">Message *:<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Type your message here..." rows="5" value="" placeholder="Type your message here..." value="Type your message here..." onblur='if (this.value == "") {this.value = "Type your message here...";}' onfocus='if (this.value == "Type your message here...") {this.value = "";}'></textarea><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="SEND MESSAGE" /><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></div></form></div></div></div>

Minimal Contact Form

minimal contact form for Blogger

<style type="text/css">
.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%;padding:25px;background:#fff}.contact-title{text-align:center;font:41px fantasy;color:#121212;margin-bottom:25px}.contactf-name,.contactf-email{float:left;width:47%}.contactf-name{margin-right:6%}.name-icon img,.email-icon img{background:transparent!important;border:medium none!important;box-shadow:none!important;padding:11px 0!important;width:16px !important;height:16px !important;}.name-icon,.email-icon{position:absolute;z-index:1}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:0 0 25px;padding:10px 10px 10px 25px;font:bold 16px cursive;text-shadow:0 1px 2px #ddd;color:#121212;background:transparent!important;border-color:#121212;border-width:0 0 2.5px;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.contact-form-name,.contact-form-email{height:40px}.contact-form-email-message,.contact-form-email-message:hover,.contact-form-email-message:focus{padding:10px!important}.contact-form-email-message{height:150px;border-width:2.5px!important}.contact-form-button-submit,.contact-form-button-submit:hover{background:#121212!important;width:30%;height:37px;font:bold 13px "Lucida Grande";letter-spacing:2px;color:#fff;text-align:center;border:medium none;cursor:pointer;display:block;margin:0 auto;outline:none}.contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;width:11px !important;height:11px !important;}
</style>
<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><h2 class="contact-title">Get in touch.</h2><div class="form"><form name="contact-form"><div class="contactf-name"><div class="name-icon"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicBdZI3RKtCeDCK5XpZMrAyFb4-ErXbbys02fJgwlpSM9QffnJjswi1eZH6L2RjIY73vKkXN-OrgUdQsTNQvSP2connHgGWfQ3VR8-TakAXHpCUHt-kT4y2i46cMwboNoHUzEyUimA8cna/s1600/avatar%25281%2529.png" width="16" height="16" /></div><input class="contact-form-name" id="ContactForm1_contact-form-name" name="Name" size="30" type="text" value="Name" onblur='if (this.value == "") {this.value = "Name";}' onfocus='if (this.value == "Name") {this.value = "";}'  /></div><div class="contactf-email"><div class="email-icon"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWrwdewyuEbbCa8X0YnY6AkpMQ5mDdrqHh4fRYopPjWuwDOiXf2k7019DPgDCRB8MoL3V2v-NK5Mn9b9X6DgqaUgSUQKWawAZ-61JEtdueaNUCgOceTItjiRtdkdzqX9ufgLeIwZ8HfKGx/s1600/envelope%25281%2529.png" width="16" height="16" /></div><input class="contact-form-email" id="ContactForm1_contact-form-email" name="E-mail address" size="30" type="text" value="E-mail address" onblur='if (this.value == "") {this.value = "E-mail address";}' onfocus='if (this.value == "E-mail address") {this.value = "";}'/></div><div style="clear:both"></div><div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Type your message here..." rows="5" value="Type your message here..." onblur='if (this.value == "") {this.value = "Type your message here...";}' onfocus='if (this.value == "Type your message here...") {this.value = "";}'></textarea><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="SEND" /><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></div></form></div></div></div>

Contact form with speech bubble



<style type="text/css">
.contact-form-widget{margin-left:auto;margin-right:auto;width:600px;max-width:100%}.contactf-name,.contactf-email{float:left;width:50%}.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{width:100%;max-width:100%;margin:0 0 15px;padding:10px;font-size:14px;color:#777;background:#E2DEDB;border:1px solid #CBC7C4;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px}.contact-form-name,.contact-form-email{height:33px}.contact-form-email-message{height:130px}.contactf-message{position:relative}.contactf-message:after,.contactf-message:before{border-bottom:50px solid transparent;border-left:80px solid #E2DEDB;bottom:-32px;content:'';position:absolute;right:50%;margin-right:-100px}.contactf-message:before{border-left:80px solid #CBC7C4;bottom:-34px;right:50.3%;margin-right:-101px}.cbluebutton{margin-top:25px;width:30%;height:35px;float:right;font-size:15px;color:#fff;display:inline-block;text-align:center;background:linear-gradient(to bottom,#339ad9 0%,#224bbc 100%);box-shadow:0 1px 1px rgba(34,75,188,0.5);border:0;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px}.cbluebutton span .contact-form-button-submit{background:linear-gradient(to bottom,#52b1e2 0%,#397fd0 100%);font:bold 16px "Helvetica Neue",sans-serif;height:35px;width:100%;color:#FFF;text-shadow:0 1px 1px #224BBC;display:inline-block;box-shadow:0 1px 1px rgba(255,255,255,0.3) inset;cursor:pointer;outline:none;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px}.contact-form-button-submit:active{top:1px;outline:none;-webkit-box-shadow:none;box-shadow:none}.contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;width:11px !important;height:11px !important;}
</style>
<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><div class="form"><form name="contact-form"><div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Message" rows="5" value="Message" onblur='if (this.value == "") {this.value = "Message";}' onfocus='if (this.value == "Message") {this.value = "";}'></textarea></div><div class="cbluebutton"><span><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Send" /></span></div><div class="contactf-name"><input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="Name" onblur='if (this.value == "") {this.value = "Name";}' onfocus='if (this.value == "Name") {this.value = "";}'  /></div><div class="contactf-email"><input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="E-mail" onblur='if (this.value == "") {this.value = "E-mail";}' onfocus='if (this.value == "E-mail") {this.value = "";}'/></div><div style="clear:both"></div><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></div></form></div></div>

5. After you added the code, click the "Publish" button on the upper right side. Now you should be able to see the Blogger contact form live on your static page. To ensure that everything works fine, you can send a message as a test. The message should be delivered to your inbox in a matter of seconds, just make sure that you're checking the email that you're using with your Blogger account.

Frequently Asked Questions about the Custom Contact Form for Blogger

Where do the messages go?

Once a visitor asks a question or sends feedback through the Blogger contact form, it is instantly delivered to the email associated with your Blogger account. If a blog has several administrators, then all the individual administrators will receive the comments or questions asked by the visitor.

What is the benefit of using a separate "Contact Us" page?

Even though it all comes down to your personal preferences, your blog will look more professional if it has a separate page for the custom contact form for Blogger. It gives you credibility and also offers you the chance to add a specific call to action in the new "Contact Us" page.

Is it possible to add extra fields?

Unfortunately, no. You can't add custom fields such as website, phone number or mailing address since Blogger uses special tags in order to transfer data. In any case, the default fields are well laid-out and will help you to get the basic information you need about your visitors.

I have installed the Blogger contact form, but it is not working. What could be the problem?

There are several reasons why you may be having trouble setting up your contact form. The simplest way to troubleshoot is to countercheck the email you linked to the blog and also reinstall the form again.

Ultimately, by using the custom Blogger contact form you gain from consistency in the type of information you request and also reduce spam since you will not have to display your email directly on the blog.

Posted at December 22, 2020 |  by Online Ustaad
The Alexa Rank in its time may have been pretty important for the SEO, however, these days is already losing its importance due to the changes in the algorithm that Google applies from time to time.

The company displays information about visitors of a website, which in turn, classifies this in a ranking, generating estimated statistics about visitor traffic and links pointing to the website. In a few words, the Alexa Rank does not directly affect SEO, but rather serves as a reference for measuring the traffic type, popularity by country and other metrics.

boost alexa rank
If you would like to enrich or have a good Alexa Rank of your website, here some ways to do it, with short-term results.

alexa rank

5 Ways to Increase the Alexa Rank

Daily Content: Try to publish at least 2 articles per day and within a month you may start to see some changes in the Alexa ranking.

Install Alexa Rank widgets: Besides notifying about the results of your Alexa ranking, they will also provide an estimate of how many backlinks your website has. There are three types of widgets: button with ranking and links, the other one with the ranking only, and finally, a graph with daily records of visits. Traffic Widgets

Alexa Toolbar: From experience, I would recommend installing the Alexa Toolbar, because once we access the website, Alexa will count this visit and thus, we may get better results in the ranking. Besides this, the toolbar will also provide you more information about the backlinks of a web site, popular pages, reviews, and more.

Request a review: To calculate the Alexa ranking of a website, not only the amount of daily and monthly visits will make a site popular, but the number of reviews or opinions made with stars will also play a role in the ranking. Ask your readers to do a review or purchase Alexa opinions about your website.

Number of backlinks: As I said before, the number of visits and reviews about a website used to calculate the Alexa rank, and the total number of quality backlinks, may increase the likelihood of achieving a higher ranking for your website.

How to Increase Alexa Ranking of your Blog

The Alexa Rank in its time may have been pretty important for the SEO, however, these days is already losing its importance due to the changes in the algorithm that Google applies from time to time.

The company displays information about visitors of a website, which in turn, classifies this in a ranking, generating estimated statistics about visitor traffic and links pointing to the website. In a few words, the Alexa Rank does not directly affect SEO, but rather serves as a reference for measuring the traffic type, popularity by country and other metrics.

boost alexa rank
If you would like to enrich or have a good Alexa Rank of your website, here some ways to do it, with short-term results.

alexa rank

5 Ways to Increase the Alexa Rank

Daily Content: Try to publish at least 2 articles per day and within a month you may start to see some changes in the Alexa ranking.

Install Alexa Rank widgets: Besides notifying about the results of your Alexa ranking, they will also provide an estimate of how many backlinks your website has. There are three types of widgets: button with ranking and links, the other one with the ranking only, and finally, a graph with daily records of visits. Traffic Widgets

Alexa Toolbar: From experience, I would recommend installing the Alexa Toolbar, because once we access the website, Alexa will count this visit and thus, we may get better results in the ranking. Besides this, the toolbar will also provide you more information about the backlinks of a web site, popular pages, reviews, and more.

Request a review: To calculate the Alexa ranking of a website, not only the amount of daily and monthly visits will make a site popular, but the number of reviews or opinions made with stars will also play a role in the ranking. Ask your readers to do a review or purchase Alexa opinions about your website.

Number of backlinks: As I said before, the number of visits and reviews about a website used to calculate the Alexa rank, and the total number of quality backlinks, may increase the likelihood of achieving a higher ranking for your website.

Posted at December 22, 2020 |  by Online Ustaad
Many think that Google AdWords is the only tool dedicated and available to perform a study such as a keyword search, but it isn't so, today I refute this idea by collecting some alternatives that, although are not equal to Google AdWords, at least encourage us to make good keyword analysis for the SEO of our website.

alternatives to google adwords

Going back a bit, for those unfamiliar with the main features and tools of Google AdWords, we can find a very simple interface yet complete in every sense.

- AdWords appearance has changed, however there is a chance of returning to the old design;

- allows you to place a phrase or keyword, a web site and use the categories;
- for a better keywords search, you can apply filters such as location, language and add custom fields (competition, local or global monthly searches, CPC, Ad share, etc.);
- displays keyword ideas in columns with the amount of local and global monthly searches and approximate CPC;
- you can download keyword ideas, search results in a format to open with Excel.

Having recalled and refreshed the memory a little with the characteristics of AdWords, now it is time to learn about other options both free and paid.

Google AdWords Alternatives


Bing Webmaster Tools: Bing may not be the tool that we had first thought of, however it wants to provide the best conditions for studying keywords.


After we register, to access the tool, go to Diagnostics & Tools and click on the second option on the list: Keyword Research.

SEMRush: Other freemium alternative that displays a very complete report of a particular keyword or website. However, it has limitations and if you opt for a PRO recurring plan you need to pay a monthly membership from $69.95 per month.

Ubersuggest: This nice and simple online tool searches keywords suggestion as well as potential titles for an article. Personally, I recommend it 100%.

Keyword Eye: If you are looking to perform a keyword research on a particular region, Keyword Eye will be your help. It also has the option of requesting the display of search volume or AdWords competition and a full report of anchor text, keywords and domain.

At first it offers a free plan with limitations and to enjoy all other benefits, we have to pay $9.99 per month.

4 Alternatives to Google AdWords

Many think that Google AdWords is the only tool dedicated and available to perform a study such as a keyword search, but it isn't so, today I refute this idea by collecting some alternatives that, although are not equal to Google AdWords, at least encourage us to make good keyword analysis for the SEO of our website.

alternatives to google adwords

Going back a bit, for those unfamiliar with the main features and tools of Google AdWords, we can find a very simple interface yet complete in every sense.

- AdWords appearance has changed, however there is a chance of returning to the old design;

- allows you to place a phrase or keyword, a web site and use the categories;
- for a better keywords search, you can apply filters such as location, language and add custom fields (competition, local or global monthly searches, CPC, Ad share, etc.);
- displays keyword ideas in columns with the amount of local and global monthly searches and approximate CPC;
- you can download keyword ideas, search results in a format to open with Excel.

Having recalled and refreshed the memory a little with the characteristics of AdWords, now it is time to learn about other options both free and paid.

Google AdWords Alternatives


Bing Webmaster Tools: Bing may not be the tool that we had first thought of, however it wants to provide the best conditions for studying keywords.


After we register, to access the tool, go to Diagnostics & Tools and click on the second option on the list: Keyword Research.

SEMRush: Other freemium alternative that displays a very complete report of a particular keyword or website. However, it has limitations and if you opt for a PRO recurring plan you need to pay a monthly membership from $69.95 per month.

Ubersuggest: This nice and simple online tool searches keywords suggestion as well as potential titles for an article. Personally, I recommend it 100%.

Keyword Eye: If you are looking to perform a keyword research on a particular region, Keyword Eye will be your help. It also has the option of requesting the display of search volume or AdWords competition and a full report of anchor text, keywords and domain.

At first it offers a free plan with limitations and to enjoy all other benefits, we have to pay $9.99 per month.

Posted at December 22, 2020 |  by Online Ustaad
Although many insist that blogs hosted on free servers, such as Blogger, are not ideal for getting your blog well-ranked, the truth is that a blog hosted by Blogger can be really fast and well positioned on the Internet if you are using the right SEO tools.

Now, given the latest updates from Google, the best would be hiring a specialized person. However, if you don't have the resources or you want to learn doing this job alone, you can choose to begin with the natural SEO.

Here are some tips to do natural SEO (Search Engine Optimization).

blogger seo

Natural SEO Techniques for Blogger

Pick a Good Domain

We must try having our keyword included in the domain name, and even if this may sacrifice our branding, we can use the redirection.

Create Value Added Content

Not only rewrite articles, or write like they would be intended for us. When writing our posts, we should consider our target audience, i.e., giving advices, tips, suggestions or guidance on specific topics and aside, use links, anchor text and key phrases.

The topic of the links is important

They should be of quality and while, it's no longer required to place five or ten links within the text of your website, now what truly matters, is to make the link relevant to the context.

Finally, the domain, in value-added content and a right use of the internal and external links, will prove to be useless if we don't try to update our blog constantly.

How often should you update your blog?

You don't have to do this on daily basis, even if this may be ideal as, this way, we could achieve a greater relevance in search engines. But don't forget about your blog either. Let's say, two or three times a week would be enough. What should not happen is updating only three times a week and doing nothing next week.

Keep in mind that search engines happen to pass daily on our blog in order to index our content.

I hope that you find these SEO tips useful and if you would like to receive more tutorials by email, subscribe for free to this blog, check out the facebook page or add the RSS feed.

How to do natural SEO on Blogger

Although many insist that blogs hosted on free servers, such as Blogger, are not ideal for getting your blog well-ranked, the truth is that a blog hosted by Blogger can be really fast and well positioned on the Internet if you are using the right SEO tools.

Now, given the latest updates from Google, the best would be hiring a specialized person. However, if you don't have the resources or you want to learn doing this job alone, you can choose to begin with the natural SEO.

Here are some tips to do natural SEO (Search Engine Optimization).

blogger seo

Natural SEO Techniques for Blogger

Pick a Good Domain

We must try having our keyword included in the domain name, and even if this may sacrifice our branding, we can use the redirection.

Create Value Added Content

Not only rewrite articles, or write like they would be intended for us. When writing our posts, we should consider our target audience, i.e., giving advices, tips, suggestions or guidance on specific topics and aside, use links, anchor text and key phrases.

The topic of the links is important

They should be of quality and while, it's no longer required to place five or ten links within the text of your website, now what truly matters, is to make the link relevant to the context.

Finally, the domain, in value-added content and a right use of the internal and external links, will prove to be useless if we don't try to update our blog constantly.

How often should you update your blog?

You don't have to do this on daily basis, even if this may be ideal as, this way, we could achieve a greater relevance in search engines. But don't forget about your blog either. Let's say, two or three times a week would be enough. What should not happen is updating only three times a week and doing nothing next week.

Keep in mind that search engines happen to pass daily on our blog in order to index our content.

I hope that you find these SEO tips useful and if you would like to receive more tutorials by email, subscribe for free to this blog, check out the facebook page or add the RSS feed.

Posted at December 22, 2020 |  by Online Ustaad
The qualities of a blogger should be attended at all times in order to become someone popular on the internet. A blogger should have plenty of ideas for creative writing, along with a truckload of motivation. The results sought will not come overnight and there's no guarantee that this will be easy.

These are the two things that you need in order to fulfill your dream of running a successful blog: a lot of exclusive content and readers' loyalty. In each case, time is required to develop the success. This is a process and not a short-term event.
qualities of a blogger

Related: How to Write SEO Optimized Blog Posts

Top Qualities To Become a Successful Blogger

Here are three qualities of a blogger who as a site administrator will need to have, if your goal is to manage a successful blog.

Patience

A successful blog is a product of time and effort and for this, you will need patience. As I said before, the results will not appear quickly overnight, so it is important to realize this from the start. If you are constantly trying to develop new and creative ideas for writing on your blog and, at the same time, you are worried whether you will see any results, this will only make things more difficult.

The building of a successful business online is a "long term" effort and you must decide if you accept this challenge or not. This is one the most important qualities of a blogger.

Credibility

Much of the traffic of any successful blog results from its unique content, as well as its credibility. In fact, the quality of what's in the site, will have a direct impact on what will become viral visitors that are coming to your platform. If you will provide quality content, people will talk about your blog, and once they do it, others may come to see what you have. It depends on you to publish useful and accurate information and your readers will do the rest.

Consistency

Maintaining a steady stream of creative writing ideas is vital to be able to constantly update the blog. The frequency of publication to a proper schedule is related to the amount of time you have available and your level of motivation. However, it is recommended to establish a sort of consistency, so that people can schedule their own visits accordingly. Just remember that the more often you write, the more people will visit, so their loyalty will grow faster and their referrals will be extended.

To become a popular blogger, it is important to have a healthy source of creative writing ideas, along with a lot of patience and motivation. Ultimately, it will be up to you, as a site administrator, to provide the three qualities of a blogger that we discussed above, who is searching tirelessly his goal of having a successful blog. In the end, your own motivation and patience will be the glue with which all the elements will be put together so that your dream will come true.

Top three qualities of a successful blogger

The qualities of a blogger should be attended at all times in order to become someone popular on the internet. A blogger should have plenty of ideas for creative writing, along with a truckload of motivation. The results sought will not come overnight and there's no guarantee that this will be easy.

These are the two things that you need in order to fulfill your dream of running a successful blog: a lot of exclusive content and readers' loyalty. In each case, time is required to develop the success. This is a process and not a short-term event.
qualities of a blogger

Related: How to Write SEO Optimized Blog Posts

Top Qualities To Become a Successful Blogger

Here are three qualities of a blogger who as a site administrator will need to have, if your goal is to manage a successful blog.

Patience

A successful blog is a product of time and effort and for this, you will need patience. As I said before, the results will not appear quickly overnight, so it is important to realize this from the start. If you are constantly trying to develop new and creative ideas for writing on your blog and, at the same time, you are worried whether you will see any results, this will only make things more difficult.

The building of a successful business online is a "long term" effort and you must decide if you accept this challenge or not. This is one the most important qualities of a blogger.

Credibility

Much of the traffic of any successful blog results from its unique content, as well as its credibility. In fact, the quality of what's in the site, will have a direct impact on what will become viral visitors that are coming to your platform. If you will provide quality content, people will talk about your blog, and once they do it, others may come to see what you have. It depends on you to publish useful and accurate information and your readers will do the rest.

Consistency

Maintaining a steady stream of creative writing ideas is vital to be able to constantly update the blog. The frequency of publication to a proper schedule is related to the amount of time you have available and your level of motivation. However, it is recommended to establish a sort of consistency, so that people can schedule their own visits accordingly. Just remember that the more often you write, the more people will visit, so their loyalty will grow faster and their referrals will be extended.

To become a popular blogger, it is important to have a healthy source of creative writing ideas, along with a lot of patience and motivation. Ultimately, it will be up to you, as a site administrator, to provide the three qualities of a blogger that we discussed above, who is searching tirelessly his goal of having a successful blog. In the end, your own motivation and patience will be the glue with which all the elements will be put together so that your dream will come true.

Posted at December 22, 2020 |  by Online Ustaad
I'm not an SEO expert and what you will read further is not top secret, but the basic optimization that everyone should apply in order to write SEO optimized blog posts. And with these techniques, effort and a bit of patience, you can occupy the best places in the search results of different search engines.

Obviously, not all cases are the same, neither all blogs are positioned in the same manner, some might have greater competition than others depending on how popular the topic is; therefore, when it comes to web ranking, there's no specific time that applies for all. Having said this, let's get to the point of this post.

Focus on a topic

Whatever the topic of your blog is, when you try to write a seo optimized blog post, focus on a specific topic that has a clear purpose, with no distractions. For example, if you write about "Digital Cameras", then the beginning and ending of your post should be only about it. Don't start talking about digital cameras and end up telling about what you have done last weekend. A reader goes to a page because is looking for a specific information. So, unless it is not a personal blog (where you write about your daily life), do not deviate from the topic.

Define the post title

The post title should be short and to the point, so that you can briefly summarize the content of the post. But you shouldn't abuse this either. Although it has to be concise, don't try to 'save' words which might be keys to the search.

Examples:
A collection of all the cameras that have been released last year on the market
The best digital cameras of 2013
Clearly, the first one hasn't been defined very much, and the second one is not only more accurate, but it is also more relevant for what people are searching on the internet.

The keywords

Keywords are those terms that the most people are searching for on the internet and you should try focusing on them when writing a post; these keywords need to be included throughout the entire post, but be careful to not overstuff your content with them.

Related: How to Choose the Right SEO Keywords

Example:
During the fourth week of the technology, there were many products that are used today, and the most famous experts gave a speech on them.
At the opening of the fourth Technology Week, the experts talked about various topics, including how to choose a digital camera, had discussions about the pros and cons of the iPad, and which are the best smartphones.
In the first example, we have written without paying attention to any terms. While, in the second one, we used phrases that are searched on the internet by the most users.


So, the most popular keywords should be included wisely without cluttering your posts with them, or it can be counterproductive.

Again, these keywords should be included in the posts title, as well.

Rely on synonyms

While it is a good strategy to use specific keywords, we should not limit ourselves to a single word. It is recommended using synonyms because users do not name things in same way and using less keywords, we can avoid leaving the impression that we are being too repetitive and insistent.

Examples:
For those who enjoy good quality pictures, Nikon D7000s Digital Camera is a 16.2 megapixel digital camera that takes great pictures.
For those who enjoy good quality images, Nikon D7000s is a 16.2 megapixel digital camera that takes excellent pictures.
In the first example, we have repeated the word 'digital camera' and 'pictures' twice. While, in the second one, we used the digital camera keyword once and changed the word 'pictures' with 'images'.

This way, the reader will find a greater diversity of words and might enjoy the article more.

Using bold and italics

A good practice when you write seo optimized blog posts would be to make the keywords bold by wrapping them in strong tags, so that they will stand out from the rest. But keep in mind that this shouldn't be done with CSS, but with HTML, i.e. they should not be tagged with font-weight: bold; but rather with <b> or even better, with <strong>.

Examples:
For those who enjoy good quality images, Nikon D7000s is a 16.2 megapixel digital camera that takes excellent pictures.
The result seems to be the same, but it is not. Although these three keywords are in bold, only one is more attractive to robots, which is the first:

For those who enjoy <strong>good quality images</strong>, <b>Nikon D7000s</b> is a 16.2 megapixel <span style="font-weight: bold;">digital camera</span> that takes excellent pictures.
The same goes for the italics. Use them for highlighting important words, but don't place them between font-style: italic; but rather between <i> or even better <em>.
For those who enjoy <strong>good quality images</strong>, <em>Nikon D7000s</em> is a 16.2 megapixel <span style="font-style: italic;">digital camera</span> that takes excellent pictures.
Again, the first one has a better chance of ranking than the others. Thus, it is recommended to highlight the keywords in bold and italics, or to put them between <strong> and </strong>, or between <em> and </em>.

Using External Links

Some may say that we shouldn't use links in the posts because we are giving away our Page Rank. This is not quite true. Using referral links to sites that have already shaped their credibility, will also help us to shape our own. Certainly, we should not flood our posts with links, but we can do it when is needed and especially with sites that talk about the same topics as our own.

Another important thing to mention is that, we should avoid putting the typical "click here" or similar texts. When you put a link, the anchor text should be fairly descriptive.

Examples:
<a href="Link URL">Click here</a> to know more
More information about <a href="Link URL">digital cameras</a>
In the first example, the anchor text is not relevant and descriptive, but in the second it is.

Rank with your images

Posts with images are not only visually appealing, but might help the reader to understand what you are talking about. So, whenever you can, use an image in your post to illustrate the writing, but don't overdo it. Many images or very large images can slow the loading time of the blog.

Related: How to Optimize Images for Better SEO Rankings

New and relevant content

You should focus not only on writing many posts, but also making them relevant to your readers. New and original content is more attractive to the search engines, than a copy & paste (actually, the last gets penalized). So try to write new stuff, even if you think that all has been said. Each person has a different way of saying things.

Also, always get informed before writing a post. Do a research and see if the information is valid; based on that, you will gain the trust of your readers.

Final Words


With these few techniques you can increase the chances of ranking your posts higher in search engines. As I mentioned earlier, these aren't things that no one heard about, but I know that many are beginners and may not know how to write seo optimized blog posts.

It does not hurt repeating that the results won't appear overnight, but with some effort and patience, you should see the desired results over time.

How to Write SEO Optimized Blog Posts

I'm not an SEO expert and what you will read further is not top secret, but the basic optimization that everyone should apply in order to write SEO optimized blog posts. And with these techniques, effort and a bit of patience, you can occupy the best places in the search results of different search engines.

Obviously, not all cases are the same, neither all blogs are positioned in the same manner, some might have greater competition than others depending on how popular the topic is; therefore, when it comes to web ranking, there's no specific time that applies for all. Having said this, let's get to the point of this post.

Focus on a topic

Whatever the topic of your blog is, when you try to write a seo optimized blog post, focus on a specific topic that has a clear purpose, with no distractions. For example, if you write about "Digital Cameras", then the beginning and ending of your post should be only about it. Don't start talking about digital cameras and end up telling about what you have done last weekend. A reader goes to a page because is looking for a specific information. So, unless it is not a personal blog (where you write about your daily life), do not deviate from the topic.

Define the post title

The post title should be short and to the point, so that you can briefly summarize the content of the post. But you shouldn't abuse this either. Although it has to be concise, don't try to 'save' words which might be keys to the search.

Examples:
A collection of all the cameras that have been released last year on the market
The best digital cameras of 2013
Clearly, the first one hasn't been defined very much, and the second one is not only more accurate, but it is also more relevant for what people are searching on the internet.

The keywords

Keywords are those terms that the most people are searching for on the internet and you should try focusing on them when writing a post; these keywords need to be included throughout the entire post, but be careful to not overstuff your content with them.

Related: How to Choose the Right SEO Keywords

Example:
During the fourth week of the technology, there were many products that are used today, and the most famous experts gave a speech on them.
At the opening of the fourth Technology Week, the experts talked about various topics, including how to choose a digital camera, had discussions about the pros and cons of the iPad, and which are the best smartphones.
In the first example, we have written without paying attention to any terms. While, in the second one, we used phrases that are searched on the internet by the most users.


So, the most popular keywords should be included wisely without cluttering your posts with them, or it can be counterproductive.

Again, these keywords should be included in the posts title, as well.

Rely on synonyms

While it is a good strategy to use specific keywords, we should not limit ourselves to a single word. It is recommended using synonyms because users do not name things in same way and using less keywords, we can avoid leaving the impression that we are being too repetitive and insistent.

Examples:
For those who enjoy good quality pictures, Nikon D7000s Digital Camera is a 16.2 megapixel digital camera that takes great pictures.
For those who enjoy good quality images, Nikon D7000s is a 16.2 megapixel digital camera that takes excellent pictures.
In the first example, we have repeated the word 'digital camera' and 'pictures' twice. While, in the second one, we used the digital camera keyword once and changed the word 'pictures' with 'images'.

This way, the reader will find a greater diversity of words and might enjoy the article more.

Using bold and italics

A good practice when you write seo optimized blog posts would be to make the keywords bold by wrapping them in strong tags, so that they will stand out from the rest. But keep in mind that this shouldn't be done with CSS, but with HTML, i.e. they should not be tagged with font-weight: bold; but rather with <b> or even better, with <strong>.

Examples:
For those who enjoy good quality images, Nikon D7000s is a 16.2 megapixel digital camera that takes excellent pictures.
The result seems to be the same, but it is not. Although these three keywords are in bold, only one is more attractive to robots, which is the first:

For those who enjoy <strong>good quality images</strong>, <b>Nikon D7000s</b> is a 16.2 megapixel <span style="font-weight: bold;">digital camera</span> that takes excellent pictures.
The same goes for the italics. Use them for highlighting important words, but don't place them between font-style: italic; but rather between <i> or even better <em>.
For those who enjoy <strong>good quality images</strong>, <em>Nikon D7000s</em> is a 16.2 megapixel <span style="font-style: italic;">digital camera</span> that takes excellent pictures.
Again, the first one has a better chance of ranking than the others. Thus, it is recommended to highlight the keywords in bold and italics, or to put them between <strong> and </strong>, or between <em> and </em>.

Using External Links

Some may say that we shouldn't use links in the posts because we are giving away our Page Rank. This is not quite true. Using referral links to sites that have already shaped their credibility, will also help us to shape our own. Certainly, we should not flood our posts with links, but we can do it when is needed and especially with sites that talk about the same topics as our own.

Another important thing to mention is that, we should avoid putting the typical "click here" or similar texts. When you put a link, the anchor text should be fairly descriptive.

Examples:
<a href="Link URL">Click here</a> to know more
More information about <a href="Link URL">digital cameras</a>
In the first example, the anchor text is not relevant and descriptive, but in the second it is.

Rank with your images

Posts with images are not only visually appealing, but might help the reader to understand what you are talking about. So, whenever you can, use an image in your post to illustrate the writing, but don't overdo it. Many images or very large images can slow the loading time of the blog.

Related: How to Optimize Images for Better SEO Rankings

New and relevant content

You should focus not only on writing many posts, but also making them relevant to your readers. New and original content is more attractive to the search engines, than a copy & paste (actually, the last gets penalized). So try to write new stuff, even if you think that all has been said. Each person has a different way of saying things.

Also, always get informed before writing a post. Do a research and see if the information is valid; based on that, you will gain the trust of your readers.

Final Words


With these few techniques you can increase the chances of ranking your posts higher in search engines. As I mentioned earlier, these aren't things that no one heard about, but I know that many are beginners and may not know how to write seo optimized blog posts.

It does not hurt repeating that the results won't appear overnight, but with some effort and patience, you should see the desired results over time.

Posted at December 22, 2020 |  by Online Ustaad
© 2013 OU Free Video Tutorials. All rights reserved
back to top