In this tutorial im gonna explain how to add Social Media And Rss Subscribe Widget. By using this widget you can link your social media profile Facebook, Twitter and Rss and subscribe field. It will help to get the new updates by emails. If you have any questions regarding to this.Let me know.
I will help you.
Also see: Add "Search the Blog" Widget to your blog better than google custom search.
I will help you.
Also see: Add "Search the Blog" Widget to your blog better than google custom search.
Process:
1.Sign in to your Google Account and go to blogger dashboard .
2.Click on Your Blog(in which you want to add this widget).
3.Then Click on "Layout" which is present on left side bar.
4.Then Click on "Add a Gadget".
5.Give gadget a title and leave it keeping it blank.
6.Choose gadget i-e "HTML/JAVA script" from "basics" menu of Gadgets5.Give gadget a title and leave it keeping it blank.
7.Add the following Bold codes after doing following changes:
*Replace OS-trickz.blogspot.com with your twitter profile
*Replace OS-trickz.blogspot.com with your facebook profile
*Replace OS-trickz.blogspot.com with your feedburner profile
*Replace UserId with your Google Plus User Id
<style>
.subscribebtrix {
border: 2px solid #000000;
padding: 4px;
width: 200px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.subscribebtrix:hover {
-moz-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
-webkit-box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
box-shadow: inset 1px 1px 10px 1px rgba(249, 215, 126, 1);
}
.tbimailbox {
border: 1px solid #D3D3D3;
-webkit-border-radius:2px;
border-radius: 2px;
-moz-box-shadow: 1px 1px 1px 1px rgba(255, 172, 84, 0.4) inset;
-webkit-box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.4) inset;
color: #666;
font: 14px "trebuchet ms", sans-serif;
padding: 7px 15px;
width: 200px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.tbimailbox:hover {
-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.btrixsubmit {
font: bold 12px Tahoma, Geneva, sans-serif;
font-style: normal;
color: #ffffff;
background: #ff5714;
border: 0px solid #ffffff;
text-shadow: 0px -1px 1px #222222;
box-shadow: 2px 2px 5px #000000;
-moz-box-shadow: 2px 2px 5px #000000;
-webkit-box-shadow: 2px 2px 5px #000000;
border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
padding: 8px 15px;
cursor: pointer;
margin: 0 auto;
}
.btrixsubmit:active {
cursor: pointer;
position: relative;
top: 2px;
}
.btrixsubmit::-moz-focus-inner {
border: 0;
padding: 0;
margin: 0;
}
</style>
<br />
<div class="subscribebtrix">
<div style="color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;">
Free Updates to your Inbox</div>
<div style="margin: 10px 0 0 6px;">
<form action="http://feedburner.google.com/fb/a/mailverify" class="emailform" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bloggertrix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow">
<input name="uri" type="hidden" value="bloggertrix" />
<input name="loc" type="hidden" value="en_US" />
<input class="tbimailbox" name="email" onblur="if (this.value == "") {this.value = "Enter your email...";}" onfocus="if (this.value == "Enter your email...") {this.value = ""}" type="text" value="Enter your email..." />
<input alt="" class="btrixsubmit" title="" type="submit" value="Subscribe" />
</form>
</div>
<div style="border: none; color: #666666; font: 22px Oswald, cursive; margin: 25px 0 0 5px;">
Follow us:</div>
<div style="margin: -32px 0 0 120px;">
<a href="http://www.facebook.com/OS-trickz.blogspot.com" target="_blank" title="Join us on Facebook"><img alt="facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinhtZG7Zj-XDpXLyLAOchk4wUStYZBz0I4-xHnJWKIY9hQjfOdgzOI_udubfAKuWMnetofSLiur4MRWNs02eo0jtd8wlM7bCQ_69cRcRgla993X5HS5yoI_ZCpevDSGAKAjV_bugbC988/s1600/facebook_btrix.png" /></a>
<a href="http://www.twitter.com/OS-trickz.blogspot.com" rel="nofollow" target="_blank" title="Follow us on Twitter"><img alt="twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy7qYpiPXSu34xMLY9Y3FiJQLeAmxPL-mAPHtwdBM-X3MK-lFoYVacM_kF7y5fgm96KGj_d8Nbqubi5ecsRsXeX-6hUTqNT9aGaO1-dr1f2C8nBWvnlMc3W8uDQb5xPfPttuaQTmGvxXE/s1600/twitter_btrix.png" /></a>
<a href="https://plus.google.com/UserId" rel="nofollow" target="_blank" title="Follow us on Google+"><img alt="gplus" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdgdzCvZNXDnSdpIJN9y6Q8UB2fY57qVkgDBZwBFvIwr-Cdd9KZxwDTD7KLQoLjH0URFXHP17VHzIZLG2bhTp4YqEv1LEBhHOuhOzWKmYSGCcMXpbtwsm2s5oX7q24304Bgk7O_EAo3lM/s1600/googleplus_btrix.png" /></a>
<a href="http://feeds2.feedburner.com/OS-trickz.blogspot.com" rel="nofollow" target="_blank" title="Subscribe to RSS"><img alt="rss" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiq1t5rrqwvr1bY9gGB0ijRwLytCENh9sIeSd5csxIMqGe1TiPlEIACrhJ4t4RgRQzyGUE0AAkaGZwQSezxNICowBab0qNorHUhUq-pUkviAX6ffvyeroaf_ObWsdrgO8Zo8wUcUA5drbY/s1600/rss_btrix.png" /></a>
</div>
<div align="center">
<a href="http://feeds.feedburner.com/bloggertrix"><img alt="" height="26" src="http://feeds.feedburner.com/~fc/bloggertrix?bg=FF9900&fg=444444&anim=1" style="border: 0;" width="88" /></a></div>
</div>
8. Now , Save your JAVA/HTML Script and save arrangement.
9.That,s it Enjoy The Change.
No comments:
Post a Comment