Today, I'm sharing beautiful premium Thesis email subscription widget with social media buttons such as Facebook, Twitter, Google+, RSS and YouTube.You easily add this widget to your blog with one step only. After add if you don't like this widget you can easily remove it also.
In this short tutorial I will guide you "How to Add Thesis Email Subscription Widget To Your Blogger/WordPress Blog".You can easily add this widget to your WordPress or Blogger blog.Before adding you can see screenshot below as a demo.Let's start this tutorial:
Demo
Recommend For You: Previous Subscription Widgets:
- Add A Beautiful Subscription Box To Your Blogger Blog
- Stylish Subscription Widget For Blogger And WordPress
- Add Beautiful Email Subscription Box V2 In Blogger Blog
- New Stylish Subscription Box For Blogger/Wordpress Sidebar
- Blogs Daddy's Social Subscription Widget For Blogger & WordPress
Adding Thesis Email Subscription Widget
You just need to place a code to your blog widget Follow following steps to add Customized and Stylized Subscription Widget to WordPress and Blogger both!
Adding Thesis Email Subscription Widget To Blogger
- Go to Dashboard > Design > Page Elements.
- Click Add A Gadget. In window, select HTML/Javascript .
- Copy The Code Given Below and Paste It Inside The Box.
- Save The Gadget
Adding Thesis Email Subscription Widget To WordPress
- Go to Dashboard > Appearance > Widgets > Available Widgets
- Drag Text Widget Into a Sidebar.
- Paste In The Code.
- Save Widget & Its Done
Code For Thesis Email Subscription Widget
<!-BlogsDaddy Thesis Email Subscription Widget->
<div id="sidebars">
<ul class="sidebar_list">
<li id="social-profiles">
<ul>
<li>
<a class="social facebook" rel="nofollow" target="_blank" title="Facebook Fan Page" href="https://www.facebook.com/BlogsDaddy">Facebook</a>
</li>
<li>
<a class="social twitter" rel="nofollow" target="_blank" title="Twitter Profile" href="https://twitter.com/BlogsDaddy">Twitter</a>
</li>
<li>
<a class="social googleplus" rel="nofollow" target="_blank" title="GooglePlus" href="https://plus.google.com/u/0/106217413057730068740">GooglePlus</a>
</li>
<li>
<a class="social rss" rel="nofollow" target="_blank" title="RSS" href="http://feeds.feedburner.com/BlogsDaddy">Rss</a>
</li>
<li>
<a class="social youtube" rel="nofollow" target="_blank" title="Youtube Channel" href="http://www.youtube.com/user/5abiRaag">Youtube</a>
</li>
</ul>
</li>
<li id="sidebar-social">
<p id="email-notice">
Receive Quality Tutorials Straight In Your Inbox by Submitting Your Email ID Below.We Respect Your Privacy.
<span></span>
</p>
<div id="email-form">
<h6>Get Email Updates</h6>
<form class="nice custom" style="" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=BlogsDaddy', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input class="input-text" type="text" name="email" onblur="if (this.value == '') {this.value = 'Enter Your Email Address';}" onfocus="if (this.value == 'Enter Your Email Address') {this.value = '';}" value="Enter Your Email Address">
<input type="hidden" value="BlogsDaddy" name="uri">
<input type="hidden" name="loc" value="en_US">
<input class="button" type="submit" value="Hook Me Up">
<p>
We never encourage SPAM
<br>
You can Unsubscribe any time
</p>
</form>
<span style=" line-height:0px; font-size:8px; font-weight:bold; margin-left:270px;
">
<a style="color:#000000;" href="http://bit.ly/EmailSubscriptionWidget" target='_blank' rel='nofollow'>Widget</a> </span>
</div>
</li>
</ul>
</div>
<style>
#sidebars {
border: 0 none;
float: right;
padding: 0 15px;
width: 310px;
}
#email-notice {
background: none repeat scroll 0 0 #DF6001;
color: #FFFFFF;
font-size: 14px;
line-height: 1.5;
margin: 0 0 20px;
padding: 15px 20px;
position: relative;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
}
#email-notice span {
border-left: 14px solid transparent;
border-right: 14px solid transparent;
border-top: 10px solid #DF6001;
bottom: -10px;
height: 0;
position: absolute;
right: 40px;
width: 0;
}
#email-form {
background: none repeat scroll 0 0 padding-box #313131;
border-bottom: 5px solid #202020;
border-radius: 2px 2px 2px 2px;
text-shadow: 0 -1px 0 #000000;
}
#email-form h6 {
color: #FFFFFF;
font-family: arial;
font-size: 16px;
font-weight: bold;
letter-spacing: 0;
padding: 15px 20px 0;
text-transform: none;
}
#email-form form {
color: #FFFFFF;
margin: 0;
padding: 20px 18px;
}
#email-form input.input-text {
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #222222;
margin: 0 0 10px;
padding: 8px;
width: 94%;
}
#email-form .button {
background: none repeat scroll 0 0 #FFFFFF;
float: right;
margin: 0 0 0 10px;
}
#email-form p {
color: #CCCCCC;
font-size: 12px;
line-height: 18px;
margin: 0;
}
#sidebar-social {
float: left;
font-size: 12px;
margin: 0 0 15px;
width: 100%;
}
ul.sidebar_list {
list-style: none outside none;
}
li.widget ul {
list-style: none outside none;
}
#social-profiles {
float: left;
}
#social-profiles ul {
float: left;
list-style: none outside none;
margin: 0 5px 20px;
}
#social-profiles ul li {
float: left;
}
#social-profiles ul li a {
display: block;
float: left;
height: 32px;
margin: 0 15px;
text-indent: -999em;
width: 32px;
}
#social-profiles a.social {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcH17YQGkjlsxN_86JtYvAj4GQCKqTuk-lJWPiGMPcTazqayG09xpc3eTwo4Vx2jnLFjXMHLL8VnVSSGvLyzyDK27Il0CH2RNrUEDSpJNPOQr2tBX_d5H6beSOoN0ekt-YTZNw0R3GG0c/s1600/social.png") no-repeat scroll 0 0 transparent;
}
#social-profiles a.facebook {
background-position: -79px 0;
height: 32px;
margin: 0 15px 0 5px;
width: 32px;
}
#social-profiles a.facebook:hover {
background-position: -79px -74px;
height: 32px;
width: 32px;
}
#social-profiles a.twitter {
background-position: -5px -111px;
height: 32px;
width: 32px;
}
#social-profiles a.twitter:hover {
background-position: -42px 0;
height: 32px;
width: 32px;
}
#social-profiles a.youtube {
background-position: -42px -37px;
height: 32px;
width: 32px;
}
#social-profiles a.youtube:hover {
background-position: -5px -37px;
height: 32px;
width: 32px;
}
#social-profiles a.rss {
background-position: -42px -74px;
height: 32px;
width: 32px;
}
#social-profiles a.rss:hover {
background-position: -79px -37px;
height: 32px;
width: 32px;
}
#social-profiles a.googleplus {
background-position: -5px 0;
height: 32px;
width: 32px;
}
#social-profiles a.googleplus:hover {
background-position: -5px -74px;
height: 32px;
width: 32px;
}
* {
margin: 0;
padding: 0;
}
.custom .sidebar ul.sidebar_list {
padding: 15px 0;
}
</style>
Remember Notes :
The social and feed links are highlighted in yellow, you need to change these to your own.
Guys, if you like it then Share this widget and give your feedback about the widget.We want to hear from you.Happy blogging
Author - Gagan Masoun is the owner of Blogs Daddy Blog.Gagan lives in India, has been blogging since 2010 and writing Blogs Daddy Blog since 2011.You can find him in the usual social networks.
Thanx dude helped me very much
ReplyDelete