1 2 3 4
Latest Products
Showing posts with label Other issues. Show all posts
Showing posts with label Other issues. Show all posts

Ways To Create Widget Subscribe For Blogger

Ways To Create Widget Subscribe For Blogger
   When you go to a blogger you often see the widget. To follow track the blog post which we enter into the e-mail address to confirm when new posts, blog posts will automatically sent to your registered email address. 
Today technewonline.com will guide you how to create this widget.
view demo.

To do this, you take the following actions: 
Step 1: blogger login. 
Step 2: Layout of your >> add gadgets >> select HTML / Javascript and paste the code below into.

<style type='text/css'>
.social a{color: #6e6e6e;font: bold 12px Calibri,Helvetica, Arial, sans-serif;text-decoration: none;padding: 3px 5px 2px;position: relative;display: inline-block;text-shadow: 0 1px 0 #fff;-webkit-transition: border-color .218s;-moz-transition: border .218s;-o-transition: border-color .218s;transition: border-color .218s; background: #f3f3f3;border: solid 1px #dcdcdc;}
.social a:hover {color: #333;border-color: #999;-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2);-webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);}
.social a:active{color:#000;border-color: #444;}
.sub-box{width:300px;background:();padding: 2px 5px 7px 2px;font-family:Droid Sans,Helvetica,Arial;}
.emailform{margin:16px 0 0; display:block; clear:both;}
.emailtext{margin:10px 0 0;background:#f6f6f6 url(http://3.bp.blogspot.com/-3nqMfDFqsUQ/T4_x8t_XbaI/AAAAAAAAAok/oVXZ6X2RKsg/s1600/email.png) no-repeat scroll 4px center;padding:6px 5px 6px 34px;color:#444;font-weight:bold; text-decoration:none;border:1px solid #ccc;width:175px;}
.emailtext:hover{background: #f3f3f3 url(http://3.bp.blogspot.com/-3nqMfDFqsUQ/T4_x8t_XbaI/AAAAAAAAAok/oVXZ6X2RKsg/s1600/email.png) no-repeat scroll 4px center;border-color:#999;}
.emailtext:focus{outline:none;}
.sub-button{color:#eee;font-weight:bold; text-decoration:none;padding:5px 10px; border:1px solid #666;cursor:pointer;background:#999}
.sub-button:hover{color:#444;border-color: #999;background:#ccc}
</style>
<center><div class="social" style="padding: 0pt 0pt 0pt 5px;">
<table><tbody><tr><td>
<a href='http://feedburner.google.com/fb/a/mailverify?uri=TechnewOnline' rel="nofollow"target='_blank'><img alt='newsletters' src="http://2.bp.blogspot.com/-T6Jwvl78yt4/T6aQRn6CDmI/AAAAAAAABCU/vmj_BCGOv2U/s1600/mail.png" border="0" title='newsletters'/></a> </td>
<td> <a href='http://feeds.feedburner.com/Technewonline' target='_blank'><img alt='rss' src="http://2.bp.blogspot.com/-BkgRd2NvFT8/T6aQSYJiQnI/AAAAAAAABCg/IPE8JvSisT4/s1600/rss.png" border="0" title='rss'/></a> </td>
<td> <a href='https://twitter.com/Technewonline' target='_blank'><img alt='twitter' src="http://2.bp.blogspot.com/-wDhM0i4yvb8/T6aQTdIRmSI/AAAAAAAABCo/CS61MLJ8QRo/s1600/twitter.png"  border="0" title='twitter'/></a> </td>
<td> <a href='https://www.facebook.com/technewonline' target='_blank'><img alt='facebook' src="http://1.bp.blogspot.com/-RvQpmf-y4PE/T6aQQqqjT2I/AAAAAAAABCQ/jEECzsdedY8/s1600/facebook.png"  border="0" title='facebook'/></a> </td>
<td> <a href='http://www.youtube.com/' target='_blank'><img alt=' youtube' src="http://1.bp.blogspot.com/-Lpu7KBe9Q2c/T6aQUbuQWBI/AAAAAAAABCw/bsKGA1q_WeQ/s1600/youtube.png"  border="0" title='youtube'/></a>
</td>
</tr></tbody></table> </div></center>
<center>
<div class='sub-box'>
<div style="text-align: left; display: inline-block;">
<h8 style="display:block;font-family:'calibri';font-size:15px;font-weight:bold;">Subscribe via RSS Feed</h8>
<small><i>If you enjoyed this article just <a href='http://feeds.feedburner.com/TechnewOnline' rel="nofollow" target='_blank' title='feedburner'>
<b>click here</b></a>, or subscribe to receive more great content just like it.</i></small>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=TechnewOnline', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="Technewonline" name="uri"/>
<input type="hidden" name="loc" value="fr_FR" />
<input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Enter your email..." name="email" class="emailtext" />
<input type="submit" class="sub-button" value="Enter" title='' alt='' />
</form></div></div></center>

Note: replace the address facebook, twitter, youtube, feeds.feedburner of technewonline in the red line become of your address.

The feedburner please register at the corresponding address. 
http://feedburner.google.com/fb/a/mailverify?uri=TechnewOnline. 
I wish you success.

Ways To Create Widget Subscribe For Blogger
   When you go to a blogger you often see the widget. To follow track the blog post which we enter into the e-mail address to confirm when new posts, blog posts will automatically sent to your registered email address. 
Today technewonline.com will guide you how to create this widget.
view demo.

To do this, you take the following actions: 
Step 1: blogger login. 
Step 2: Layout of your >> add gadgets >> select HTML / Javascript and paste the code below into.

<style type='text/css'>
.social a{color: #6e6e6e;font: bold 12px Calibri,Helvetica, Arial, sans-serif;text-decoration: none;padding: 3px 5px 2px;position: relative;display: inline-block;text-shadow: 0 1px 0 #fff;-webkit-transition: border-color .218s;-moz-transition: border .218s;-o-transition: border-color .218s;transition: border-color .218s; background: #f3f3f3;border: solid 1px #dcdcdc;}
.social a:hover {color: #333;border-color: #999;-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2);-webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);}
.social a:active{color:#000;border-color: #444;}
.sub-box{width:300px;background:();padding: 2px 5px 7px 2px;font-family:Droid Sans,Helvetica,Arial;}
.emailform{margin:16px 0 0; display:block; clear:both;}
.emailtext{margin:10px 0 0;background:#f6f6f6 url(http://3.bp.blogspot.com/-3nqMfDFqsUQ/T4_x8t_XbaI/AAAAAAAAAok/oVXZ6X2RKsg/s1600/email.png) no-repeat scroll 4px center;padding:6px 5px 6px 34px;color:#444;font-weight:bold; text-decoration:none;border:1px solid #ccc;width:175px;}
.emailtext:hover{background: #f3f3f3 url(http://3.bp.blogspot.com/-3nqMfDFqsUQ/T4_x8t_XbaI/AAAAAAAAAok/oVXZ6X2RKsg/s1600/email.png) no-repeat scroll 4px center;border-color:#999;}
.emailtext:focus{outline:none;}
.sub-button{color:#eee;font-weight:bold; text-decoration:none;padding:5px 10px; border:1px solid #666;cursor:pointer;background:#999}
.sub-button:hover{color:#444;border-color: #999;background:#ccc}
</style>
<center><div class="social" style="padding: 0pt 0pt 0pt 5px;">
<table><tbody><tr><td>
<a href='http://feedburner.google.com/fb/a/mailverify?uri=TechnewOnline' rel="nofollow"target='_blank'><img alt='newsletters' src="http://2.bp.blogspot.com/-T6Jwvl78yt4/T6aQRn6CDmI/AAAAAAAABCU/vmj_BCGOv2U/s1600/mail.png" border="0" title='newsletters'/></a> </td>
<td> <a href='http://feeds.feedburner.com/Technewonline' target='_blank'><img alt='rss' src="http://2.bp.blogspot.com/-BkgRd2NvFT8/T6aQSYJiQnI/AAAAAAAABCg/IPE8JvSisT4/s1600/rss.png" border="0" title='rss'/></a> </td>
<td> <a href='https://twitter.com/Technewonline' target='_blank'><img alt='twitter' src="http://2.bp.blogspot.com/-wDhM0i4yvb8/T6aQTdIRmSI/AAAAAAAABCo/CS61MLJ8QRo/s1600/twitter.png"  border="0" title='twitter'/></a> </td>
<td> <a href='https://www.facebook.com/technewonline' target='_blank'><img alt='facebook' src="http://1.bp.blogspot.com/-RvQpmf-y4PE/T6aQQqqjT2I/AAAAAAAABCQ/jEECzsdedY8/s1600/facebook.png"  border="0" title='facebook'/></a> </td>
<td> <a href='http://www.youtube.com/' target='_blank'><img alt=' youtube' src="http://1.bp.blogspot.com/-Lpu7KBe9Q2c/T6aQUbuQWBI/AAAAAAAABCw/bsKGA1q_WeQ/s1600/youtube.png"  border="0" title='youtube'/></a>
</td>
</tr></tbody></table> </div></center>
<center>
<div class='sub-box'>
<div style="text-align: left; display: inline-block;">
<h8 style="display:block;font-family:'calibri';font-size:15px;font-weight:bold;">Subscribe via RSS Feed</h8>
<small><i>If you enjoyed this article just <a href='http://feeds.feedburner.com/TechnewOnline' rel="nofollow" target='_blank' title='feedburner'>
<b>click here</b></a>, or subscribe to receive more great content just like it.</i></small>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=TechnewOnline', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="hidden" value="Technewonline" name="uri"/>
<input type="hidden" name="loc" value="fr_FR" />
<input type="text" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" value="Enter your email..." name="email" class="emailtext" />
<input type="submit" class="sub-button" value="Enter" title='' alt='' />
</form></div></div></center>

Note: replace the address facebook, twitter, youtube, feeds.feedburner of technewonline in the red line become of your address.

The feedburner please register at the corresponding address. 
http://feedburner.google.com/fb/a/mailverify?uri=TechnewOnline. 
I wish you success.

Detail

Create Banner Beautiful For Blogger

Create Banner Beautiful For Blogger
Create Banner Beautiful For Blogger
   To get a good ad, I believe all of you are interested in blog design are keen to get this. Banner will help save land and create attention by beautiful effect. Today new tech online will show you a very nice piece of banner without affecting the loading speed of the website. You can see a demo outside technewonline.com homepage.
To create banner ads on the homepage as technewonline.com please follow these steps:

Steps 1:  On Design >> add a widget the HTML / javacript
Steps 2: 
Inserted in the code below:

<div id="divAdRight" style="DISPLAY: none; POSITION: absolute; TOP: 0px"> 
<a href="#"><img src="http://4.bp.blogspot.com/-fbJfYnFBGsw/UqV2U5SXC2I/AAAAAAAAByI/OopMod2f-0w/s640/cell-phone.jpg" width="125" /></a> 
</div> 
<div id="divAdLeft" style="DISPLAY: none; POSITION: absolute; TOP: 0px"> 
<a href="#"><img src="http://1.bp.blogspot.com/-sxYB6UIBKAk/UqV2UMA-FbI/AAAAAAAAByA/_Zb3zxg0OA4/s640/Laptop-hot.jpg" width="125" /></a> 
</div> 
<script> 
function FloatTopDiv() 

startLX = ((document.body.clientWidth -MainContentW)/2)-LeftBannerW-LeftAdjust , startLY = TopAdjust+80; 
startRX = ((document.body.clientWidth -MainContentW)/2)+MainContentW+RightAdjust , startRY = TopAdjust+80; 
var d = document; 
function ml(id) 

var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id]; 
el.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';}; 
el.x = startRX; 
el.y = startRY; 
return el; 

function m2(id) 

var e2=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id]; 
e2.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';}; 
e2.x = startLX; 
e2.y = startLY; 
return e2; 

window.stayTopLeft=function() 

if (document.documentElement && document.documentElement.scrollTop) 
var pY = document.documentElement.scrollTop; 
else if (document.body) 
var pY = document.body.scrollTop; 
if (document.body.scrollTop > 30){startLY = 3;startRY = 3;} else {startLY = TopAdjust;startRY = TopAdjust;}; 
ftlObj.y += (pY+startRY-ftlObj.y)/16; 
ftlObj.sP(ftlObj.x, ftlObj.y); 
ftlObj2.y += (pY+startLY-ftlObj2.y)/16; 
ftlObj2.sP(ftlObj2.x, ftlObj2.y); 
setTimeout("stayTopLeft()", 1); 

ftlObj = ml("divAdRight"); 
//stayTopLeft(); 
ftlObj2 = m2("divAdLeft"); 
stayTopLeft(); 

function ShowAdDiv() 

var objAdDivRight = document.getElementById("divAdRight"); 
var objAdDivLeft = document.getElementById("divAdLeft"); 
if (document.body.clientWidth < 1000

objAdDivRight.style.display = "none"; 
objAdDivLeft.style.display = "none"; 

else 

objAdDivRight.style.display = "block"; 
objAdDivLeft.style.display = "block"; 
FloatTopDiv(); 


</script> 
<script> 
document.write("<script type='text/javascript' language='javascript'>MainContentW = 1000;LeftBannerW = 125;RightBannerW = 125;LeftAdjust = 5;RightAdjust = 5;TopAdjust = 10;ShowAdDiv();window.onresize=ShowAdDiv;;<\/script>"); 
</script>

In the code above:

<a href="#"> : when readers links to click on. Replace # with your link to the appropriate page
<img src="…"/> : banner you want to display you can manually design a banner for your desired just use photoshop software to edit a little collage is going to be a banner like that.
width = " 125 " : the width of the banner. There are two values ​​are marked with red
MainContentW = 1000: Web page width. There are two values ​​are marked with a green
LeftAdjust = 5 : the distance from the left edge to the site banner
RightAdjust = 5: to cover the distance from the site to banner
TopAdjust = 10 : distance from the edge of the banner on the site

Note: Due to utility values ​​used to determine the location of the banner adjustment compared with the site, so the aesthetics of utility will depend on the resolution of the computer screen.

Steps 3 : Save and Done.


I wish you success.

Create Banner Beautiful For Blogger
Create Banner Beautiful For Blogger
   To get a good ad, I believe all of you are interested in blog design are keen to get this. Banner will help save land and create attention by beautiful effect. Today new tech online will show you a very nice piece of banner without affecting the loading speed of the website. You can see a demo outside technewonline.com homepage.
To create banner ads on the homepage as technewonline.com please follow these steps:

Steps 1:  On Design >> add a widget the HTML / javacript
Steps 2: 
Inserted in the code below:

<div id="divAdRight" style="DISPLAY: none; POSITION: absolute; TOP: 0px"> 
<a href="#"><img src="http://4.bp.blogspot.com/-fbJfYnFBGsw/UqV2U5SXC2I/AAAAAAAAByI/OopMod2f-0w/s640/cell-phone.jpg" width="125" /></a> 
</div> 
<div id="divAdLeft" style="DISPLAY: none; POSITION: absolute; TOP: 0px"> 
<a href="#"><img src="http://1.bp.blogspot.com/-sxYB6UIBKAk/UqV2UMA-FbI/AAAAAAAAByA/_Zb3zxg0OA4/s640/Laptop-hot.jpg" width="125" /></a> 
</div> 
<script> 
function FloatTopDiv() 

startLX = ((document.body.clientWidth -MainContentW)/2)-LeftBannerW-LeftAdjust , startLY = TopAdjust+80; 
startRX = ((document.body.clientWidth -MainContentW)/2)+MainContentW+RightAdjust , startRY = TopAdjust+80; 
var d = document; 
function ml(id) 

var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id]; 
el.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';}; 
el.x = startRX; 
el.y = startRY; 
return el; 

function m2(id) 

var e2=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id]; 
e2.sP=function(x,y){this.style.left=x + 'px';this.style.top=y + 'px';}; 
e2.x = startLX; 
e2.y = startLY; 
return e2; 

window.stayTopLeft=function() 

if (document.documentElement && document.documentElement.scrollTop) 
var pY = document.documentElement.scrollTop; 
else if (document.body) 
var pY = document.body.scrollTop; 
if (document.body.scrollTop > 30){startLY = 3;startRY = 3;} else {startLY = TopAdjust;startRY = TopAdjust;}; 
ftlObj.y += (pY+startRY-ftlObj.y)/16; 
ftlObj.sP(ftlObj.x, ftlObj.y); 
ftlObj2.y += (pY+startLY-ftlObj2.y)/16; 
ftlObj2.sP(ftlObj2.x, ftlObj2.y); 
setTimeout("stayTopLeft()", 1); 

ftlObj = ml("divAdRight"); 
//stayTopLeft(); 
ftlObj2 = m2("divAdLeft"); 
stayTopLeft(); 

function ShowAdDiv() 

var objAdDivRight = document.getElementById("divAdRight"); 
var objAdDivLeft = document.getElementById("divAdLeft"); 
if (document.body.clientWidth < 1000

objAdDivRight.style.display = "none"; 
objAdDivLeft.style.display = "none"; 

else 

objAdDivRight.style.display = "block"; 
objAdDivLeft.style.display = "block"; 
FloatTopDiv(); 


</script> 
<script> 
document.write("<script type='text/javascript' language='javascript'>MainContentW = 1000;LeftBannerW = 125;RightBannerW = 125;LeftAdjust = 5;RightAdjust = 5;TopAdjust = 10;ShowAdDiv();window.onresize=ShowAdDiv;;<\/script>"); 
</script>

In the code above:

<a href="#"> : when readers links to click on. Replace # with your link to the appropriate page
<img src="…"/> : banner you want to display you can manually design a banner for your desired just use photoshop software to edit a little collage is going to be a banner like that.
width = " 125 " : the width of the banner. There are two values ​​are marked with red
MainContentW = 1000: Web page width. There are two values ​​are marked with a green
LeftAdjust = 5 : the distance from the left edge to the site banner
RightAdjust = 5: to cover the distance from the site to banner
TopAdjust = 10 : distance from the edge of the banner on the site

Note: Due to utility values ​​used to determine the location of the banner adjustment compared with the site, so the aesthetics of utility will depend on the resolution of the computer screen.

Steps 3 : Save and Done.


I wish you success.

Detail

Ways To Migrate From Blogger To WordPress

Ways To Migrate From Blogger to WordPress

     As you all know blogger is a child of the google  platform blog is convenient for brand promotion especially unlimited free hosting
Are you using Blogger platform and now wanted to shift from Blogger to WordPress ? If the answer is YES, then you have come to a right place. Also you might have heard somewhere that migration can cause some decline in traffic and SEO (SERPS – search engine rankings) benefits, but  this will not happen if you follow this procedure.
So carefully follow the steps one by one given below.

Note:  In blogger platform there is one advantage where you will not have the headache of buying or maintaining hosting. But the disadvantage part if it is that your FILES AND CONTENT WILL NOT BE IN YOUR CONTROL … and also in terms of security and protection from website hacking is concerned blogger is best because it is a Google’s product.

Still I prefer WordPress because of its vast features, any kind of customization possible and most importantly SEO wise this is the best and EASY.
Before starting this you must know that there are 2 kinds of people in blogger!

1st category : People who are with normal blog – for example –http://www.xyz.com

2nd category : Others who are still in blogger platform and a custom domain added to it.

So there are few extra things that the 2nd category should remember in order to make sure that settings should go perfectly as directed.

Also for the 2nd category people they should keep in mind whether their site is having WWW or NO WWW in their site URL. Because when you install the WordPress in your server make sure that they remain same.

1) Things You Need To Have Before You Start This Migration.

  First and foremost thing you should have your own custom domain, if not you have to buy a domain from any domain registrar (my favorite is namecheap.com). Now you have to buy server depending on your traffic and needs (I prefer hostgator.com).

Also my tutorial will use the screen shots of hostgator.com and note that even other servers will have almost the same thing so try to learn the basics and reason behind every step that you follow.

2) Now, As You Have Your Own Custom Domain.  

   You can install wordpress into your server by logging into your server’s cPanel. After installation you need to login into your WordPress where you will see the "TOOLS" option in the left column and click the "import" option.

   You will now see the list of services from which you can migrate to WordPress. Select "blogger" (as we are dealing with it now) and install the plugin which imports posts and comments from blogger to WordPress and then activate plugin and run importer. Now click on button "import" until the button changes to "set authors".
Ways To Migrate From Blogger to WordPress 1

Ways To Migrate From Blogger to WordPress 2

Ways To Migrate From Blogger to WordPress 3

NOTE: by clicking the option “import” you are shifting all the posts from the blogger to wordpress. And also note that, in this procedure the images will not be shifted and this is one of the biggest draw backs of blogger to wordpress migration and there is no alternative for this.

So images have to be added to the server manually one by one and that is why bloggers who are having wallpaper, design, art, images and photography related blogs (or blogs that are getting maximum traffic from Google image search) – you should be aware that image traffic can decrease if you again upload the images to your new server considering the SEO disadvantage so make a decision whether to continue this procedure before you complete this.

3) If You Have Multiple Authors On Blog Of Your Blogger .

    you can add those authors by clicking add users.
Ways To Migrate From Blogger to WordPress 4

Now fill in the details of authors and click on add user as shown below.

Ways To Migrate From Blogger to WordPress 5

4) How To Fix Permalinks For Imported Posts.

   Now in order to fix the Permalinks for Imported Posts which is very important to make sure that the "slugs" are same and URLs are not changed. This procedure will help you to edit the slugs easily and effectively. So for this you need to copy the code below in a notepad and save it as fix.php and upload this fix.php file in your file manager via hosting cPanel.


<?php
require_once(‘wp-load.php’);
$res = $wpdb->get_results(“SELECT post_id, meta_value FROM $wpdb->postmeta WHERE meta_key = ‘blogger_permalink’”);
$wpdb->print_error();
foreach ($res as $row){
$slug = explode(“/”,$row->meta_value);
$slug = explode(“.”,$slug[3]);
$wpdb->query(“UPDATE $wpdb->posts SET post_name =’” . $slug[0] . “‘ WHERE ID = $row->post_id”);
$wpdb->print_error();
}
echo “DONE”;
?>
Ways To Migrate From Blogger to WordPress 6
5) Next Copy The Code .htaccess And Upload .htaccess File In File Manager

  This .htaccess file is used to transfer all your feeds and feed users into your feedburner (who are following your site).
 Ways To Migrate From Blogger to WordPress 7
 See below  for .htaccess code:

#ATOM Feeds
RewriteRule atom.xml feed/atom/ [L,R=301]
RewriteRule feeds/posts/default feed/atom/ [L,R=301]
#RSS FEEDS
RewriteRule feeds/posts/default?alt=rss feed/ [L,R=301]
RewriteRule rss.xml feed/ [L,R=301]
#Comments Feed
RewriteRule /feeds/comments/default comments/feed/ [L,R=301]
RewriteRule /feeds/comments/default?alt=rss comments/feed/ [L,R=301]y

6)  Beware Of The Permalink Settings In Wordpress Settings.

  Now you need to change your permalink structure by going into WordPress ->settings -> permalink settings and make sure that .html extension should be present at the end of the URL because the blogger platform use.
Ways To Migrate From Blogger to WordPress 8
7) For -  Category 1 People.

   They should add the name servers in the concerned domain registrar and if you dont know how to add them just take the help of the domain registrar support system and they will surely help you. Please note: For people in the category 2 who have linked the custom domain already to blogger, they should also change the settings back to your concerned name servers.

8) BLOGGER TO WORDPRESS Redirection Plugin.

It is very very important to make sure that the old blogger URLs should now get redirected to the new urls – of your custom domain ….

For example:

   For category 1 people : your urls will be redirected from your old –http://www.xyz.blogspot.com to http://www.xyz.com

For category 2 people : As all your previous URLs are already having custom domain in them, you now just make sure that the basic blogger site (to the one for which you added the custom domain) URLs should get redirected to the present URLs.

Plugin details -  "Blogger to WordPress" Redirection Plugin by rtcamp.
For the above things to happen you need to Follow the basic steps by watching the video below !

9) Don’t Forget To Switch Back To Your Blogspot Default Domain In The Blogger Settings.

Ways To Migrate From Blogger to WordPress 9
See the below image if you have any doubts.

10) Finally Make Your Blogger Blog Unsarchable in the Google or any other search engines.

   If you dont follow this there are 100 % chances that your old blogspot URLs will get again indexed in Google along with your new custom domain URLs and this situation can hamper your site SEO rankings by sending a wrong signals Google bot in the name of "duplicate content".
Ways To Migrate From Blogger to WordPress 10

Most Common Redirection Problems that occur during this Blogger to WordPress Migration.

1. People who are migrating to hostgator server may get an error – for example the URL may get redirected from (http://example.com/2011/01/abc-123-xyz.html to http://example.com/?b2w=http://example.blogspot.com/2011/01/abc-123-xyz.html), so to avoid this you need to contact the Hostgator support system and show your error and ask them to "To release the security rule for connecting remote sites".

2. There is another very irritating error that you might notice in the mobile browser where the URLs may get the extensions like http://www.example.com/?m=1, the reason for this is that the blogger is designed in such a way that all the URLs in the mobile version are redirected to another URL with extension "?m=1" to make it suitable for mobile browser.
For this error the only solution (at present) is to copy all the urls in the sites and add the extension "?m=1" to each and every URL and install the "Simple 301 redirects" plugin by Scott Nellé. See the image below for further understanding.

Ways To Migrate From Blogger to WordPress 11
Hope you have got an idea on how to migrate from blogger to WordPress. 

Wish You Success.
Ways To Migrate From Blogger to WordPress

     As you all know blogger is a child of the google  platform blog is convenient for brand promotion especially unlimited free hosting
Are you using Blogger platform and now wanted to shift from Blogger to WordPress ? If the answer is YES, then you have come to a right place. Also you might have heard somewhere that migration can cause some decline in traffic and SEO (SERPS – search engine rankings) benefits, but  this will not happen if you follow this procedure.
So carefully follow the steps one by one given below.

Note:  In blogger platform there is one advantage where you will not have the headache of buying or maintaining hosting. But the disadvantage part if it is that your FILES AND CONTENT WILL NOT BE IN YOUR CONTROL … and also in terms of security and protection from website hacking is concerned blogger is best because it is a Google’s product.

Still I prefer WordPress because of its vast features, any kind of customization possible and most importantly SEO wise this is the best and EASY.
Before starting this you must know that there are 2 kinds of people in blogger!

1st category : People who are with normal blog – for example –http://www.xyz.com

2nd category : Others who are still in blogger platform and a custom domain added to it.

So there are few extra things that the 2nd category should remember in order to make sure that settings should go perfectly as directed.

Also for the 2nd category people they should keep in mind whether their site is having WWW or NO WWW in their site URL. Because when you install the WordPress in your server make sure that they remain same.

1) Things You Need To Have Before You Start This Migration.

  First and foremost thing you should have your own custom domain, if not you have to buy a domain from any domain registrar (my favorite is namecheap.com). Now you have to buy server depending on your traffic and needs (I prefer hostgator.com).

Also my tutorial will use the screen shots of hostgator.com and note that even other servers will have almost the same thing so try to learn the basics and reason behind every step that you follow.

2) Now, As You Have Your Own Custom Domain.  

   You can install wordpress into your server by logging into your server’s cPanel. After installation you need to login into your WordPress where you will see the "TOOLS" option in the left column and click the "import" option.

   You will now see the list of services from which you can migrate to WordPress. Select "blogger" (as we are dealing with it now) and install the plugin which imports posts and comments from blogger to WordPress and then activate plugin and run importer. Now click on button "import" until the button changes to "set authors".
Ways To Migrate From Blogger to WordPress 1

Ways To Migrate From Blogger to WordPress 2

Ways To Migrate From Blogger to WordPress 3

NOTE: by clicking the option “import” you are shifting all the posts from the blogger to wordpress. And also note that, in this procedure the images will not be shifted and this is one of the biggest draw backs of blogger to wordpress migration and there is no alternative for this.

So images have to be added to the server manually one by one and that is why bloggers who are having wallpaper, design, art, images and photography related blogs (or blogs that are getting maximum traffic from Google image search) – you should be aware that image traffic can decrease if you again upload the images to your new server considering the SEO disadvantage so make a decision whether to continue this procedure before you complete this.

3) If You Have Multiple Authors On Blog Of Your Blogger .

    you can add those authors by clicking add users.
Ways To Migrate From Blogger to WordPress 4

Now fill in the details of authors and click on add user as shown below.

Ways To Migrate From Blogger to WordPress 5

4) How To Fix Permalinks For Imported Posts.

   Now in order to fix the Permalinks for Imported Posts which is very important to make sure that the "slugs" are same and URLs are not changed. This procedure will help you to edit the slugs easily and effectively. So for this you need to copy the code below in a notepad and save it as fix.php and upload this fix.php file in your file manager via hosting cPanel.


<?php
require_once(‘wp-load.php’);
$res = $wpdb->get_results(“SELECT post_id, meta_value FROM $wpdb->postmeta WHERE meta_key = ‘blogger_permalink’”);
$wpdb->print_error();
foreach ($res as $row){
$slug = explode(“/”,$row->meta_value);
$slug = explode(“.”,$slug[3]);
$wpdb->query(“UPDATE $wpdb->posts SET post_name =’” . $slug[0] . “‘ WHERE ID = $row->post_id”);
$wpdb->print_error();
}
echo “DONE”;
?>
Ways To Migrate From Blogger to WordPress 6
5) Next Copy The Code .htaccess And Upload .htaccess File In File Manager

  This .htaccess file is used to transfer all your feeds and feed users into your feedburner (who are following your site).
 Ways To Migrate From Blogger to WordPress 7
 See below  for .htaccess code:

#ATOM Feeds
RewriteRule atom.xml feed/atom/ [L,R=301]
RewriteRule feeds/posts/default feed/atom/ [L,R=301]
#RSS FEEDS
RewriteRule feeds/posts/default?alt=rss feed/ [L,R=301]
RewriteRule rss.xml feed/ [L,R=301]
#Comments Feed
RewriteRule /feeds/comments/default comments/feed/ [L,R=301]
RewriteRule /feeds/comments/default?alt=rss comments/feed/ [L,R=301]y

6)  Beware Of The Permalink Settings In Wordpress Settings.

  Now you need to change your permalink structure by going into WordPress ->settings -> permalink settings and make sure that .html extension should be present at the end of the URL because the blogger platform use.
Ways To Migrate From Blogger to WordPress 8
7) For -  Category 1 People.

   They should add the name servers in the concerned domain registrar and if you dont know how to add them just take the help of the domain registrar support system and they will surely help you. Please note: For people in the category 2 who have linked the custom domain already to blogger, they should also change the settings back to your concerned name servers.

8) BLOGGER TO WORDPRESS Redirection Plugin.

It is very very important to make sure that the old blogger URLs should now get redirected to the new urls – of your custom domain ….

For example:

   For category 1 people : your urls will be redirected from your old –http://www.xyz.blogspot.com to http://www.xyz.com

For category 2 people : As all your previous URLs are already having custom domain in them, you now just make sure that the basic blogger site (to the one for which you added the custom domain) URLs should get redirected to the present URLs.

Plugin details -  "Blogger to WordPress" Redirection Plugin by rtcamp.
For the above things to happen you need to Follow the basic steps by watching the video below !

9) Don’t Forget To Switch Back To Your Blogspot Default Domain In The Blogger Settings.

Ways To Migrate From Blogger to WordPress 9
See the below image if you have any doubts.

10) Finally Make Your Blogger Blog Unsarchable in the Google or any other search engines.

   If you dont follow this there are 100 % chances that your old blogspot URLs will get again indexed in Google along with your new custom domain URLs and this situation can hamper your site SEO rankings by sending a wrong signals Google bot in the name of "duplicate content".
Ways To Migrate From Blogger to WordPress 10

Most Common Redirection Problems that occur during this Blogger to WordPress Migration.

1. People who are migrating to hostgator server may get an error – for example the URL may get redirected from (http://example.com/2011/01/abc-123-xyz.html to http://example.com/?b2w=http://example.blogspot.com/2011/01/abc-123-xyz.html), so to avoid this you need to contact the Hostgator support system and show your error and ask them to "To release the security rule for connecting remote sites".

2. There is another very irritating error that you might notice in the mobile browser where the URLs may get the extensions like http://www.example.com/?m=1, the reason for this is that the blogger is designed in such a way that all the URLs in the mobile version are redirected to another URL with extension "?m=1" to make it suitable for mobile browser.
For this error the only solution (at present) is to copy all the urls in the sites and add the extension "?m=1" to each and every URL and install the "Simple 301 redirects" plugin by Scott Nellé. See the image below for further understanding.

Ways To Migrate From Blogger to WordPress 11
Hope you have got an idea on how to migrate from blogger to WordPress. 

Wish You Success.
Detail

Guidance Create A Forum For Blogger

Guidance Create A Forum For Blogger
   In some websites you often see them create forums for many different purposes such as learning to share information, exchange, increased traffic ... in blogger you can totally have a similar forum . On Blogger , you are not allowed to create a subdomain or folder to a new design that could be a forum . So if you want a forum site on Blogger , you need a certain tips . And this topic will help you do that.

1 . After logging in Blogger , you need to create a static page (static page ). In Design >> Posting >> Edit Pages >> New Page and create a forum titled. Remember page links  forum  look like this:

http://yourblogname.blogspot.com/p/forum.html .

2 . You Create a free forum in Nabble
Guidance Create A Forum For Blogger 1
  You fill out personal information on the registration form , the most important is the email address and password . Nabble will enable confirmation email to the email address you registered. Sign into your email account , mail box ( may be in spam box ) and click the confirmation link to activate your account Nabble . You need to remember the password.

In the process of creating an account , you need to put a name to your forum , such as : My Blogger Forum for example. After you have registered and activated successfully, you log in to your account and select Nabble Embedding Options. Copy the HTML code.

3 . At Blogger account:  to Design >> Edit HTML and select " Expand Widget Templates ".

Press the key combination Ctrl + F and find the line of code:

class='story_text'> id='content-wrapper'>

Paste the following code into the code line above.

<b:if cond='data:blog.url == "http://yourblogname.blogspot.com/p/forum.html"'>
the code from Nabble have get step 2
< / b : if>

4 . Next step is to mark some of the components on your blog page displaying forum . Paste the following code after the line ]]></b:skin>.

<b:if cond='data:blog.url == "http://yourblogname.blogspot.com/p/forum.html"'>
<style type='text/css'>
# content - wrapper {
display: none ! important;
}
< / style>
< / b : if>

  Save Template is finished. Now you can take the time to invite friends to join your forum already.
Note: If you want to create a forum Independent on Blogger , you have to create a new blog . Then go to edit the template , delete the entire section code between 2 tab <body> code , < / body> tag and replace it with the code on Nabble obtained in step 2.

If you have a custom domain name , you can create a subdomain http://forum.yourdomain.com/ as well as a good solution .

wish you success .

Guidance Create A Forum For Blogger
   In some websites you often see them create forums for many different purposes such as learning to share information, exchange, increased traffic ... in blogger you can totally have a similar forum . On Blogger , you are not allowed to create a subdomain or folder to a new design that could be a forum . So if you want a forum site on Blogger , you need a certain tips . And this topic will help you do that.

1 . After logging in Blogger , you need to create a static page (static page ). In Design >> Posting >> Edit Pages >> New Page and create a forum titled. Remember page links  forum  look like this:

http://yourblogname.blogspot.com/p/forum.html .

2 . You Create a free forum in Nabble
Guidance Create A Forum For Blogger 1
  You fill out personal information on the registration form , the most important is the email address and password . Nabble will enable confirmation email to the email address you registered. Sign into your email account , mail box ( may be in spam box ) and click the confirmation link to activate your account Nabble . You need to remember the password.

In the process of creating an account , you need to put a name to your forum , such as : My Blogger Forum for example. After you have registered and activated successfully, you log in to your account and select Nabble Embedding Options. Copy the HTML code.

3 . At Blogger account:  to Design >> Edit HTML and select " Expand Widget Templates ".

Press the key combination Ctrl + F and find the line of code:

class='story_text'> id='content-wrapper'>

Paste the following code into the code line above.

<b:if cond='data:blog.url == "http://yourblogname.blogspot.com/p/forum.html"'>
the code from Nabble have get step 2
< / b : if>

4 . Next step is to mark some of the components on your blog page displaying forum . Paste the following code after the line ]]></b:skin>.

<b:if cond='data:blog.url == "http://yourblogname.blogspot.com/p/forum.html"'>
<style type='text/css'>
# content - wrapper {
display: none ! important;
}
< / style>
< / b : if>

  Save Template is finished. Now you can take the time to invite friends to join your forum already.
Note: If you want to create a forum Independent on Blogger , you have to create a new blog . Then go to edit the template , delete the entire section code between 2 tab <body> code , < / body> tag and replace it with the code on Nabble obtained in step 2.

If you have a custom domain name , you can create a subdomain http://forum.yourdomain.com/ as well as a good solution .

wish you success .

Detail

The Limitations Of Blogger Account

The Limitations Of  Blogger Account

   Blogger is free blogging service owned by Google.Blogger is one of the favorite blogging platform of all time. There are millions of active users that prefer to use blogger instead of word press. perhaps there are some limitations on this free blogging platform. You must consider these limitations seriously before starting your blogging career. Here I'm posting some limitations of using blogger account (blogger blog). Here is some information about the limits a Blogger account.

1.Blog Title limits.

You can use only 90 characters for your main blog title.

2. Number of Blogs.

   You can create 100 different blogs per account. However, in case the limit gets exceeded then Google authorities have the right to not only disable your account but also restrict your access to your blogs. Therefore, always keep in mind that your blog lists does not exceed the 100 mark. 

3.Bandwidth Limit of Blogger Blog.

There is no bandwidth limit for a blogger blog.

4. Number of Posts.

   Fortunately, there are no such limits for the number of posts. You can create unlimited posts with unlimited content. All the posts would be saved into your account, and they will be there until or unless you deleted them manually. In case you unwantedly delete the posts, then they can be recovered through Google History Cache.

5.Blog Authors.

You can't add more than 100 blog authors.

6. Number of Labels.

   You can create 5000 labels per blog. You can add 20 unique labels on a single blog post.

7. Size of Pictures.

   There is no size limit of a single picture. However, if you are uploading a picture through your mobile or smartphones then it should not bigger than 250K per picture. Remember: 1 Blog has 1 Gigabyte of Free image hosting. 

8. Length or Size of Posts.

There are no limitation on length of a post, but make sure that you are not exceeding size limit of 1 Mb.

9. Storage Limit of Picture.

Unfortunately you can upload only 1 GB images on your blog. Your blog and your picasa accounts are linked to each other.

10.Size of Pages.

The main page of your site, the archive pages and the post pages are limited to 1 MB in size.If you exceed this limit then it shows up an error  "006 please contact Blogger Support”. You may need to decreasing the size of pages to remove this error.

11.Number of Comments.

There is no limit on number of comments.

12.Comment length.

 4,096 characters per comment.If you exceed this limit then comment will not get published.

13.Bandwidth Limit For image Hosting.

Your Images are hosted on pi casa so, there is not bandwidth limit for images.

14.Account Suspension.

Bloggers has strict rules. They can suspend your account if you violet their terms and conditions. If you do so then they can delete your entire Blogger account. After deleting your blog, your free blog spot domain is kept on hold and no one can use the same domain again. So make sure that you are not violating any of the terms and conditions.

15.Your Blog Is Not Yours.

   Its true that you are not the real owner of your blog, because your blog is owned by Google, they have the rights do delete your blog without your permission. If you violet their privacy policies, then your blog will be no more. Make sure to backup your content.

These limitations can't affect your blogging career. There is no way to exceed these limits. We hope that some of these limits will be removed in upcoming days.

Incase Google delete your site due to some policy violation then you can move your site to WordPress. However, if you do not have a .com Domain then you would be left empty handed. Now the decision is yours either take it or leave it. 

The Limitations Of  Blogger Account

   Blogger is free blogging service owned by Google.Blogger is one of the favorite blogging platform of all time. There are millions of active users that prefer to use blogger instead of word press. perhaps there are some limitations on this free blogging platform. You must consider these limitations seriously before starting your blogging career. Here I'm posting some limitations of using blogger account (blogger blog). Here is some information about the limits a Blogger account.

1.Blog Title limits.

You can use only 90 characters for your main blog title.

2. Number of Blogs.

   You can create 100 different blogs per account. However, in case the limit gets exceeded then Google authorities have the right to not only disable your account but also restrict your access to your blogs. Therefore, always keep in mind that your blog lists does not exceed the 100 mark. 

3.Bandwidth Limit of Blogger Blog.

There is no bandwidth limit for a blogger blog.

4. Number of Posts.

   Fortunately, there are no such limits for the number of posts. You can create unlimited posts with unlimited content. All the posts would be saved into your account, and they will be there until or unless you deleted them manually. In case you unwantedly delete the posts, then they can be recovered through Google History Cache.

5.Blog Authors.

You can't add more than 100 blog authors.

6. Number of Labels.

   You can create 5000 labels per blog. You can add 20 unique labels on a single blog post.

7. Size of Pictures.

   There is no size limit of a single picture. However, if you are uploading a picture through your mobile or smartphones then it should not bigger than 250K per picture. Remember: 1 Blog has 1 Gigabyte of Free image hosting. 

8. Length or Size of Posts.

There are no limitation on length of a post, but make sure that you are not exceeding size limit of 1 Mb.

9. Storage Limit of Picture.

Unfortunately you can upload only 1 GB images on your blog. Your blog and your picasa accounts are linked to each other.

10.Size of Pages.

The main page of your site, the archive pages and the post pages are limited to 1 MB in size.If you exceed this limit then it shows up an error  "006 please contact Blogger Support”. You may need to decreasing the size of pages to remove this error.

11.Number of Comments.

There is no limit on number of comments.

12.Comment length.

 4,096 characters per comment.If you exceed this limit then comment will not get published.

13.Bandwidth Limit For image Hosting.

Your Images are hosted on pi casa so, there is not bandwidth limit for images.

14.Account Suspension.

Bloggers has strict rules. They can suspend your account if you violet their terms and conditions. If you do so then they can delete your entire Blogger account. After deleting your blog, your free blog spot domain is kept on hold and no one can use the same domain again. So make sure that you are not violating any of the terms and conditions.

15.Your Blog Is Not Yours.

   Its true that you are not the real owner of your blog, because your blog is owned by Google, they have the rights do delete your blog without your permission. If you violet their privacy policies, then your blog will be no more. Make sure to backup your content.

These limitations can't affect your blogging career. There is no way to exceed these limits. We hope that some of these limits will be removed in upcoming days.

Incase Google delete your site due to some policy violation then you can move your site to WordPress. However, if you do not have a .com Domain then you would be left empty handed. Now the decision is yours either take it or leave it. 

Detail

Ways To Customize Sidebar Header In Blogger

Ways To Customize Sidebar Header In Blogger

    Many people want to make their sidebar header more stylish. They want to customize it in such a way that it will look unique. Are you one of them?Are you uninterested with your soiled sensing Sidebar? If your answer is yes then this article can help you. Sidebar is one of the most Important elements of your blogger template, it holds all those widgets which totally fundamental substances among a website. Let us assumes that a somebody arrived on your blog patch navigating finished your articles he saw a junky hunt Sidebar Gallery. Therefore, it is intrinsic to alter your Sidebar Headings with Proper decorate group and font styles. So, those who are anxiously sensing for a method of modifying their Blogger Blog's Sidebar Headings see How to Alteration Sidebar Fonts, Appearance and Filler in Blogger Construction.
It is very easy to customize Sidebar Header.There is no rocket discipline behind Sidebar header. Nearly all Blogger Enabled websites uses H2 (and very few blogs uses H3) Line tags for the Sidebar headings. Hence, it is extremely direct to fix or change Sidebar headings.

  One of the things that a blogger should not forget is to customize his/her sidebar header according to his/her likeness. In this tutorial, I will show on how to add background image or color to your blogger sidebar header.

Ways To Customize Sidebar Header In Blogger.

Step 1. Identify first the ID of your widgets/gadgets that you have put in your sidebar section,
Steps in identifying your individual widget Id in your blogger template.
  1.1 In the other window, Log- in to your Blogger Account go to Blogger Dashboard, click Template, hit Edit HTML button.


Ways To Customize Sidebar Header In Blogger 1
  1.2 Click Jump to Widget then click the name of your widget or if you can't find your widget's name in the Jump Widget Menu,  you can Press Control F and Type the name of your widget inside the search box then click Enter in your keyboard.


Ways To Customize Sidebar Header In Blogger 2
  1.3 After finding the name of your widget, for example you are looking for the  Popular Post Widget, you can find this set of code below.

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>

The bolded text in red above is the ID of your Popular Post Widget. Repeat step no. 1.3 to find the ID of your other widgets.
There is also another way of locating or knowing the ID of your widget. Here are the steps.
  • Go to your Blogger Lay-out page
  • Find the symbol below or the text edit ( in blue color).
Ways To Customize Sidebar Header In Blogger 3
  • Click it and you will see the codes that you have inserted before,click the link at the top portion.
Ways To Customize Sidebar Header In Blogger 4

The last code being underline with the red arrow above (HTML12) is the ID of the widget

Step 2. After getting your Individual Widget ID, save that for you will use that in the next step,

Step 3. In the other window, go to Blogger Dashboard, click Template and hit Edit HTML button
Ways To Customize Sidebar Header In Blogger 5
Step 4. Search for the code  ]]></b:skin> and just above it, paste the code below.

#PopularPosts1 h2 {
background: url(http://4.bp.blogspot.com/-3ZOj9sTgywU/UuDzjf-8F9I/AAAAAAAAEQk/VIEGyNx-lO0/s1600/photo++for+sidebar.jpg);
height:30px;
width: 248px;
margin-left: 0px;
padding-top:0px;
font-family: Sans-serif, Arial, Helvetica;
font-size: 25px;
text-align: center;
}
Short Customization:
  • Replace the text in red with your own sidebar widget ID that you have save in Step 2.
  • To change the image background,Replace  URL image in (orange color) with your own image  (image size is width=248 px by height= 41px) or depending upon the width lay-out of your sidebar.
  • Adjust the height and width of your image by replacing the numerical value in yellow highlighted text
  • Adjust the margin and  depending upon the placement of the image background in your side bar
  • Adjust placement of the title of the widget inside the image background. You can also place that in left or in the right corner of the background image.
Step 5. Save your template and Enjoy.

Wish You Success.

Ways To Customize Sidebar Header In Blogger

    Many people want to make their sidebar header more stylish. They want to customize it in such a way that it will look unique. Are you one of them?Are you uninterested with your soiled sensing Sidebar? If your answer is yes then this article can help you. Sidebar is one of the most Important elements of your blogger template, it holds all those widgets which totally fundamental substances among a website. Let us assumes that a somebody arrived on your blog patch navigating finished your articles he saw a junky hunt Sidebar Gallery. Therefore, it is intrinsic to alter your Sidebar Headings with Proper decorate group and font styles. So, those who are anxiously sensing for a method of modifying their Blogger Blog's Sidebar Headings see How to Alteration Sidebar Fonts, Appearance and Filler in Blogger Construction.
It is very easy to customize Sidebar Header.There is no rocket discipline behind Sidebar header. Nearly all Blogger Enabled websites uses H2 (and very few blogs uses H3) Line tags for the Sidebar headings. Hence, it is extremely direct to fix or change Sidebar headings.

  One of the things that a blogger should not forget is to customize his/her sidebar header according to his/her likeness. In this tutorial, I will show on how to add background image or color to your blogger sidebar header.

Ways To Customize Sidebar Header In Blogger.

Step 1. Identify first the ID of your widgets/gadgets that you have put in your sidebar section,
Steps in identifying your individual widget Id in your blogger template.
  1.1 In the other window, Log- in to your Blogger Account go to Blogger Dashboard, click Template, hit Edit HTML button.


Ways To Customize Sidebar Header In Blogger 1
  1.2 Click Jump to Widget then click the name of your widget or if you can't find your widget's name in the Jump Widget Menu,  you can Press Control F and Type the name of your widget inside the search box then click Enter in your keyboard.


Ways To Customize Sidebar Header In Blogger 2
  1.3 After finding the name of your widget, for example you are looking for the  Popular Post Widget, you can find this set of code below.

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>

The bolded text in red above is the ID of your Popular Post Widget. Repeat step no. 1.3 to find the ID of your other widgets.
There is also another way of locating or knowing the ID of your widget. Here are the steps.
  • Go to your Blogger Lay-out page
  • Find the symbol below or the text edit ( in blue color).
Ways To Customize Sidebar Header In Blogger 3
  • Click it and you will see the codes that you have inserted before,click the link at the top portion.
Ways To Customize Sidebar Header In Blogger 4

The last code being underline with the red arrow above (HTML12) is the ID of the widget

Step 2. After getting your Individual Widget ID, save that for you will use that in the next step,

Step 3. In the other window, go to Blogger Dashboard, click Template and hit Edit HTML button
Ways To Customize Sidebar Header In Blogger 5
Step 4. Search for the code  ]]></b:skin> and just above it, paste the code below.

#PopularPosts1 h2 {
background: url(http://4.bp.blogspot.com/-3ZOj9sTgywU/UuDzjf-8F9I/AAAAAAAAEQk/VIEGyNx-lO0/s1600/photo++for+sidebar.jpg);
height:30px;
width: 248px;
margin-left: 0px;
padding-top:0px;
font-family: Sans-serif, Arial, Helvetica;
font-size: 25px;
text-align: center;
}
Short Customization:
  • Replace the text in red with your own sidebar widget ID that you have save in Step 2.
  • To change the image background,Replace  URL image in (orange color) with your own image  (image size is width=248 px by height= 41px) or depending upon the width lay-out of your sidebar.
  • Adjust the height and width of your image by replacing the numerical value in yellow highlighted text
  • Adjust the margin and  depending upon the placement of the image background in your side bar
  • Adjust placement of the title of the widget inside the image background. You can also place that in left or in the right corner of the background image.
Step 5. Save your template and Enjoy.

Wish You Success.

Detail

Fix Error Unable To Add Widgets In Blogger

Fix Error Unable To Add Widgets In Blogger

   Technewonline.com today will answer your questions about Fix Error Unable To Add Widgets In Blogger. 
Recently, I faced a problem related to blogger Layout. Recently I changed the URL of one of our blogger blog to another URL, then when I visited my blogger layout and tried to add HTML/Java Script widget to it. This worked for the first time, second time when I tried to add the HTML/Java script then it didn't worked, no error shown and also I tried many other methods to add the codes. The only thing that was visible to me after pressing save button was "javascriptvoid0" at the left corner. I thought this blog will get fixed up after some time, I waited for a long time still the problem remained as it is. I was able to edit default blogger widget, also i was able to add new default blogger widget such as biog archive Google plus one button, Google plus badge etc. but I was unable to add custom HTML/Java script widgets in my blog layout.

I thought its not my fault, there will be may peoples facing the same problem so, I tried to find out those people but, I found very few people are facing the same problem. Then I realised I'm in a big trouble. Here in this article I'm sharing all the that might work for you.

Then I tried to add html/Java script widgets on my other blogs. All my blogs given the same output.

To overcome this problem, please follow the instructions below steps:

1.Changing Blogger Template.

I changed my blog template many times, all the templates returned the same output. Changing the template didn't worked at all

2. Changing Internet Browser.

Google chrome was my default browser when the problem started to appear. Then tried many other browsers such as Firefox and internet explorer. Unfortunately, nothing worked for me.

3. Changing Internet Connection.

I was using broadband connection to connect to the internet. I disconnect and reconnected to the internet many times in hope that the problem will get fixed up. Also I tried to use internet from different internet service providers

4. Try Adding Widgets From Different Computer.

   After one week, I went to my friends house to get a solution to this problem. I logged into my blogger account and tried to add the widget inside my blog layout. This time I was successful in adding widget inside blog layout.

Adding widgets from a different computer worked for me. Then I tried to track back where I went wrong, which thing was blocking me from adding html widget in my blog layout on my own computer. I realised It was a badly configured windows application that was tracking my web browsing. Tool bars can also track your internet browsing, such extensions and add-ons can be the cause of problem and can take you into a serious trouble. Then the problem never appeared on my computer.


I decided to remain at a safe side, After that day I removed all the extensions and add-ons from Google chrome and Firefox and never used them.

Wish You Success.
Fix Error Unable To Add Widgets In Blogger

   Technewonline.com today will answer your questions about Fix Error Unable To Add Widgets In Blogger. 
Recently, I faced a problem related to blogger Layout. Recently I changed the URL of one of our blogger blog to another URL, then when I visited my blogger layout and tried to add HTML/Java Script widget to it. This worked for the first time, second time when I tried to add the HTML/Java script then it didn't worked, no error shown and also I tried many other methods to add the codes. The only thing that was visible to me after pressing save button was "javascriptvoid0" at the left corner. I thought this blog will get fixed up after some time, I waited for a long time still the problem remained as it is. I was able to edit default blogger widget, also i was able to add new default blogger widget such as biog archive Google plus one button, Google plus badge etc. but I was unable to add custom HTML/Java script widgets in my blog layout.

I thought its not my fault, there will be may peoples facing the same problem so, I tried to find out those people but, I found very few people are facing the same problem. Then I realised I'm in a big trouble. Here in this article I'm sharing all the that might work for you.

Then I tried to add html/Java script widgets on my other blogs. All my blogs given the same output.

To overcome this problem, please follow the instructions below steps:

1.Changing Blogger Template.

I changed my blog template many times, all the templates returned the same output. Changing the template didn't worked at all

2. Changing Internet Browser.

Google chrome was my default browser when the problem started to appear. Then tried many other browsers such as Firefox and internet explorer. Unfortunately, nothing worked for me.

3. Changing Internet Connection.

I was using broadband connection to connect to the internet. I disconnect and reconnected to the internet many times in hope that the problem will get fixed up. Also I tried to use internet from different internet service providers

4. Try Adding Widgets From Different Computer.

   After one week, I went to my friends house to get a solution to this problem. I logged into my blogger account and tried to add the widget inside my blog layout. This time I was successful in adding widget inside blog layout.

Adding widgets from a different computer worked for me. Then I tried to track back where I went wrong, which thing was blocking me from adding html widget in my blog layout on my own computer. I realised It was a badly configured windows application that was tracking my web browsing. Tool bars can also track your internet browsing, such extensions and add-ons can be the cause of problem and can take you into a serious trouble. Then the problem never appeared on my computer.


I decided to remain at a safe side, After that day I removed all the extensions and add-ons from Google chrome and Firefox and never used them.

Wish You Success.
Detail

Ways To Add Google +1 Button For Websites

Ways To Add Google +1 Button For Websites
    Google introduced the +1 button not long ago. While performing a search at Google, this +1 button allows you to vote up/down the search results. We covered this piece news before and in it, we also mentioned that Google will introduce the +1 button to all website in the future. Well, that future is today. From today onward, you can place the +1 button on your website and allow your readers to vote up the story.

  Add Google +1 button for websites. Google +1 Button is increasingly important in SEO, contributed somewhat to help Google appreciate your website.
Google +1 is a new feature included in Google search results on Google Search helps users to share search results page on Google plus that his actions by clicking the +1 button on results search. This is a very interesting feature of Google directs users. This feature helps users to evaluate search results on Google.

   Google +1 also play an important role in the strategy against the website fool the search engines (the “content farms” for example), which Google uses to determine website SEO tricks to attract advertising profits but bland content. Google will allow users 1 for information AdWords and AdSense ads.

Implement +1 button to your website.

The implementation button is simple. You just need to insert two line of codes to your HTML or theme file.

1. Insert the following javascript code to your <head> tag
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>

2. Insert the following tag to the place where you want the button to appear.
<g:plusone></g:plusone>
That ‘s it.

Add Google +1 For WordPress

Ways To Add Google +1 Button For Websites 1
As of this post, there are no plugins for adding the +1 button yet (but I am sure it will be available very soon). To add the +1 button, in your themes folder, open the header.php file. Insert the javascript code to the <head> tag
Open your single.php or index.php, and place the <g:plusone></g:plusone> to the place where you want it to appear.

Parameter

There are several parameters that you can use.
Size of the button: The default is “standard“, which is 24px tall. You can choose “small” (15px), “medium” (20px) or “tall” (60px).
Include count: The default is set to “true”. You can turn it off if you don’t want the +1′d count to appear.

URL (href): By default, the button will grab the URL of the existing page, but you can specify your own URL with the parameter href="your-url-here".

Points To Note When Adding The +1 Button.

 1. +1 is a public action, so you should add the button only to public, crawlable pages on your site. If you have a password protected page, or a members only forum, do not use this button. Once you add the button, Google may crawl or recrawl the page, and store the page title and other content, in response to a +1 button impression or click.

2. You can include multiple +1 button on a page, but it is best to add the URL parameter to the code so it can identify the correct link for each button.

3. The +1 button is available in 40 languages. The default is English. If your site is not in English, do go to the Google +1 site to grab the code in your specified language.
For more info, check out the Google +1 button site and the FAQ site.

Wish You Success.
Ways To Add Google +1 Button For Websites
    Google introduced the +1 button not long ago. While performing a search at Google, this +1 button allows you to vote up/down the search results. We covered this piece news before and in it, we also mentioned that Google will introduce the +1 button to all website in the future. Well, that future is today. From today onward, you can place the +1 button on your website and allow your readers to vote up the story.

  Add Google +1 button for websites. Google +1 Button is increasingly important in SEO, contributed somewhat to help Google appreciate your website.
Google +1 is a new feature included in Google search results on Google Search helps users to share search results page on Google plus that his actions by clicking the +1 button on results search. This is a very interesting feature of Google directs users. This feature helps users to evaluate search results on Google.

   Google +1 also play an important role in the strategy against the website fool the search engines (the “content farms” for example), which Google uses to determine website SEO tricks to attract advertising profits but bland content. Google will allow users 1 for information AdWords and AdSense ads.

Implement +1 button to your website.

The implementation button is simple. You just need to insert two line of codes to your HTML or theme file.

1. Insert the following javascript code to your <head> tag
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>

2. Insert the following tag to the place where you want the button to appear.
<g:plusone></g:plusone>
That ‘s it.

Add Google +1 For WordPress

Ways To Add Google +1 Button For Websites 1
As of this post, there are no plugins for adding the +1 button yet (but I am sure it will be available very soon). To add the +1 button, in your themes folder, open the header.php file. Insert the javascript code to the <head> tag
Open your single.php or index.php, and place the <g:plusone></g:plusone> to the place where you want it to appear.

Parameter

There are several parameters that you can use.
Size of the button: The default is “standard“, which is 24px tall. You can choose “small” (15px), “medium” (20px) or “tall” (60px).
Include count: The default is set to “true”. You can turn it off if you don’t want the +1′d count to appear.

URL (href): By default, the button will grab the URL of the existing page, but you can specify your own URL with the parameter href="your-url-here".

Points To Note When Adding The +1 Button.

 1. +1 is a public action, so you should add the button only to public, crawlable pages on your site. If you have a password protected page, or a members only forum, do not use this button. Once you add the button, Google may crawl or recrawl the page, and store the page title and other content, in response to a +1 button impression or click.

2. You can include multiple +1 button on a page, but it is best to add the URL parameter to the code so it can identify the correct link for each button.

3. The +1 button is available in 40 languages. The default is English. If your site is not in English, do go to the Google +1 site to grab the code in your specified language.
For more info, check out the Google +1 button site and the FAQ site.

Wish You Success.
Detail

Ways Display Author Name in Blogger

Ways Display Author Name in Blogger

     As you all know copyright is very important article in the seo website, blog, if you are the owner of this article and has patented the ability to post your first top up with that title very high.
   Displaying Blog author name below blog writer could help in increasing your domain authority. Showing Blog Author name is one of the best ways of increasing Domain Authority. Most of the attribute template developers like Themeforest.com always includes author profile in their themes by default and you don’t need to do any manual task to show blog author name.  Recently, one of our readers wrote a net mail asking nearly how to display communicator figure (Blog Author Information) in blogger posts, so this post is for those users that really want. In this article, we give convey you how to exhibit author argot in Blogger posts.

For showing author profile Follow the steps given below:
First of all, Login in to your blogger account. In your blogger dashboard select the blog that you want and go to template section. Now click on edit HTML and search for “<data:post.body/>” tag add the code. Add the code given above “<data:post.body/>”.

  If you want to display author name below blog post, otherwise add the code given below above “<data:post.body/>“ tag.

<!-- Author profile code by Technewonline -->
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<b:if cond='data:post.authorProfileUrl'>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
<span itemprop='name'><data:post.author/></span>
</a>
</span>
<b:else/>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<span itemprop='name'><data:post.author/></span>
</span>
</b:if>
</b:if>
</span>
<div class='author-profile' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<b:if cond='data:post.authorPhoto.url'>
<img expr:src='data:post.authorPhoto.url' itemprop='image' width='50px'/>
</b:if>
<div>
<a class='g-profile' expr:href='data:post.authorProfileUrl' itemprop='url' rel='author' title='author profile'>
<span itemprop='name'><data:post.author/></span>
</a>
</div>
<span itemprop='description'><data:post.authorAboutMe/></span>
</div>

   You can use Blogger profile or Google+ profile to display author name. If you are neighbouring your blogger and Google+ profile then it will show your Google+ profile link in your log posts, otherwise it will show your regular blogger profile in blog posts.
I expect this post has helped you in acquisition to show author information in Blogger Blog Posts. 
Wish You Success.
Ways Display Author Name in Blogger

     As you all know copyright is very important article in the seo website, blog, if you are the owner of this article and has patented the ability to post your first top up with that title very high.
   Displaying Blog author name below blog writer could help in increasing your domain authority. Showing Blog Author name is one of the best ways of increasing Domain Authority. Most of the attribute template developers like Themeforest.com always includes author profile in their themes by default and you don’t need to do any manual task to show blog author name.  Recently, one of our readers wrote a net mail asking nearly how to display communicator figure (Blog Author Information) in blogger posts, so this post is for those users that really want. In this article, we give convey you how to exhibit author argot in Blogger posts.

For showing author profile Follow the steps given below:
First of all, Login in to your blogger account. In your blogger dashboard select the blog that you want and go to template section. Now click on edit HTML and search for “<data:post.body/>” tag add the code. Add the code given above “<data:post.body/>”.

  If you want to display author name below blog post, otherwise add the code given below above “<data:post.body/>“ tag.

<!-- Author profile code by Technewonline -->
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<b:if cond='data:post.authorProfileUrl'>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
<span itemprop='name'><data:post.author/></span>
</a>
</span>
<b:else/>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<span itemprop='name'><data:post.author/></span>
</span>
</b:if>
</b:if>
</span>
<div class='author-profile' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<b:if cond='data:post.authorPhoto.url'>
<img expr:src='data:post.authorPhoto.url' itemprop='image' width='50px'/>
</b:if>
<div>
<a class='g-profile' expr:href='data:post.authorProfileUrl' itemprop='url' rel='author' title='author profile'>
<span itemprop='name'><data:post.author/></span>
</a>
</div>
<span itemprop='description'><data:post.authorAboutMe/></span>
</div>

   You can use Blogger profile or Google+ profile to display author name. If you are neighbouring your blogger and Google+ profile then it will show your Google+ profile link in your log posts, otherwise it will show your regular blogger profile in blog posts.
I expect this post has helped you in acquisition to show author information in Blogger Blog Posts. 
Wish You Success.
Detail

Ways Add Random Posts Button In Blogger Blog

Ways Add Random Posts Button In Blogger Blog

   Talk about random blog button is a button will take you to any article. A worthy way to keep your guests busy, and to permit them to pay longer on your web site is to use “Random Post” button. Recently, one among our guests asked us the way to Add a Random Post button in Blogger. This button are often placed anywhere in your web site, providing your guests the flexibility that once clicked it'll take the guests to a whole random post. In alternative words, it'll show random posts, when the button is clicked. this is often truly simple to attain, thus during this article we'll show you the way to feature a Random Post button in Blogger.

   Before you begin look into the live demo of this Random Post Button, and it'll take you to the random post on every hit.The first factor you would like to try to to is to induce yourself login into your Blogger account and move to template → Edit mark up language section. currently inside the template coding. Now to form a random post link and place it during a desired location of your web site paste the following code any place you prefer. for instance, in your navigation and it might mechanically be converted into a random post button. Once everything is finished, save your template by pressing “Save Template” button.

<script type="text/javascript">
/*<![CDATA[*/
function showLucky(root){ var feed = root.feed; var entries = feed.entry || []; var entry = feed.entry[0]; for (var j = 0; j < entry.link.length; ++j){if (entry.link[j].rel == 'alternate'){window.location = entry.link[j].href;}}} function fetchLuck(luck){ script = document.createElement('script'); script.src = '/feeds/posts/summary?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky'; script.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(script); } function feelingLucky(root){ var feed = root.feed; var total = parseInt(feed.openSearch$totalResults.$t,10); var luckyNumber = Math.floor(Math.random()*total);luckyNumber++; a = document.createElement('a'); a.href = '#random'; a.rel = luckyNumber; a.onclick = function(){fetchLuck(this.rel);}; a.innerHTML = 'Random Post'; document.getElementById('boc-random').appendChild(a); } </script><script src="/feeds/posts/summary?max-results=0&alt=json-in-script&callback=feelingLucky">
/*]]>*/
</script>
<style>
#boc-random a {
background-color:#3bb3e0;
padding:10px;
position:relative;
font-family: 'Open Sans', sans-serif;
font-size:12px;
text-decoration:none;
color:#fff;
border: solid 1px #186f8f;
background-image: linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
background-image: -o-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
background-image: -moz-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
background-image: -ms-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, rgb(44,160,202)),
color-stop(1, rgb(62,184,229))
);
-webkit-box-shadow: inset 0px 1px 0px #7fd2f1, 0px 1px 0px #fff;
-moz-box-shadow: inset 0px 1px 0px #7fd2f1, 0px 1px 0px #fff;
box-shadow: inset 0px 1px 0px #7fd2f1, 0px 1px 0px #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
}
#boc-random a::before {
background-color:#ccd0d5;
content:"";
display:block;
position:absolute;
width:100%;
height:100%;
padding:8px;
left:-8px;
top:-8px;
z-index:-1;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
-moz-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
-o-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
}
#boc-random a:active {
padding-bottom:9px;
padding-left:10px;
padding-right:10px;
padding-top:11px;
top:1px;
background-image: linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
background-image: -o-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
background-image: -moz-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
background-image: -ms-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, rgb(62,184,229)),
color-stop(1, rgb(44,160,202))
);
}
</style>
<div id="boc-random"></div>

Summary:  You successfully accessors a Random post button in your blogger blog. currently go and check your web site to visualize if everything is functioning simply just the plans. If you have got followed the directions properly, we tend to we sure you'll not face any errors.
How To Make Random Post Button More Stylish.
I am sure, individuals would love to form their random post button stand out (fancy from others). you'll use the subsequent piece of CSS code to customise or conventionalize your button. you'll create it look entirely totally different and might conjointly use an equivalent CSS coding as we've got provided below.
   I hope this tutorial may have helped you in learning the way to add random post button in blogger. What are its advantages and the way abundant conversion it's transfer to your web site. we'd like to hear your reviews and inputs on this subject, be at liberty to leave you precious comments below.
Wish you success.

Ways Add Random Posts Button In Blogger Blog

   Talk about random blog button is a button will take you to any article. A worthy way to keep your guests busy, and to permit them to pay longer on your web site is to use “Random Post” button. Recently, one among our guests asked us the way to Add a Random Post button in Blogger. This button are often placed anywhere in your web site, providing your guests the flexibility that once clicked it'll take the guests to a whole random post. In alternative words, it'll show random posts, when the button is clicked. this is often truly simple to attain, thus during this article we'll show you the way to feature a Random Post button in Blogger.

   Before you begin look into the live demo of this Random Post Button, and it'll take you to the random post on every hit.The first factor you would like to try to to is to induce yourself login into your Blogger account and move to template → Edit mark up language section. currently inside the template coding. Now to form a random post link and place it during a desired location of your web site paste the following code any place you prefer. for instance, in your navigation and it might mechanically be converted into a random post button. Once everything is finished, save your template by pressing “Save Template” button.

<script type="text/javascript">
/*<![CDATA[*/
function showLucky(root){ var feed = root.feed; var entries = feed.entry || []; var entry = feed.entry[0]; for (var j = 0; j < entry.link.length; ++j){if (entry.link[j].rel == 'alternate'){window.location = entry.link[j].href;}}} function fetchLuck(luck){ script = document.createElement('script'); script.src = '/feeds/posts/summary?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky'; script.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(script); } function feelingLucky(root){ var feed = root.feed; var total = parseInt(feed.openSearch$totalResults.$t,10); var luckyNumber = Math.floor(Math.random()*total);luckyNumber++; a = document.createElement('a'); a.href = '#random'; a.rel = luckyNumber; a.onclick = function(){fetchLuck(this.rel);}; a.innerHTML = 'Random Post'; document.getElementById('boc-random').appendChild(a); } </script><script src="/feeds/posts/summary?max-results=0&alt=json-in-script&callback=feelingLucky">
/*]]>*/
</script>
<style>
#boc-random a {
background-color:#3bb3e0;
padding:10px;
position:relative;
font-family: 'Open Sans', sans-serif;
font-size:12px;
text-decoration:none;
color:#fff;
border: solid 1px #186f8f;
background-image: linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
background-image: -o-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
background-image: -moz-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
background-image: -ms-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, rgb(44,160,202)),
color-stop(1, rgb(62,184,229))
);
-webkit-box-shadow: inset 0px 1px 0px #7fd2f1, 0px 1px 0px #fff;
-moz-box-shadow: inset 0px 1px 0px #7fd2f1, 0px 1px 0px #fff;
box-shadow: inset 0px 1px 0px #7fd2f1, 0px 1px 0px #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
}
#boc-random a::before {
background-color:#ccd0d5;
content:"";
display:block;
position:absolute;
width:100%;
height:100%;
padding:8px;
left:-8px;
top:-8px;
z-index:-1;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
-moz-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
-o-box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
box-shadow: inset 0px 1px 1px #909193, 0px 1px 0px #fff;
}
#boc-random a:active {
padding-bottom:9px;
padding-left:10px;
padding-right:10px;
padding-top:11px;
top:1px;
background-image: linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
background-image: -o-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
background-image: -moz-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
background-image: -ms-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0, rgb(62,184,229)),
color-stop(1, rgb(44,160,202))
);
}
</style>
<div id="boc-random"></div>

Summary:  You successfully accessors a Random post button in your blogger blog. currently go and check your web site to visualize if everything is functioning simply just the plans. If you have got followed the directions properly, we tend to we sure you'll not face any errors.
How To Make Random Post Button More Stylish.
I am sure, individuals would love to form their random post button stand out (fancy from others). you'll use the subsequent piece of CSS code to customise or conventionalize your button. you'll create it look entirely totally different and might conjointly use an equivalent CSS coding as we've got provided below.
   I hope this tutorial may have helped you in learning the way to add random post button in blogger. What are its advantages and the way abundant conversion it's transfer to your web site. we'd like to hear your reviews and inputs on this subject, be at liberty to leave you precious comments below.
Wish you success.

Detail
Google Visit us on Google+