flat ui subscription box for blogger

flat ui subscription box for blogger

Add Comment , , Edit

Hi friends in this post I am sharing free flat ui subscription box for blogger.We have already shared a flat subscription box for blogger. This subscription box have features like adding website logo,website name and website url.Also kindly check below subscription boxes.

free flat ui 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>
#fflatuifullwidth{
width:300px;
height:380px;
background:#ffffff;
border: 1px solid #cfcfcf;
}
#freeflatheader{
width:300px;
height:60px;
background:#263138;
margin-bottom:0px;
margin-top: -20px;
}
#ffhtitle{
padding-top:5px;
text-align:center;
font-family:Roland;
color:#ffffff;
}
#authorflat{
width:110px;
height:125px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikhUnQwOaJvCtIfXWozdnApJic-mrIeEaQsu8RiPgjevTac_R_Hhz8nBJlG0orBCPGDg6xkyaCujm2G1QLCQKAEHfjk1kJZ0OusnLjsKeV-RAsqAn7TC5s6jK1vSzwdNiv89lHR3nT20Q/s1600/author+copy.png) #4b70c5;
background-repeat:no-repeat ;
background-position: 3px 17px;
float:left;

margin-bottom:10px;
}
#afright{

float:right;
width:190px;
height:125px;
margin-bottom:10px;
background: #4b70c5;
}
#afrtitle{
font-family:WideLatin;
color:#ffffff;
margin-bottom:-15px;
}
#afrtitle2{
font-family:WideLatin;
color:#ffffff;
font-size:18px;
}
#ffuibutton{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjA2GiCCTJr_KA09z23ELT7DzYmNzDKbjFtHsUhywc1t7nNwlOiDMfNq7FelNJw45GFDr-hxyOdWVaYrBJGVnQKjvwCSbSzHEUvcP03oXwOKGenkgD329TLgQ7KZn5X9JgYJY8nARIIQBI/s1600/flatuimailicon.png) #ffffff ;
background-repeat:no-repeat ;
background-position:90%  ;
width:290px;
height:50px;
border: 1px solid #cfcfcf;
margin-left:5px;
margin-bottom:10px;
font-size:20px;
color: #4b4b4b;
padding-right:50px;

}
#ffuisubbutton{
width:290px;
height:50px;
background:#f4583f;
font-family:Gill Sans Ultra Bold;
font-size:20px;
color:#ffffff;
border: 1px solid #cfcfcf;
margin-left:5px;
margin-bottom:-5px;

}
#freeflatfooter{
width:300px;
height:70px;
background:#555555;

}
#freeflatfootertext{
font-family:Salina;
font-size:20px;
color:#ffffff;

text-align:center;
padding-top:20px;

}
</style>

<div id ="fflatuifullwidth">
<div id ="freeflatheader"><h2 id="ffhtitle">Subscribe Us</h2></div>

<div id = 'authorflat'></div>
<div id = 'afright' >
<h2 id = 'afrtitle'>Your Website Name</h2>
<h5 id = 'afrtitle2'>www.example.com</h5>
</div>
<div style =" background:#cfcfcf;">
<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">
            <div><input  id='ffuibutton' type="text" name="email" placeholder='Enter Your Email' /></div>
            <input type="hidden" value="witsub" name="uri"/>
            <input type="hidden" name="loc" value="en_US"/>
            <div><input id='ffuisubbutton' type="submit" value="Submit" /></div>
            </form>
            </div>
            <div>
            <div id = 'freeflatfooter'>
            <p id = "freeflatfootertext"> We Promise No Spam</p>
            </div>
            </div></div></div>

That’s all friends………..

Print Friendly and PDF
SHARE

About me

Hi. I am interested in blogging.And sometimes play with webdesign,web development,domain sale,designing logo and more.

    Blogger Comment
    Facebook Comment

0 comments :

Post a Comment

Subscribe to: Post Comments ( Atom )

Pages