domingo, 28 de febrero de 2016

PONER CAJA DE SUSCRIPCIÒN AL FINAL DE LAS ENTRADAS.

En esta ocasiòn les traigo un còdigo que les puede servir para poner una caja personalizada de suscripciòn, ideal para poner al final de las entradas de tu blog.

La cual se verà asì: 




Lo ùnico que tienes que hacer es copiar este còdigo y pegarlo en un en el HTML cuando termines de redactar un post en tu blog para que se vea al final de tus entradas. 

Recuerda cambiar donde estàn las "equis" por tus nombres de usuario de redes sociales. Si quieres puedes ver el vìdeo donde te explico paso a paso còmo hacerlo AQUÌ.

<b:if cond="data:blog.pageType == &quot;item&quot;">
<style>
form.feedburner{
margin:20px 0 0;
display:block;
clear:both;
}
.dcstyle{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7MS9p6_zF25kroYXRd90pJY4nwjzC3djZA5mU1Kt6UT6tJUNyvHePpoydN23y9uA2lf8Cp9d_guiCiHo99aarK4wY1PfpvkOtNcx3UxSvIOtjmsni01zoeUi5nY5BdRJQSqkzMmm60I94/s400/email_icon.png) no-repeat scroll 4px center transparent;
padding:7px 15px 7px 35px;
color:#666;
font-weight:bold;
text-decoration:none;
border:1px solid #D3D3D3;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
.dcsubmit{
color:#666;
font-weight:bold;
text-decoration:none;
padding:6px 15px;
border:1px solid #D3D3D3;
cursor: pointer;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-goog-ms-border-radius: 4px;
border-radius: 4px;
background: #fbfbfb;
background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=&#39;#FBFBFB&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 );
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
}
#emailwidget-outer {
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
-goog-ms-border-radius: 10px 10px 10px 10px;
border-radius: 10px;
background: none repeat scroll 0 0 rgba(104, 249, 101, 0.34);
border: 1px solid #D3D3D3;
padding: 8px;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
width:480px;
}
#emailwidget-outer:hover{
background: none repeat scroll 0 0 #FFF;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
#emailwidget-outer td{
padding:3px 0;
}
</style>
</b:if><br />
<center>
<div id="emailwidget-outer">
<div class="separator" style="clear: both; text-align: center;">
</div>
<div id="emailwidget">
<table style="border: none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; width: 100%px;">
<tbody>
<tr style="border: none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
<td align="left" style="border: none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"><div style="font-size: 22px; font-weight: bold; margin: 0px 0px 5px;">
<span style="color: blue;">Suscríbete por E-mail</span></div>
<form action="http://feedburner.google.com/fb/a/mailverify" class="feedburner" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=XXXX', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow">
<input name="uri" type="hidden" value="XXXX" />
<input name="loc" type="hidden" value="en_US" />
<input class="dcstyle" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Ingresa tu e-mail&quot;;}" onfocus="if (this.value == &quot;Ingresa tu e-mail&quot;) {this.value = &quot;&quot;}" type="text" value="Ingresa tu e-mail" />
<input alt="" class="dcsubmit" title="" type="submit" value="Suscribirme" />
</form>
</td>
<td style="border: none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;"><div style="font-size: 14px; font-weight: bold; margin: 0px 0px 5px;">
o sígueme en:</div>
<a href="https://www.youtube.com/user/XXXXX"><img border="0" height="43" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhau6iJj918DyyKsknZY69oEjXNCuT9i6g7TDMGbCtfVuf1Nu8FFhkNk300_y6e8WSjPAJ7zjEnfabZ6YO2NcTnz2jen_Ep9Xt2gXC5LTdeYxgJZ9-2MoJRGX2zu9XRUiJ0D5ygqrZtZffm/s200/you.png" width="30" /></a>
<a href="https://twitter.com/XXXXX"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVo12GYzzeHz339H4UbMYoy-bMTEDts-0AElA9_Df-qNy9MsBelAb1C-HIaE-oe7LPwftPEuQgiisz-XXkjlcHQh4jUJe82U0FGvBWDUwAS3GfgowhaDL2kXkZJO0ZrZHlZrUYI7u-nYY/s1600/twitter-30%C3%9743.png" /></a>
<a href="https://www.facebook.com/pages/XXXXX/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEa0yCitkGvSyANwNAVNRnVqlNfAgELEtJPGqpijZhBt-2yw6rrRBvi7fbCzFUo0BScdFqWDUcHCDPJDvqtvaNrCOUv2t0y0r_moM73MOdntrid6uUsb70Gq00bK74RMZQEbSTlxYoZQI/s1600/facebook-30%C3%9743.png" /></a>
<a href="https://plus.google.com/u/0/XXXXX"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilEVxmkejREhX7mg0k-dpmgXLDAUNkeRLK1LxkYT1rEK4rmlRFtwJAY9cCbqddZcPNPDPFQU9ZqFtxcHYswUbSU2oUCC89DYyJlEsyoSQGBFwk-IkSJwZ60to35eDiZzXS9guaFKBndRM/s1600/googleplus-30%C3%9743.png" /></a>
</td>
</tr>
</tbody></table>
<div align="center">
<span style="color: white; font-size: 8px; font-style: italic;"><span decoration="none" style="color: white;"></span></span></div>
</div>
</div>
</center>

No hay comentarios:

Publicar un comentario

GANA DINERO POR ACORTAR TUS ENLACES