Hi friends in this post I am sharing stripe type blogger subscription box for free.And this subscription is different from other subscription boxes due to its colour and border.In this subscription box I have used borders,borders with dashed style and more.And I hope definitely you like this box due to the design.Also check the below links to see other blogger subscription boxes.
Now let we see the code for stripe style blogger subscription box,
- Goto Blogger >> Layout >> Add a gadget >> Choose Html/Java script and click plus icon.
- Now copy and paste the below code in that widget .
| <style>
#whitestripefullwidth{
width:300px;
height:430px;
background:#4397b1;
border:3px solid #0e626d; }
#authorimage{
width:300px;
height:100px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvXe-wROqupamNfiVFUk-uIFSylmhU1t4OevqIhl4tWyoTRW8PoUvXUSLqCpxFypvziErCwM2fK0oWmdxPo-XT_oUJLDkMw0VySmBjjDiR9iz4Ebbb86FIzmVbbQX6bl2ou28ZDhSVb1c/s1600/mailicon+stripe.png);
background-position: center;
background-repeat:no-repeat ;
margin-bottom:15px;
}
#whitestripetext{
width:250px;
height:100px;
background:#4397b1;
border:3px dashed #ffffff;
margin-left:22px;
font-family:Salina;
font-size:20px;
color:#ffffff;
text-align:center;
margin-bottom:20px;
}
#whitestripebutton{
width:250px;
height:50px;
background:#4397b1;
border:3px solid #ffffff;
margin-left:22px;
font-family:Salina;
font-size:20px;
color:#ffffff;
text-align:center;
margin-bottom:20px;
}
#whitestripesubbutton{
width:250px;
height:50px;
background:#a7d3de;
border:3px solid #ffffff;
margin-left:22px;
font-family:Salina;
font-size:20px;
color:#ffffff;
text-align:center;
margin-bottom: 20px;
}
#whitestripefooter{
width:250px;
height:40px;
background:#4397b1; margin-left:22px;
font-family:Salina;
font-size:20px;
color:#ffffff;
text-align:center;
margin-bottom:20px;
}
}
</style>
<div id='whitestripefullwidth'>
<div id='authorimage'></div>
<div id='whitestripetext'>Subscribe to our newsletter to get the latest updates to your inbox. </div>
<div><form action="http://feedburner.google.com/fb/a/mailverify" method="post"
target="popupwindow"
onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=witsub', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input id='whitestripebutton' type="text" name="email" placeholder='Enter Your Email' />
<input type="hidden" value="witsub" name="uri"/>
<input type="hidden" name="loc" value="en_US"/>
<div><input id='whitestripesubbutton' type="submit" value="Submit" /></div>
</form>
</div>
<h3 id='whitestripefooter'>We Promise No Spam... </h3>
</div> |
- Replace “witsub” with your feedburner name.
That’s all friends………
Hi. I am interested in blogging.And sometimes play with webdesign,web development,domain sale,designing logo and more.
;){kind=link}
0 comments :
Post a Comment