Saturday, June 29, 2013

How to add a subscription cool box in blogger.

Hey Guys you are very interested to know that how to add cool subscribe box in your blog.
Then do some work which helps you for gettind subscription box in your blog.


  1. Open blogger.com
  2. Layout
  3. Edit Html
  4. And paste the following code.

<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>
<style type="text/css" media="all">
.pbtsidebar {
    display: inline;
    float:left;
    font-size: 14px;
    text-shadow: 1px 1px #fff;
    width: 300px;
    margin-left: 10px;  
}
.pbtsidebar .widget-wrap {
    padding: 30px;
}
.pbtenews #subbutton {
    -moz-border-radius: 3px;
    -moz-box-shadow: 0 1px 1px #a24a1d;
    -webkit-border-radius: 3px;
    -webkit-box-shadow: 0 1px 1px #a24a1d;
    border-radius: 3px;
    box-shadow: 0 1px 1px #a24a1d;
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioXVhxHB4xuWgLoo7mGbm5Q8H1kh8qFV2ylxrdtxbYHhcYQPEvhDWeRIGOay4dl6lgvC9N-LigdSJYkgTo4dOejFwqYtNkprNQvwKA0zuBDfSsUkcR2zWce_OMOvyx-PRux62WxFLYNaHD/s1600/button-light.png") 0 0;
    border: none;
    color: #333 !important;
    font-size: 14px;
    font-weight: bold;
    margin: 0 auto;
    padding: 10px 15px;
    text-shadow: 1px 1px #fff;
    text-transform: uppercase;
}
.pbtenews #subbutton:hover {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEioXVhxHB4xuWgLoo7mGbm5Q8H1kh8qFV2ylxrdtxbYHhcYQPEvhDWeRIGOay4dl6lgvC9N-LigdSJYkgTo4dOejFwqYtNkprNQvwKA0zuBDfSsUkcR2zWce_OMOvyx-PRux62WxFLYNaHD/s1600/button-light.png") 0 -40px;
}
#pbtsidebar .pbtenews {
    background-color: #e96a2a;
    margin: -30px;
    min-height: 201px;
    padding: 1px 20px 15px;
    text-align: center;
    }
#pbtsidebar .pbtenews p {
    color: #fff;
    text-shadow: 1px 1px #a1491d;
    font-family:'PT sans';
}
.pbtenews #subbox {
    -moz-box-shadow: 1px 1px 3px #ccc inset;
    -webkit-box-shadow: 1px 1px 3px #ccc inset;
    background: #fff url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTfq-QgQGvjKpyUlV8uisMI1WzJe8sN0RjOytwCn24RtoSQJqxWuRpKeT8t2y431NYTa7EtJcVRIOovXVNgkby0iFQh4P-GYXRf1dICe36u9DK9rt8R9ehyphenhyphenQeUofFvGUPrs-A6zYez42W1/s1600/enews.png") center left no-repeat;
    box-shadow: 1px 1px 3px #ccc inset;
    border-left: 1px solid #9e6e56;
    border-top: 1px solid #9e6e56;
    color: #aaa49f;
    font-size: 11px;
    font-weight: bold;
    margin: 0 10px 15px;
    padding: 14px 10px 12px 50px;
    text-transform: uppercase;
    width: 185px;
}
#pbtsidebar .pbtenews h4 {
    margin-bottom: 10px;
    text-shadow: 1px 1px #a1491d !important;
    margin-top:12px;
    line-height: 1.2em;  
}
.widgettitle{
font-family:'PT sans';
text-transform:uppercase;
background: none;
    color: #fff;
    font-size: 23px;
    padding: 0;
    text-align: center;
}
</style>
<div id="pbtsidebar" class="pbtsidebar widget-area">
<div id="pbtenews-12" class="widget pbtenews-widget"><div class="widget-wrap"><div class="pbtenews"><h4 class="widgettitle">Get latest posts straight to your Inbox!</h4>
<p>Take a tour of latest post as published(We respect your privacy and will never spam you). </p>
<form id="subscribe" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onSubmit="window.open( 'http://feeds.feedburner.com/BloggerWidgetshtmlCodesbeginnersGuideblogwordpresstemplatesthemes', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="text" value="Enter your email address..." id="subbox" onFocus="if ( this.value == 'Enter your email address...') { this.value = ''; }" onBlur="if ( this.value == '' ) { this.value = 'Enter your email address...'; }" name="email">
<input type="hidden" name="uri" value="mylabofblogger">
<input type="hidden" name="loc" value="en_US">
<input type="submit" value="Get Up" id="subbutton">
</form>    </div></div></div></div>

0 comments:

Post a Comment

Gamer City z

Free for your eye videos