Free Download Full Version Software: Blogger Widget

Showing posts with label Blogger Widget. Show all posts

Blue Color Social Subscription Widget for Blogger

<div dir="ltr" style="text-align: left;" trbidi="on">
In this post im gonna explain how to add Rss feed subscribe box for  blogger with social icons.hope <br />
you will like it. By using this users can subscribe your blog. So, it will  help to get the new updates <br />
by emails. Im using CSS and HTML for this widget.You can check it from below demo link.<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://1.bp.blogspot.com/-403btgCjl3I/Usblh5Q74zI/AAAAAAAAE5A/nxKwPykVsN8/s1600/Blue+Color+Social+Subscription+Widget.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://1.bp.blogspot.com/-403btgCjl3I/Usblh5Q74zI/AAAAAAAAE5A/nxKwPykVsN8/s1600/Blue+Color+Social+Subscription+Widget.png" /></a></div>
<h3>
Add Blue Color Social Subscription Widget</h3>
<br />
<b>1.</b> Log in to blogger account and Click drop down.<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-2qMAv17vM2s/Usbl1ed_5YI/AAAAAAAAE5I/dhDF7uOEYXI/s1600/blog-post-option.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://2.bp.blogspot.com/-2qMAv17vM2s/Usbl1ed_5YI/AAAAAAAAE5I/dhDF7uOEYXI/s1600/blog-post-option.jpg" /></a></div>
<br />
<div class="separator" style="clear: both; text-align: left;">
 <b>2. </b> Now select <span style="color: blue;">"<b>Layout</b>"</span> Like Below.</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-vAmOy0-H4DQ/Usbl_KWtKbI/AAAAAAAAE5Q/W915dTZsRTo/s1600/layout.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/-vAmOy0-H4DQ/Usbl_KWtKbI/AAAAAAAAE5Q/W915dTZsRTo/s1600/layout.jpg" /></a></div>
<div class="separator" style="clear: both; text-align: left;">
 <b>3. </b>Click <span style="color: blue;"><b>Add Gadget</b></span> and select<b>  <span style="color: blue;">'HTML/Javascript</span></b><br />
<br />
<b>4.</b> Paste below code.</div>
<div class="separator" style="clear: both; text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: left;">
</div>
<div class="separator" style="clear: both; text-align: left;">

</div>
<div style="background: #9FC5E8; border: solid black 1.0pt; mso-border-alt: solid black .75pt; mso-element: para-border-div; padding: 0in 0in 0in 0in;">

<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><style></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";">#sidebar-subscribe-box{width:300px;border:1px
solid #aaa;border-radius:3px;padding:3px 0}</span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-spacerun: yes;"> </span>.sidebar-subscribe-box-wrapper{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5Zb1ioHnIzvcK0LefsQcVtd_uoMVeziC5qE_iDLnT-DykTvXjebLf_oHNKQPEh3K1LATjbztNnmC1ovnGV5vsEsInm-v_z-hzKdUFB8D4oK7ulAe0BokBOmUgxi2om3CW2jt7PE2n3Os/s1600/background.png)
repeat scroll 0 0
#f7f7f7;color:#111;font-size:14px;line-height:20px;padding:1px 20px
10px;text-align:center;text-transform:uppercase}</span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-spacerun: yes;"> </span>.sidebar-subscribe-box-form{clear:both;display:block;margin:10px
0}form.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0
0;width:auto}</span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-spacerun: yes;"> </span>.sidebar-subscribe-box-email-field{-moz-border-radius:4px;-webkit-border-radius:4px;background:#fff
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWZW4x6AvH1VG_Jq44xSuyV3ua-AKnS5sHV0mPJgRRFJZYXe3tlRk_VIhXyZY7O2NL5JOR4fQKc1HCHM40XxZ0ljtsx48bO7Ch9DjTzu1msJ67k95UfqqTxSh40r1d39tr5PffIeOqJgg/s1600/icons.png)
no-repeat 0 -27px;border:1px solid #ccc;border-radius:4px;color:#444;margin:0 0
15px;padding:10px 40px;width:68%}</span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-spacerun: yes;"> </span>.sidebar-subscribe-box-email-button{background:#09f;border:1px
solid #007fff;box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 1px 0
transparent;color:#fff;cursor:pointer;font-family:verdana;font-weight:700;padding:10px;text-shadow:1px
1px 0 rgba(0,0,0,.4);text-transform:uppercase;width:100%}</span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-spacerun: yes;"> </span>.sidebar-subscribe-box-email-button:hover,.sidebar-subscribe-box-email-button:focus{background:#1ca4ff}</span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-spacerun: yes;"> </span>.sidebar-subscribe-box-email-button:active{-moz-box-shadow:0
1px 4px rgba(0,0,0,0.5) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;box-shadow:0
1px 4px rgba(0,0,0,0.5) inset;outline:0}iframe,object,embed,.yt-border
iframe,.yt-border object,.yt-border
embed,table{width:100%}embed{border-radius:3px;-moz-box-shadow:0 2px 4px
rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 4px rgba(0,0,0,0.2);background:#FFF;border:1px
solid #ddd;box-shadow:0 2px 4px rgba(0,0,0,0.2);margin:0;padding:4px 4px 4px}</span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-spacerun: yes;"> </span>#footer-section{border-top:1px solid
#aaa;box-shadow:inset 0 4px 6px -3px
#aaa;font-family:cambria;font-size:14px;height:100px;margin:10px -30px 5px;padding:0
30px;text-align:center;width:100%}</span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";">a.social-icons{margin-right:
5px;height:45px;width:45px;}</span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";">a.social-icons:hover {
opacity: .7; filter:alpha(opacity=70);}</span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"></style></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<br /></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><div
id="sidebar-subscribe-box"></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><div
class="sidebar-subscribe-box-wrapper"></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><span style="mso-spacerun: yes;">   </span><span style="mso-spacerun: yes;"> </span><br/></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><a
class="social-icons" href="https://facebook.com/<b><span style="color: #073763;">rexhacker</span></b>"><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRckkKKl_DeLLN64fHI4sqkGt8Qm_lyHMzqva4RQP1vcOJ394bEw0aQMsrzPDmegNTp2Jm7dyyGYnFt1vDNP071bL1DIGIRrv1c8PLHnxQ_IJgYFyMoqdZs4Uz91HPETtBgkQCQrXy4yFE/s1600/Bloggertrix-facebook.png"
/></a></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><a
class="social-icons" href="https://twitter.com/<b><span style="color: #3d85c6;">rexhacker</span></b>"><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_yzCGTObkYMB_7watbwIlxQwLNP6liBiU4hNxGMY-QTihC_H6MPaC5NPw8AhfoM2F5-TRlj8JRVBk58LasFsla5fsu1L7z1t4kqMqJND6prg8lP1z7d2tt4ipPAOmoMQFD_d4dGeRyb2J/s1600/bloggertrix-twitter.png"
/></a></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><a
class="social-icons" href="https://plus.google.com/<b><span style="color: #38761d;">userId</span></b>"><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOicAguLs9A5N-L1VA10bUJwDX_JGJ7SKvoVLJk83f5mOEog1MAuIOFnVdfAOa2UOYCvpRdKvCdCAZXcayVaq1tzlWp_N3ctMB71esQqpsWBcoYgk49EsRIkxUCF_XTs2SEJxt6vBtDVlX/s1600/Bloggertrix-Googleplus.png"
/></a></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><a
class="social-icons" href="http://www.feedburner.com/<b><span style="color: #cc0000;">rexhacker</span></b>"><img
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnyO_ecYFnJxz8o4-Yx1D0JWdOqC2xMScNbIHwGAgWrtjdnMwIrNTLnLCGW09dDYop-zy7e5kk-OF01v_BE429LhKWKjoJBoDswvvD4PJCRk4RMUm4Jbrpf4Rt0GuZ4fzFowT4Za6okuIw/s1600/Bloggertrix-Rss.png"
/></a></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><p>Subscribe To
Our Email Newsletter & Receive Updates Free</p></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><div
class="sidebar-subscribe-box-form"><form
action="http://feedburner.google.com/fb/a/mailverify?uri=<b><span style="color: #cc0000;">rexhacker</span></b>"
class="sidebar-subscribe-box-form" method="post"
onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=<b><span style="color: #cc0000;">rexhacker</span></b>', 'popupwindow',
'scrollbars=yes,width=550,height=520');return true"
target="popupwindow"><input name="uri"
type="hidden" value="<b><span style="color: #cc0000;">rexhacker</span></b>"
/></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><input
name="loc" type="hidden" value="en_US"
/><input class="sidebar-subscribe-box-email-field"
name="email" autocomplete="off" placeholder="Enter
your email address here"/></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"><input
class="sidebar-subscribe-box-email-button" title=""
type="submit" value="Subscribe Now !" /></form></span></div>
<div class="MsoNormal" style="background: #9FC5E8; border: none; line-height: normal; margin-bottom: .0001pt; margin-bottom: 0in; mso-border-alt: solid black .75pt; mso-padding-alt: 0in 0in 0in 0in; padding: 0in; tab-stops: 45.8pt 91.6pt 137.4pt 183.2pt 229.0pt 274.8pt 320.6pt 366.4pt 412.2pt 458.0pt 503.8pt 549.6pt 595.4pt 641.2pt 687.0pt 732.8pt;">
<span style="font-family: "Courier New"; font-size: 10.0pt; mso-fareast-font-family: "Times New Roman";"></div></div></div></span></div>
</div>
<div class="MsoNormal">
<br /></div>
* Replace <b style="color: #cc0000;"><span style="color: blue;">rexhacker</span> </b>with your facebook username<br />
* Replace <span style="color: #0b5394;"><b>rexhacker</b></span>  with your  twitter Username<br />
* Replace <b><span style="color: #6aa84f;">rexhacker</span></b> with<span style="font-size: x-small;"><span style="font-family: inherit;"> Googleplus</span></span><br />
* Replace <span style="color: #b45f06;"><b>rexhacker</b></span> with feedburner username<tt><b><br />*</b></tt> Replace <span style="color: #cc0000;">rexhacker</span> with your Feedburner ID <br />
<br />
<b>5. </b>Now save your <b><span style="color: blue;">HTML/Javascript'</span>.</b>You are done.<br />Hope this Blue Color Social Subscription Widget helps to make your blog attractive.<br />

Blue Color Social Subscription Widget for Blogger

In this post im gonna explain how to add Rss feed subscribe box for blogger with social icons.hope you will like it. By using this users ...

9:35:00 PM

Customized Recommendation Social Widget for Blogger

<div dir="ltr" style="text-align: left;" trbidi="on">
In this post im gonna explain how to add customized recommendation popup
 box for blogger. Actually this is just widget.You can add it to your 
blog easily. follow below steps.It includes Google plus, facebok and 
twitter counters.Go to below link for  demo.<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-fAfe60ICwJo/UsbgkoLVvZI/AAAAAAAAE4k/vO9oWtaggHY/s1600/Customized+Recommendation+Social+Widget.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/-fAfe60ICwJo/UsbgkoLVvZI/AAAAAAAAE4k/vO9oWtaggHY/s1600/Customized+Recommendation+Social+Widget.png" /></a></div>
<div style="text-align: center;">
 <a href="http://bloggertrix-demo.blogspot.com/" target="_blank"><b><span style="font-size: large;">Demo</span></b></a></div>
<h3>
Recommendation Social Widget for Blogger</h3>
<b>1.</b> Log in to blogger account and Click drop down.<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-woS2O9cWiYs/Usbhj6NU1uI/AAAAAAAAE40/YoMy0dl4eB0/s1600/blog-post-option.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/-woS2O9cWiYs/Usbhj6NU1uI/AAAAAAAAE40/YoMy0dl4eB0/s1600/blog-post-option.jpg" /></a></div>
<br />
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<b>2. </b> Now select <span style="color: blue;">"<b>Layout</b>"</span> Like Below.</div>
<div style="text-align: left;">
<br /></div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-n_KC0EpIc5s/UsbhaYZ8tNI/AAAAAAAAE4s/F7-PjYuiZ_8/s1600/layout.jpg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://3.bp.blogspot.com/-n_KC0EpIc5s/UsbhaYZ8tNI/AAAAAAAAE4s/F7-PjYuiZ_8/s1600/layout.jpg" /></a></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<br /></div>
<div style="text-align: left;">
<b>3. </b>Click <span style="color: blue;"><b>Add Gadget</b></span> and select<b>  <span style="color: blue;">'HTML/Javascript</span></b><br />
<br />
<b>4.</b> Paste below code.</div>
<div style="text-align: left;">
<br /></div>
<pre style="background-color: #9fc5e8; border: 1px solid black; height: 950px; overflow: auto;"><style>
#socialslide{background: rgb(41, 40, 40) url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9Kic6VPwzsu1f7A9R3VAsmoH5YWgqaplXNchXO1VeffSffmd1UJxNQ9vjVwAdy4RlMaRNUeckgJnqyL3TUqUrVFLug25qk-fjHF2zpt_bDCmLLvMLH4Phd5kcABa3dAeC6bL4R4IX0YM/s1600/recbg-btrix.png) left top repeat-x;
border-radius: 9px;
-moz-border-radius: 9px;
-webkit-border-radius: 9px;
-moz-box-shadow: inset 0 0 3px #333;
-webkit-box-shadow: inset 0 0 3px #333;
box-shadow: inner 0 0 3px #333;
padding: 12px 14px 12px 14px;
width: 300px;
position: fixed;
bottom: 13px;
right: 2px;
display: none;
z-index: 3;
height: 65px;
}
</style>

<div style="float:left; margin:15px;"><a href="https://twitter.com/bloggertrix" class="twitter-follow-button" data-show-count="false" data-size="large" data-show-screen-name="false">Follow @hannygames</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script></div>
</div>

<div class='clear'></div></pre>
<div style="text-align: left;">
 <b> </b></div>
<div style="text-align: left;">
<b>7. </b>Now save your <b><span style="color: blue;">HTML/Javascript</span>'.</b>You are done.<br />
Hope this Recommendation Social Widget helps to increase your pageviews.
</div>
</div>

Customized Recommendation Social Widget for Blogger

In this post im gonna explain how to add customized recommendation popup box for blogger. Actually this is just widget.You can add it to y...

9:20:00 PM

Stylish Jquery Animated Tabs Widget for Blogger

<div dir="ltr" style="text-align: left;" trbidi="on">
<div style="text-align: justify;">
<span style="font-family: inherit;">Tab widgets always help to save 
website space.In this tutorial i am gonna explain how to add Unique jquery 
tab widget for blogger.We can use add few pages for tab widgets.jQuery 
tabs are very stylish and very popular for blogging.This is a simple 
jquery tab widget.I used CSS and jQuery to make this widget.This tab 
widget work with every modern web browsers.However its not work with IE.</span><span style="font-family: inherit;"> you can take a look at in demo page to get idea how it works. </span><br />
<div class="separator" style="clear: both; text-align: left;">
<span style="font-family: inherit;"></span></div>
</div>
<div class="separator" style="clear: both; text-align: center;">
<a href="http://4.bp.blogspot.com/-n_kaYANW8s4/UsbXxRHt0MI/AAAAAAAAE4U/M8cXIhQigQc/s1600/Jquery+Animated+Tabs+Widget.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/-n_kaYANW8s4/UsbXxRHt0MI/AAAAAAAAE4U/M8cXIhQigQc/s1600/Jquery+Animated+Tabs+Widget.png" /></a><b><span style="font-size: medium;"></span></b><b><span style="font-size: medium;"> </span></b></div>
<div class="separator" style="clear: both; text-align: center;">
<b><span style="font-size: medium;"><a class="buttonbtrix blue" href="http://demo.bloggertrix.com/2013/09/blog-post.html" target="_blank">Demo</a></span></b></div>
<br />
<br />
<h3>
<span style="color: blue;">How to add Jquery Animated Tabs Widget to Blogger</span></h3>
<b>1.</b> Go to Blogger Dashboard > <span style="font-family: inherit;">Template</span><br />
<div class="separator" style="clear: both; text-align: left;">
</div>
<b>2. </b>Find ]]></b:skin><br />
<b>3.</b> Paste below code<b> </b>just below it.<br />
<br />
<blockquote>
<style><br />
.b, .c{ display:none;}<br />
.buttons{<br />
    border-bottom:solid #d1c8b8 4px;<br />
    display:block;<br />
    padding:8px;<br />
    width:80px;-moz-border-radius: 1em 4em 1em 4em;<br />
    border-radius: 1em 4em 1em 4em;<br />
    text-align:center;<br />
    margin:1px;<br />
    background:#4b7975;<br />
    text-decoration:none; color:#FFFFFF;<br />
    float:left;font-family:Georgia, "Times New Roman", Times, serif; font-size:14px<br />
}<br />
.buttonHover{background:#86b8b4;border-bottom:solid #FF0000 4px;}<br />
a.buttons:hover{background:#86b8b4;border-bottom:solid #FF0000 4px;}<br />
#multitab {<br />
    background:#919b9d;<br />
    text-align:justify;<br />
    overflow:hidden;<br />
    color:#fff;<br />
    padding:20px;<br />
    -moz-border-radius: 1em 4em 1em 4em;<br />
    border-radius: 1em 4em 1em 4em;    height:200px;<br />
    width:272px;<br />
}<br />
#multwrap{<br />
    text-align:left;<br />
    overflow:hidden;<br />
    width:350px;<br />
    height:380px;<br />
}<br />
  </style><br />
<br />
<script type='text/javascript'><br />
// <![CDATA[<br />
$(document).ready(function() { <br />
    $("#first-tab").addClass('buttonHover');<br />
});<br />
function navigate_tabs(container, tab)<br />
{   <br />
    $(".b").css('display' , 'none');<br />
    $(".c").css('display' , 'none');<br />
    $(".a").css('display' , 'none');<br />
   <br />
    $("#first-tab").removeClass('buttonHover');<br />
    $("#second-tab").removeClass('buttonHover');<br />
    $("#third-tab").removeClass('buttonHover');<br />
   <br />
    $("#"+tab).addClass('buttonHover');<br />
    $("."+container).show('slow');<br />
}<br />
// ]]><br />
</script><br />
<script charset='utf-8' src='https://rexhacker.googlecode.com/files/jquery1.2.6.js' type='text/javascript'/> </blockquote>
<b>4.</b> Now go to blogger <span style="color: blue;"><b>Layout</b> </span><br />
<b> 5.</b> Click <span style="color: blue;"><b>Add Gadget</b></span> and select<b>  <span style="color: blue;">'HTML/Javascript'</span></b><br />
<b>6.</b> Paste below code.<br />
<blockquote>
<div id="multwrap"><br />
 <a href="javascript:navigate_tabs('a','first-tab');" class="buttons" id="first-tab">Tab 1</a> <br />
<a href="javascript:navigate_tabs('b','second-tab');" class="buttons" id="second-tab">Tab 2</a><br />
<a href="javascript:navigate_tabs('c','third-tab');" class="buttons" id="third-tab">Tab 3</a><br />
   <br clear="all" /><br />
      <div id="multitab" align="center"><br />
          <div class="a"><br />
                <em>B</em>logger is a blog-publishing 
service that allows private or multi-user blogs with time-stamped 
entries. It was developed by Pyra Labs, which was bought by Google in 
2003. Generally, the blogs are hosted by Google at a subdomain of 
blogspot.com.  <br />  <br /> Thanks!<br />
<br />
                </div><br />
                <div class="b"><em>L</em>orem Ipsum is
 simply dummy text of the printing and typesetting industry. Lorem Ipsum
 has been the industry's standard dummy text ever since the 1500s, when 
an unknown printer took a galley of type and scrambled it to make a type
 specimen book. It has survived not only five centuries, but also the 
leap into electronic typesetting, remaining essentially unchanged. <br />
<br />
                </div><br />
                <div class="c"><em>S</em>tarting in 
February 2013 Blogger began integrating user blogs with multiple country
 specific URL addresses i.e. exampleuserblogname.blogspot.com would be 
automatically redirected to exampleuserblogname.blogspot.ca in Canada, 
exampleuserblogname.blogspot.co.uk in the United Kingdom etc. 
</div><br />
</div> </div><br />
</div></blockquote>
<b>Note:  </b><span style="color: #0000ee;"><span style="font-family: inherit;">You can past any text <span style="color: #0000ee;">or code  with replacing <span style="color: #0000ee;">above 3 <span style="color: #0000ee;">different </span>text<span style="color: #0000ee;">s<span style="color: #0000ee;">.</span></span></span></span></span></span><br />
<br />
<b>7. </b>Now save your <b><span style="color: blue;">HTML/Javascript'</span>.<br />
</b>
You are done. If you have any problem related to this Jquery Animated Tabs Widget. Just leave a comment.I will help to you.</div>

Stylish Jquery Animated Tabs Widget for Blogger

Tab widgets always help to save website space.In this tutorial i am gonna explain how to add Unique jquery tab widget for blogger.We can...

8:40:00 PM

Subscribe to: Posts ( Atom )

Blue Color Social Subscription Widget for Blogger

Customized Recommendation Social Widget for Blogger

Stylish Jquery Animated Tabs Widget for Blogger

Popular Posts

Comments

Archive