Create | Make | Add | Set 404 Error Page In Blogger Blogspot Easily

In this tutorial i will show you how you can easily Add or Create 404 Error Page in your Blog. This error is drop very bad effect on your blog because visitors can not visit your blog or website properly and they left your blog from this page. To setup this page follow my simple tutorial with best tricks. Blogging is one of the best way to introduce yourself that's why keep blogging with full of joy and make you a perfect blogger. For adding this page on your blog i write a small tutorial for you which help to add this amazing thin on your blog homepage.

Create | Make | Add | Set 404 Error Page In Blogger Blogspot Easily 1

What Is 404 Errors:

404 Error then create if some one visit your blog with your blog link and after your link some keywords are written. This is not effect on your blog health for SEO (Search Engine Optimization Ranking) but it effect on blog readers. If you set this then your visitors are not go without visiting your blog properly.

Best Blogger Tips And Tricks For My Blog SEO Instantly 

Add 404 Error Page In Your Search Preferences:

For adding this 404 Error Page follow below tutorial and work according to which i write. By adding this your visitors also report you about your 404 Error using your Contact Us Page. Also you give the home page link in the Error Page by click on this link your visitors come on your blog home page.

Add | Make About Us Page Widget | Gadget On Your Blog Footer Or Sidebar
Customise Blogger Default Template To Make Professional Template
Add | Put | Embed Three Or Four Column Footer Widget/Gadget In Blogger Blogspot

Go to Blogger.com.
Go to Settings.
Go to Search Preferences.
Click on Edit. See below picture/image.

Create | Make | Add | Set 404 Error Page In Blogger Blogspot Easily 2

Now pick/copy the below code and paste in the Custom Page Not Found Box after further customization in your 404 Error page.

<!-- TOB Default Template -->
<div class='TOB-404-box'>
  <p style='line-height: 30px'><strong>
<font color='#ff0000' size='5'>
Oops What Happen!
</font> <font color='#666666'>
My Blog Reader you click a broken link or a page which is removed from this blog now. Please Do any one of the Following.
</font></strong></p>
  <ol style='line-height: 25px'>
    <li><a href='javascript:history.go(-1)'>&#171; Go Back</a> </li>
    <li>Contact Us to Report this problem <a href='http://trickofblogging.blogspot.com/p/blog-page_1262.html'>Click Here</a>&#160;&#160;&#160; (<em>This will help us to serve you even better</em>) </li>
    <li>Go To Homepage by <a href='http://trickofblogging.blogspot.com/'>Click Here</a>
      <br/></li>
  </ol>
  <p>
    <br/>
    <br/>
    <br/></p>
  <p align='center'><font color='#0080ff' style='font-size: 150px'><strong>404</strong></font></p>
  <p>&#160;</p>
  <p align='center'/>
  <p align='center'><font size='5'>Page Not Found</font></p>
</div>

      

Customize the some Features:

Change the Red Highlighted Color Text with your desire text. Oops What Happen.
Change the Orange Highlighted Color Text with your desire text.
Change the Blue Highlighted Color link with your own Contact Us Page link.
Change the Grey Highlighted Color link with your own Blog Homepage Link.
Change the Pink Highlighted Color Text with your own desire words. Page Not Found.



Now your half work is done.
Now Go to Template.
Go to Edit HTML.
In the HTML Body Box.
Press Ctrl+F to find the below code/tag.

]]></b:skin>

Paste this above code in the search box and press enter.
When you find this code.
Copy the below CSS Style sheet Code and paste it below/after this code/tag.

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<style type='text/css'>
.status-msg-wrap {
    font-size: 100%;
    margin: none;
    position: static;
    width: 100%;
}
.status-msg-border {
    display:none
}
.status-msg-body {
    padding: none;
    position: static;
    text-align: inherit;
    width: 100%;
    z-index: auto;
}
.status-msg-wrap a {
    padding: none;
    text-decoration: inherit;
}
.TOB-404-box {
  background:#B27D00;
  width:98%;
  margin:10px 0px;
  padding:20px 10px;
  border:1px solid #ddd;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  box-shadow: 5px 5px 5px #CCCCCC;
}
</style>
</b:if>

Now if you want to change the Background Color of your box then change the #B27D00
Save your Template.
Now you have done all work.
Now if you want to check it is working or not write any keywords after your blog homepage link.

If you want to ask any question about this or about Blogger SEO, Blogger Verification, WordPress, WordPress SEO, Make Money, Blogging Tips, Webmasters Tool Tutorial then just contact us using contact us page and feel free.

Related Articles:

How to Remove 404 Errors in Blogger Blogspot
How I Can Remov Or Fix Broken URL For Google Adsense Crawler
5 Ways How to Make your Blogger Blog Like WordPress Website
How To Make Backlinks To Other Website To Increas Page Rank
Get Google Page Rank With In 1 Month By Simple And Easy Tricks
Add | Put | Embed Three Or Four Column Footer Widget/Gadget In Blogger Blogspot
Add Manually CSS Jqeury Drop Down Menu By Replace/Remove Pages On Blogger
Add Facebook Like Box Widget/Gadget On Blogger By Facebook Developer Plugin

Add | Put HTML Color Code Generator Tool To Your Blogger With Easy Tricks

In this tutorial i will show you how to Embed or Add HTML Color Editor to Blogspot using best blogging tricks. HTML Color Code Picker is one of the best tools to get desire color in Hexa decimal with # this sign. When we choose our desire color code and put where we want then it take the same color which we pick but it is work only with Esteric sign first.

This tool is very effective if you want to make your blog perfect with you color choice and if you have good experience about color picking and good selection matching then you are easily make your blog perfect and better also this tool is very useful when we choose the Google Adsense Ads mixing color and we easily put or change the desire color just click on color and grab the color code and paste it where you want.

Color Code Generator Tool

How To Add Color Code Generator Tools In Your Blogger Blogspot:

If you want also to add this effective tools for easy use of you and your blog visitors then its very simple to add just you grab the code of color generator tools and paste and you tools is ready for working. I give you two code of different two Color Code Generator Tools which you like grab the code and paste according to my tutorial and you feel it so easy.

Hot And Latest Seo Tips For Blogger
How I Make My Blogger Good Looking Best Tricks
Simple | Easy Tutorial For Transfer Blogspot To Website 

Now Let's Start The Tutorial:

When you are ready to add the Widget/Gadget to Blogger Blogspot then copy the two give code below and paste according to follow my tutorial. To make these changes first you sign in your blogger.com account and then start the next tutorial.

Go to Blogger.com.
Go to Posts or Pages. Which you want to choose. There are two method for adding this HTML Encoder Color Code Generator. If you want to do so then see below two tutorial.

Add The HTML Color Code Generator/Picker To Blogger Blogspot:

 

Add HTML Color Code Tool With In Post:

To adding the Color Code Picker In Between Post use the below simple tutorial.

Go to Blogger.com.
Go to Posts.
Write new post which you want to publish.
If you want to add the Color Code Generator in between post then copy the below code First Color
Code Generator Tool or Second Color Code Generator Tool.
When you copy it then go to post page where you are writing you post.
Click HTML Button located on top left side of your post writing page.

Add Put HTML Color Code Generator Tool To Your Blogger With Easy Tricks 2

Now Paste your copy code before <br> tag and your work is done.

You have two choice of Color Code Generator Tool grab the code which you want and paste where you want and feel easy its up to you.

Best Blogger Tips And Tricks For My Blog SEO Instantly
How Easliy/Simple To Manage Page Layout In Blogger Blogspot
Get Google Page Rank With In 1 Month By Simple And Easy Tricks 

Add HTML Color Code Tool In Pages:

For adding the HTML Color Code Generator to Pages then follow the below tutorial.

Go to Blogger.com.
Go to Pages.
Click to New Page Grey Button.
Click on Blank Page (Add text and media). Shown in picture/image below.

                           

Add Put HTML Color Code Generator Tool To Your Blogger With Easy Tricks 3

Click HTML Button top left side of your writing page shown in Middle picture/image.
Paste your code and publish the page.
View blog and check your Color Code Generator is working.
For adding the these two type of widget or Gadget in blog copy your desire code and paste according to the above tutorial.

First Color Code Generator Tools Widget/Gadget Code For Blogger:

<center><object border="0" classid="clsid:D27CDB6E -AE6D-11CF-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" height="480" id="obj1" width="480"> <param name="movie" value="http://www.2createawebsite.com/build/color.swf"><param name="quality" value="High"><embed src="http://www.2createawebsite.com/build/color.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="obj1" width="485" height="485" quality="High"></embed></object></center><p align="right"><a href="http://trickofblogging.blogspot.com/2013/05/add-put-embed-color-code-picker-tool-on-blogger-tricks.html"><small>Grab Widget</small></a></p>

Second Color Code Generator Tools Widget/Gadget Code For Blogger:

<center><object border="0" classid="clsid:D27CDB6E-AE6D-11CF-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" height="480" id="obj1" width="480">            <param name="movie" value="http://www.2createawebsite.com/build/col.swf"><param name="quality" value="High"><embed src="http://www.2createawebsite.com/build/col.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="obj1" width="485" height="485" quality="High"></embed></object>
</center><p align="right"><a href="http://trickofblogging.blogspot.com/2013/05/add-put-embed-color-code-picker-tool-on-blogger-tricks.html"><small>Grab Widget</small></a></p> 

Related Articles:

 

Social Bookmarking Button Add To Blogger
Live Traffic Counter Put In Your Blogger Blogspot
Add A Simple Drop Down Menu To Blogger Blog
How To Add Facebook Page On Blog To Attract More Visitors
How I Can Add Recent Post Moving In Down And Upward Direction
How I Can Use Crawlers And Indexing Tool In Blogger
How I Can Handle New Interface Of Blogger HTML Editor
Easy | Best | Simple Tricks To Make Money From Youtube | Chitika 

Why I Make More Pages On My Blog To Increase Organic Traffic

In this tutorial i show you how to make more pages and why pages are so important to increase website or blogger traffic in search engine and Google ranking. It is very important thing that you get more organic traffic to make better revenue but if you want to do so then you can make some changes to your blog or website. I will show you how to make perfect and more pages to increase your organic traffic. This tutorial is very simple to do so. If you want to make some changes then go with me and learn how better pages can increase your website or blog traffic.

Now Lets start the tutorial Why Pages Are So Important:
When some one search about some thing which they want then only one URL is shown on Google search engine which is not good because there is only one chance to the visitor that they click your website or blog link but if you make more pages then your blog or website show more links on search engine which increase the chance to visit your site first. This thing is so important to blogger.

Make More Pages On Your Blog Or Website To Increase Traffic:
If you have a blog then you simply do the following steps:

Go to Blogger.com.
Go to Pages and click the Pages link.
When you click this link you can see  already one page with Home Tab.
Click the above link written by new pages. When you click you see two option.
Blank Page or Web Address.

There is your choice which one is choose.
If you choose Blank Page then you put some text or images and videos.
If you choose Web Address then you put some link in this page doesn't matter if this is your website link or another website link.
When you make the page choose better words or text to select the page name because this will be the word that's show in the search engine.

Now If you have a Website the you simply do the following steps:

Login In your website.
Go to Add New Page and select your page name that's so simple.
Now you can easily put images or videos on your pages.
This works same as blog. First your home page address is shown in search results and then your website pages.

Related Posts:

SEO Tips How Keyword Take Your Website On Rank
Use Google Better Keywords Search Engine Friendly For Wordpress
How To Increase The Website Ranking From Social Bookmarking Sites
How To Add Facebook Page On Blog To Attract More Visitors
WordPress SEO Tips and Trick You Need