Sunday, 7 April 2013

How to Add Wikipedia Search Box to Blogger ~ Widget 2013

Google officials ,continuously working on blogger platform to upgrade more gadgets.Now I am going to tell you about   a widget  recently created by blogger officials.Let me Explain Wikipedia is the free encyclopedia site which is use to find about history, scientific thing i mean to say Wikipedia is use for search topics with complete details for every Subject like Physics,Chemistry,biology,English and Urdu etc.Everyone Know Wikipedia is second Most Widely used Search Engine in the world.In this Tutorial i am tell you blogger officials recently created a new official Blogger Wikipedia Search Box widget .In the World Many Educational Blogs I Recommendation they having educational blogs, you must add this Widget in to Blog For Your blog readers because it helps to your Readers to find some thing unique inside your site.Now i am Going to tell you How to add Wikipedia Search Box to Blogger? You can easily add this Wikipedia Search Box to your blogger sidebar.
Don't Miss:New Facebook Pop Up Like Box For Blogger 2013
Don't Miss:How To Add Floating Facebook Like Box In Blogger?

How to Add Wikipedia Search Box to Blogger

  • Go to Blogger dashboard >> Layout >> Add a Gadget >>
  • Now Click on "More Gadgets"
  • And  find  "Wikipedia " and click on the + and click Save.
  • You Almost Done.
  • See Below Screen Shot.

  • Wikipedia Search Box to Blogger Live Demo in Below Picture.

Take 5 seconds and share this article with Friends and make us Happy.That's All 

Friday, 5 April 2013

How to add marquee text for Blogger/blog?

Animation text is use to attract the visitor to tell your visitors what will be your next updates or if you repair a broken link and tell to visitor about broken link using marquee.Animation text (also called Marquee).Moving text which you can put or add anywhere in your blog and in posts.I'm going to explain you How to add marquee text for Blog.and we can customize Moving text in many ways.like change text direction,change text background and control marquee speed.I am Customize text with Using CSS. Now I am going to show ,how to marquee text.if you want to move text. use the codes given below.

Example:1
<marquee>ADD YOUR TEXT HERE.</marquee>
RESULT: ADD YOUR TEXT HERE In this code text is simple and move text from right to left.
Example:2
<marquee direction="right">ADD YOUR TEXT HERE.</marquee>
<marquee direction="left">ADD YOUR TEXT HERE..</marquee>
RESULT: ADD YOUR TEXT HERE.... ADD YOUR TEXT HERE.... you can change the direction of the marquee text adding 'direction' attribute.
Example:3
 <marquee direction="right" width='90%'>ADD YOUR TEXT HERE....</marquee>
RESULT:
ADD YOUR TEXT HERE....
You can change the moving width of marquee text.
Example:4

 <marquee direction="right" width="100%" style="background:#FF6310"><font color="#000">ADD YOUR TEXT HERE....</font></marquee>
<marquee direction="left" width="100%" style="background:#0080ff"><font color="#000">ADD YOUR TEXT HERE....</font></marquee>
RESULT:
ADD YOUR TEXT HERE.... ADD YOUR TEXT HERE....
Now I add text color,text background color for the text.You may replace #ff6310 and #0080ff with hexadecimal color number for background color of Marquee text and also replace #000 with hexadecimal color number for text color.
Example:5
 <marquee direction="right" scrollamount="1">ADD YOUR TEXT HERE WITH CONTROL SPEED.</marquee>
RESULT:
ADD YOUR TEXT HERE WITH CONTROL SPEED. Now in this example I add scrollamount="1" to control marquee speed.if you want to customize the speed then change bold text in above code with your number.and also change  text direction just replace right with left.

Example:6
<marquee direction="left"width="90%"><a href='http://bloggerwidget4u.blogspot.com/2013/04/how-to-create-move-text-in-blog.html'>How to add marquee text for  Blogger</a></marquee>
RESULT: How to add marquee text for Blogger
Now in this example move text with link. replace Red color url with your post address.and Replace bold words with your text.
That's All Take 5 second and share this article with friends.

Thursday, 28 March 2013

How To Add Subscribe Box to Blogger /website

How To Add Subscribe Box to Blogger? In this post i will tell to you how to increase your visitor to subscribe via RSS. Basically Rss services is let's your blog visitor like you blog posts and contents. and visitor want to read your posts through RSS news then they subscribe you via RSS.If Visitors Subscribe you then increase your blog pageviews. One thing is more in Subscribe Box with social media webs.(Digg,Twitter,Facebook,Stumbleupon,Delicious).Social networking is best to attract visitors to your website for read your contents and also How to Keep Visitors at Your Site Longer? Now Add this Email Subscription Form to your website in your blog sidebar and make your sidebar beautiful and more attractive.If you are Want to add this Widget then Follow the steps given below.

You May Like To Read:
  1. Create a Cute E-mail Subscription Form.
  2. How to add Animated Social Sharing Widget With Cool Hover Effects.
  3. Touch me sharing widget for blogs/blogger.
  4. How To Remove Powered By Blogger from blog?
  5. New Facebook Pop Up Like Box for Blogger 2013.
  6. Cool Email Subscription Widget With Social Media Buttons For Blogger.

How to  Add Subscribe Box to Blogger /website.


  1. Go to Blogger Dashboard >> Layout >> Add a Gadget >> HTML/Javascript Box.
  2. Paste the following code in the HTML/Javascript Box.
  3. And click on Save.


<style type="text/css">
#subscribe-box {
      overflow: hidden;
      margin: 10px 0 0 0;
      }

#subscribe-box a.subscribe-sec {
      display: inline-block;
      display: -moz-inline-stack;
      width: 40px;
      padding-top: 38px;
      zoom: 1;
      }

#subscribe-box a.subscribe-sec:hover {
      color: #660000;
      }
</style>

<form action="http://feedburner.google.com/fb/a/mailverify" style="border:1px solid #ccc;padding:3px;" target="popupwindow" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNER-ID', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p>Get Notified When We Update !!!</p><p><input style="width:180px" name="email" type="text" value="Enter your email address:" onclick="this.value=&#39;&#39;;" /><input value="FEEDBURNER-ID" name="uri" type="hidden" /><input value="en_US" name="loc" type="hidden" /><input value="Subscribe" type="submit" /></p>

<p><div id="subscribe-box">
<a title="Delicious" href="http://delicious.com/DELICIOUS-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjolF66RQ-anNZB9BKjQgJF7YClVCFw9fZbdhP5EjJYo3SIO9rvbWaH_EidWJ84jb3WH9fWHjGBOZ9JotZm_FmkE3j7CAZW9rB3jHK9tL9ge5LW9uJ35B0vh2b5vgqL406KiPvi046V2JOs/s1600/delicious.png) center top no-repeat"></a>
<a title="Twitter" href="http://twitter.com/TWITTER-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOiKv9By9IK9xQ4VNSbQ-BrIVRne-mdVKQ4a9N77tP0P2fRw_R65WbXdw5Vl5rYNUa1RJau5DNYiMrvua8CXGbxxLSB6-KuN9DjHxrqXWV5uXRDe70U6MnF5Ldp6yfmw3IWmKniZs7e0qO/s1600/twitter.png) center top no-repeat"></a>
<a title="Digg" href="http://digg.com/users/DIGG-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRdWPHqFqHoTV0dtLIeUKxDW8pOZS-485rE7Z9IZELeh5YBCbuujqHwlLDMm4J138GZYAV1Tct1r3EOqIJaj5o9I0qkcJDjqEQHXjn0O1GGiuf_VevO0_L1k6IqMlx1fIK8WXGEbTyCvBL/s1600/digg.png) center top no-repeat"></a>
<a title="Facebook" href="http://www.facebook.com/FACEBOOK-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbO5AKJnEw5OSo3XzKKTr3tqio2NZJViBAeiPlYD-0xCzfSVNfuzKkU8fhM_UO_3nuVfAqk1wInoXaWat6XogtgHgY31-lXNOwf6jWtssVi1nKGFem1Kt545M1zmPdtu6VkYFD7ozfVk4v/s1600/facebook.png) center top no-repeat"></a>
<a title="Stumbleupon" href="http://www.stumbleupon.com/stumbler/STUMBLEUPON-USERNAME" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiYuPK9N2zxS-Azcl4dxpFkfCxH5_-qx1L2fqY_q_yio-fq4bHmreCC7qxGoImk7upKCVJXovc2iBYijrGekN6ea-XOivH0mldmr9E0ThzIfXWDnjvs62TY-O5FQtQHUk0u1bvxABQFgiT/s1600/stumbleupon.png) center top no-repeat"></a>
<a title="RSS Feed" href="http://feeds.feedburner.com/FEEDBURNER-ID" class="subscribe-sec" style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCGylydmmftFVNnUDT-R8BVZJTosX1aoeGqHHq3Ybec0u3hFgU0BKBzWQqqxez-hRZWddGud73sTFK2wvGd5-7AehaoqF7VW3DkyMYz0IxQbfEKVJjCawZzeAQfGtw3tJxiC4eBTqaKLuF/s1600/rss.png) center top no-repeat"></a>
</div></p>

</form>

Customization:



  1. Replace "FEEDBURNER-ID" with your feedburner ID.
  2. Replace "DELICIOUS-USERNAME" with your delicious username.
  3. Replace "TWITTER-USERNAME" with your twitter username.
  4. Replace "FACEBOOK-USERNAME" with your facebook username.
  5. Replace "STUMBLEUPON-USERNAME" with your stumbleupon username.
  6. Replace "DIGG-USERNAME" with your digg username.
  7. Get Notified When We Update !!!  Change with your Text.
That's All.

Tuesday, 19 March 2013

Add Angry Birds Social Sharing Widget To Blogger


To Day I am going to share another social Sharing Widget. I have already shared  many Widget for  Blogger.Like SocialSharing Widget With Cool Hover Effects.Create a Cute E-mail Subscription Form ETC .But today about  "Angry Birds"  sharing widget for blogs/blogger. Social sharing widgets helps  to  get  some quality traffic for your website/blog.This widget  have  facebook Twitter,Google Plus and Rss sharing  buttons .Social sharing widgets are very useful for blogs.Facebook is best Social Media Website and after Facebook Twitter is most Popular Web.and another Social Media site  that is Google Plus.You can add this widget to your blog easily.If you want to add this widgets in your blog than follow the following steps.



You May Like To Read:
  1. Create a Cute E-mail Subscription Form.
  2. How to add Animated Social Sharing Widget With Cool Hover Effects.
  3. Touch me sharing widget for blogs/blogger.
  4. Add Flying Letters below Mouse Pointer Animation.
  5. How To Remove Powered By Blogger from blog?
  6. New Facebook Pop Up Like Box for Blogger 2013.

How to  Add Angry Birds Social Sharing Widget To Blogger?

  • Go to Blogger Dashboard >> Layout >> Add a Gadget >> HTML/Javascript Box.
  •  Paste the following code in the HTML/Javascript Box.
  •  And click on Save.
<style>
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 60px;
height:60px;
}
.bubblewrap li img{
width: 50px; /* width of each image.*/
height: 50px; /* height of each image.*/
border:0;
margin-right: 4px; /*spacing between each image*/
-webkit-transition:-webkit-transform 0.1s ease-in; /*animate transform property */
-o-transition:-o-transform 0.1s ease-in; /*animate transform property in Opera */
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}
</style>
<ul class="bubblewrap">
<li><a href="https://plus.google.com/100052689605336447119" rel='nofollow' target='_blank'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjyDA-C8zNqbzTzqJcK1bTm9-yCQvjJSm8PAt87bmvblNAEekcyerayfFsuuVAziPvtaC5_boBIW66r2ET9PC8hiQg0DxhgH1JH4Lk_oL9qDA_65Kr02_LK75v6HUovsxBrPHAH8jByYAc/s1600/bloggertrix-googleplus.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.facebook.com/bloggerwidget4u" rel='nofollow' target='_blank'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9v9xa4LdnkLo0A2-6C0B-wr3T80JQyPhknubRrPzZ0eeAiFVC6nJ2oP5_OlPmGqVfv4uLxDyXF2suCB_XitUd_LQo3PZQTKtc0xogVUgD9hcWwBLuhxm5y2Pr4LGqWb3wAfxMAcJhRg8/s1600/bloggertrix-facebook.png" title="Add to Facebook" /></a></li>
<li><a href="YOUR youtube LINK " rel='nofollow' target='_blank'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbVh7h9AAECckOK9BY7G92333UjSD5jaclM6qiqyxIRVeT0xgXa5awXRyhqTM2-2ZzABqDjSwKNn351NfJE5OMpwjvmpraiObic1fu0TopPGfqAt8epoRYeAjAX08aklpRD5mLGaDt_Bw/s1600/bloggertrix-youtube.png" title="Add to Youtube" /></a></li>
<li><a href="http://www.twitter/farhankayani143" rel='nofollow' target='_blank'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhU5Am3lUeE889jPbWhUyOlctmiyisP-sJe8gOfxtA2O6_8mctC4CFoLw6ZkrK7Z1wj5g_zalK74NpZZnnrfcmoQLqBy3DhAskvDaSw31C1GoJVIw2zEY0Yvr6_mTLbMhRLb7qOi5vCGG4/s1600/bloggertrix-twitter.png" title="Add to Twitter" /></a></li>
<li><a href="http://feeds2.feedburner.com/bloggerwidget4u" rel='nofollow' target='_blank'><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieSyZGVwSB8amYW_L8nYAWGNnYCTLrozOMrSodEqgSO-Xoho5WkW4IJ6_L60SHueuFcNKkA9mzwh772aUWHOyHp_F1Ra3rkVuTqRGLrrA-WYRRatX-hKe0RJuhDBXG9y8ZhERrY_qu6Bc/s1600/bloggertrix-Rss.png" title="Add RSS Feed" /></a></li>
</ul>
Note: Replace Bold  text  URL's with your own social profile links.
That's All
Note:This widget originally Credit  by Gagan Masoun from blogsdaddy .

Saturday, 16 March 2013

Touch me sharing widget for blogs/blogger



Hi! to I am going to share another social media widget. I have share Many Tricks About Blogger.Like Social Sharing Widget With Cool Hover Effects.Create a Cute E-mail Subscription Form ETC .But today about  "Touch me"  sharing widget for blogs/blogger.This widget  have  facebook Twitter,Google Plus and Rss sharing  buttons .Facebook is best Social Media Website and after Facebook Twitter is most Popular Web.and another Social Media site  that is Google Plus.If you want to add this widgets in your blog than follow the following steps.

How to  Add "Touch me"  sharing widget for blogs/blogger?

  • Go to Blogger dashboard >> Layout >> Add a Gadget >> HTML/Javascript Box.
  • Paste the following code inside  the HTML/javascript Box.
<style>
/*--------Touch Me Sharing Widget ------*/
.touchme a {
display:block;
height:50px;
width:50px;
padding:0 4px;
float:left;
background:transparent url(https://farhankayni.googlecode.com/files/Sharing%20Touch%20Me.png) no-repeat;
-webkit-transition: ease-in 0.2s all;
-moz-transition: ease-in 0.2s all;
-o-transition: ease-in 0.2s all;
-ms-transition: ease-in 0.2s all;
transition: ease-in 0.2s all;
cursor:pointer;
}

.touchme a.googleplus {
background-position: 0px -58px;
}
.touchme a.googleplus:hover {
background-position: 0px 0px;
}

.touchme a.twitter {
background-position: 0px -290px;
}
.touchme a.twitter:hover {
background-position: 0px -232px;
}
.touchme a.facebook {
background-position: 0px -406px;
}
.touchme a.facebook:hover {
background-position: 0px -348px;
}

.touchme a.rss {
background-position: 0px -174px;
}
.touchme a.rss:hover {
background-position: 0px -116px;
}

</style>

<div class='touchme'>
<!--RSS-->
<a class='rss' href="YOUR RSS LINK" rel='external nofollow' target='_blank'></a>
<!--Google Plus-->
<a class='googleplus' href="YOUR GOOGLE PROFILE LINK" rel='external nofollow' target='_blank'></a>
<!--Facebook-->
<a class='facebook' href="YOUR FACEBOOK LINK" rel='external nofollow' target='_blank'></a>
<!-- Twitter -->
<a class='twitter' href="YOUR TWITTER LINK" rel='external nofollow' target='_blank' ></a>

</div>

Customization:


  1. Replace YOUR RSS LINK with your Feed burner link.
  2. Replace YOUR GOOGLE PROFILE LINK with your Google+ URL
  3. Replace YOUR FACEBOOK LINK with your Facebook URL
  4. Replace YOUR TWITTER LINK with your Twitter Profile URL
  5. And click on save.

Note:This widget originally Credit  by Umar Irshad from  Design Kindle.


/
show-notice
hide-notice