Beautiful Subscription Box Widget for Blogger


Beautiful Subscription Box Widget for Blogger

This is a Beautiful Subscription Box Widget for blogger post. This post is about how to add a Subscription Box. Subscription box contains Facebook, Twitter, RSS Feed, e-mail subscription. This widget is based on a wooden theme. Facebook, Twitter, RSS Feed links are shown as Natural Wooden Sticky Boards.

So come with me and start how to add Beautiful Subscription Box Widget for blogger.

  • Go to Blogger Dashboard
  • Go to Layout
  • Select Add a Gadget
  • You can type title any
  • And Copy the following code in the content.

<style type="text/css">
 /* Delete form Here*/ 
img.beintouch:hover {
    background: none repeat scroll 0 0 #D6D6D6;
    border-radius: 16px 16px 16px 16px;
    box-shadow: 0 0 10px #565656;
}
/* Delete to Here*/
.emailtext{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_jyBRlupM-MYzE90O9VlETnc-pnlTfgnbgXZyWEACsYAx5uDpYzpc5yA_THNrKU6ACAcq1dlLsVKOgqQ3SSZMwbc4R4cXixNQJoJl3PTkCrY0N7Gm9rtQNvmXZOx3LcnuJ7z-bBCIoN4/s1600/mailbox.png") no-repeat scroll 4px center transparent;
    border: 1px solid #7E4E27;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 1px 1px 4px #7E4E27 inset;
    color: #444444;
    font-weight: bold;
    margin-left: 2px;
    padding: 7px 15px 7px 35px;
    text-decoration: none;
    width: 176px;
}
.ebutton {
    background: -moz-linear-gradient(-45deg, #3C1F0E 0%, #D28A47 30%, #F9E183 30%, #D28A47 55%, #3C1F0E 100%) repeat scroll 0 0 transparent;
    border: 1px solid #D3D3D3;
    border-radius: 4px 4px 4px 4px;
    color: #FFFFFF;
    cursor: pointer;
    font-weight: bold;
    margin-left: -18px;
    margin-top: 5px;
    padding: 6px 15px;
    text-decoration: none;
    text-shadow: 1px 1px 0 #000000;
}
</style>
<table align="center" width="317px" cellspacing="0px" cellpadding="1px"><tbody>
<tr><td><a>target="_blank" rel="nofollow" href="http://www.facebook.com/pages/BlogTipzNTricks"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgJCwh9euVwMVs20_p-wo_Up49AvkftlEYBBOj5b5fZxkw59hOlxLKSIeX6I-dZtVtp7Rk_diYgzJ99tZqVOxBFgNrztS1F7H0e-xgTSeP0b17ZUzm_wO-ysyTO5FyGh6rBNdcN2sKrd3t/s1600/fb+makemoneyfreewithus.png"class="beintouch"/></a></td><td><a>target="_blank" href="http://twitter.com/rightevery/"rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvLB5b0v-o0vjuLNA-JWWg2H80XvXJAmJ6hKUrXZUY8sKbmlG5Vl0yUowbefbzm2iv5TtfOk0CUbl9AssuhqBb5ufl2yk7EVO3xKfL6rItPU6YAvQ6zUJZB2YC4gxmDvwaJBhxpQlGhlez/s1600/tweet+advancetricks.png" class="beintouch" /></a></td><td><a target="_blank" href="http://feeds.feedburner.com/BlogTipzNTricks" rel="nofollow"><imgsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnMFd9YUGVEALMwTXyRPhBXYQjnjP4Rs2vMMjGf6lnFaMXOmJSeOwkY0QPk02XPvmP395h-ImCr-By4IfOyEdF4fedWXeffZJYBAWrLO5D8mpaZsQMq9KGf02ajeGEFpJVasXEaJoWBEM5/s1600/makemoneyfreewithus.png" class="beintouch" /></a><a href="http://netoopsblog.blogspot.com"></a></td></tr>
</tbody></table>
<div>
Get Latest Tips via e-mail</div>
<formtarget="popupwindow"style="margin: 0pt;" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=BlogTipzNTricks', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"method="post"class="emailform" action="http://feedburner.google.com/fb/a/mailverify">
<input type="hidden" value="BlogTipzNTricks" name="uri" />
<input type="hidden" value="en_US" name="loc" />
<input type="text" value="Enter your email..." onfocus="if (this.value == "Enter your email...") {this.value = ""}" onblur="if (this.value == "") {this.value = "Enter your email...";}" name="email" class="emailtext" />
<input type="submit" value="Subscribe" title="" class="ebutton" alt="" />
</form>



Change the Red highlighted code with FACEBOOK PAGE URL, TWTTER, FEED URL, FEED ID respectively.

Post a Comment