Pop up de suscripción

Aquí os dejo un código para que los visitantes se suscriban a vuestra web o blog, al insertar este código cuando alguien visite nuestra web se le mostrará un pop up similar a este:

Aquí os dejo el código, lo que esta en rojo los podéis cambiar a vuestro gusto:

<link rel=”stylesheet” href=”http://helperblogger.webs.com/colorbox-css-code-helperblogger.css” />

<style>

#subscribe {

font: 12px/1.2 Arial,Helvetica,san-serif;

color: #666;

height: 355px;

}

#subscribe a,

#subscribe a:hover,

#subscribe a:visited {

text-decoration: none;

}

.box-title {

color: #F66303;

font-size: 20px !important;

font-weight: bold;

margin: 10px 0;

border: 1px solid #ddd;

-moz-border-radius: 6px;

-webkit-border-radius: 6px;

border-radius: 6px;

box-shadow: 5px 5px 5px #CCCCCC;

padding: 10px;

line-height: 25px;

font-family: arial !important;

}

.box-tagline {

color: #999;

margin: 0;

text-align: center;

}

#subs-container {

padding: 35px 0 30px 0;

position: relative;

}

a:link, a:visited {

border: none;

}

.demo {

display: none;

}

</style>

<script src=’http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js’></script>

<script src=”http://helperblogger.webs.com/files/jquery.colorbox.js”></script>

<script type=”text/javascript”>

jQuery(document).ready(function(){

if (document.cookie.indexOf(‘visited=true’) == -1) {

var fifteenDays = 1000*60*60*24*7;

var expires = new Date((new Date()).valueOf() + fifteenDays);

document.cookie = “visited=true;expires=” + expires.toUTCString();

$.colorbox({width:”390px”, inline:true, href:”#subscribe”});

}

});

</script>

<!– This contains the hidden content for inline calls –>

<div style=’display:none’>

<div id=’subscribe’ style=’padding:10px; background:#fff;’>

<style> .home-featured-right {

background: url(http://demo.studiopress.com/balance/wp-content/themes/balance/images/dashes-bg.png) #d05353;

border: 5px solid #fff;

font-size: 16px;

margin: 0px;

width: 320px;

font-family: calibri;

}

.home-featured-right,

.home-featured-right p,

.home-featured-right h4.widgettitle {

color: #fff;

text-shadow: #a64242 -1px -1px;

text-align: center;

}

.home-featured-right p {

font-size: 16px;

margin-bottom: 20px;

}

.home-featured-right .widget {

margin: 35px;

}

.home-featured-right h4.widgettitle {

font-size: 26px;

margin-bottom: 20px;

}

.home-featured-right input[type=text] {

-moz-box-shadow: inset 0 1px 2px 1px #eee;

-webkit-box-shadow: inset 0 1px 2px 1px #eee;

background: #fff url(http://demo.studiopress.com/balance/wp-content/themes/balance/images/email-icon.png) no-repeat 16px 15px;

border-bottom: none;

border-left: 1px solid #963c3c;

border-right: none;

border-top: 1px solid #963c3c;

box-shadow: inset 0 1px 1px 1px #eee;

color: #000;

font-family: Verdana, Arial, Tahoma, sans-serif;

font-size: 12px;

padding: 14px 15px 14px 45px;

width: 180px;

}

#home-featured .home-featured-right input[type=submit] {

background: url(http://demo.studiopress.com/balance/wp-content/themes/balance/images/email-button.png) no-repeat !important;

border: none;

font-size: 0;

height: 28px;

margin: 0 0 0 15px;

line-height: 0;

text-indent: -9999px;

width: 26px;

}

#email-news-subscribe .email-box {

padding: 5px 10px;

font-family: “Arial”,”Helvetica”,sans-serif;

border-top: 0;

border-image: initial;

height: 35px;

margin-left: -20;

}

#email-news-subscribe .email-box input.email {

background: #FFFFFF;

border: 1px solid #dedede;

color: #999;

padding: 7px 10px 8px 10px;

-moz-border-radius: 3px;

-webkit-border-radius: 3px;

-o-border-radius: 3px;

-ms-border-radius: 3px;

-khtml-border-radius: 3px;

border-radius: 3px;

border-image: initial;

font-family: “Arial”,”Helvetica”,sans-serif;

}

#email-news-subscribe .email-box input.email:focus {

color: #333

}

#email-news-subscribe .email-box input.subscribe {

background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%);

background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#FFCA00),color-stop(1,#FF9B00));

background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%);

-pie-background: linear-gradient(270deg,#ffca00,#ff9b00);

font-family: “Arial”,”Helvetica”,sans-serif;

border-radius: 3px;

-moz-border-radius: 3px;

-webkit-border-radius: 3px;

border: 1px solid #cc7c00;

color: white;

text-shadow: #d08d00 1px 1px 0;

padding: 7px 14px;

margin-left: 3px;

font-weight: bold;

font-size: 12px;

cursor: pointer;

border-image: initial;

}

#email-news-subscribe .email-box input.subscribe:hover {

background: #ff9b00;

background-image: -moz-linear-gradient(top,#ffda4d,#ff9b00);

background-image: -webkit-gradient(linear,left top,left bottom,from(#ffda4d),to(#ff9b00));

filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ffffff,endColorStr=#ebebeb);

outline: 0;

-moz-box-shadow: 0 0 3px #999;

-webkit-box-shadow: 0 0 3px #999;

box-shadow: 0 0 3px #999

background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#ffda4d),color-stop(1,#ff9b00));

background: -moz-linear-gradient(center top,#ffda4d 0,#ff9b00 100%);

-pie-background: linear-gradient(270deg,#ffda4d,#ff9b00);

border-radius: 3px;

-moz-border-radius: 3px;

-webkit-border-radius: 3px;

border: 1px solid #cc7c00;

color: #FFFFFF;

text-shadow: #d08d00 1px 1px 0

}

</style>

<div class=”home-featured-right”>

<div id=”enews-2″ class=”widget enews-widget”>

<div class=”widget-wrap”>

<div class=”enews”>

<h4 class=”widgettitle”>Suscríbete y recibe contenido exclusivo</h4>

<p>Las últimas novedades del blog directamente a tu mail

</p>

<p>Prometo no spamearte</p>

<div id=”email-news-subscribe”>

<!– Email Subscribe –>

<div class=”email-box”>

<form action=”http://feedburner.google.com/fb/a/mailverify” method=”post”

target=”popupwindow” onsubmit=”window.openundefined’http://feedburner.google.com/fb/a/mailverify?uri=El-nombre-de-tu-blog‘, ‘popupwindow’, ‘scrollbars=yes,width=550,height=520′);return true”>

<input class=”email” type=”text” style=”width: 150px; font-size: 12px;”

id=”email” name=”email” value=”Tu email aquí…” onfocus=”if(this.value==this.defaultValue)this.value=&#39;&#39;;”

onblur=”if(this.value==&#39;&#39;)this.value=this.defaultValue;” />

<input type=”hidden” value=”El-nombre-de-tu-blog” name=”uri” />

<input type=”hidden” name=”loc” value=”en_US” />

<input class=”subscribe” name=”commit” type=”submit” value=”Suscribirme“

/>

</form>

</div>

</div>

</div>

</div>

</div>

</div>

<!– end .home-featured-right –>

<div style=”background: #fff;padding: 1px 8px 1px 3px;text-align: right;border-image: initial;font-size:10px;font-family: “arial”,”helvetica”,sans-serif;”> <!– Don’t remove –><span class=”author-credit” style=”font-family: Arial, Helvetica, sans-serif;”><a href=”http://goo.gl/vfQVM” target=”_blank” ></a></span></div></div>

</div>