En este tutorial veremos como agregar un Caja de Suscripción debajo de cada Entrada. Si quieres aumentar la cantidad de Lectores de Tu blog y que sigan volviendo a visitar tu blog de
bemos de Agregar una caja de Suscripción mas Botones de Redes Sociales


Antes de Comenzar veremos una Demostración:

Comencemos.

  • Paso 1: Vamos a Blogger>>Plantilla>>Edicion HTML>>Expandir Plantilla de Artilugios 
  • Paso 2: Buscamos la Siguiente linea (Ctrol + F)
<data:post.body/>
<div class='post-footer-line post-footer-line-1'/> 

  • Paso 3: Justo por debajo de  <data:post.body/> o  <div class='post-footer-line post-footer-line-1'/>  pegamos el siguiente codigo
<b:if cond="data:blog.pageType == &quot;item&quot;">
<style>
form.feedburner{
margin:20px 0 0;
display:block;
clear:both;
}
.JayRyanstyle{
padding:7px 15px 7px 5px;
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;
}
.JayRyan-email{
background:url(http://2.bp.blogspot.com/-oHGqJ1etW_M/UDRi0T2OkXI/AAAAAAAAAyw/voPqdzqf-F4/s1600/MBT+Stay+Connected+Email.png) no-repeat 0px 13px ;
width:300px;
padding:10px 0 0 55px;
float:left;
font-family: &quot;Trebuchet MS&quot;,sans-serif;
font-size:1.2em;
font-weight:bold;
margin:0 0 10px 0;
color:#686B6C;
}
.JayRyansubmit{
color:#666;
font-weight:bold;
text-decoration:none;
padding:6px 15px;
border:1px solid #c4c4c4;
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: 5px;
background: none repeat scroll 0 0 transparent;
border: 1px solid #c4c4c4;
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:auto;
margin:10px 0;
}
#emailwidget-outer td{
padding:3px 0;
}
</style>
</b:if><br />
<center>
<div id="emailwidget-outer">
<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="color: #333333; font-family: &quot;Trebuchet MS&quot;,sans-serif; font-size: 22px; font-weight: bold; margin: 0px 0px 5px 0px;">
Date de Alta para Obtener Actualizaciones Gratis!</div>
<div class="JayRyan-email">
Subscribe via Email
<br />
<form action="http://feedburner.google.com/fb/a/mailverify" class="feedburner" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=USERNAME', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow">
<input name="uri" type="hidden" value="MoreBlogTools" />
<input name="loc" type="hidden" value="en_US" />
<input class="JayRyanstyle" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email…&quot;;}" onfocus="if (this.value == &quot;Enter your email…&quot;) {this.value = &quot;&quot;}" type="text" value="Ingresa tu Email…" />
<input alt="" class="JayRyansubmit" title="" type="submit" value="Enviar" />
</form>
</div>
</td>
<td style="border: none; margin: 40px 0px 0px 0px; padding: 40px 0px 0px 0px;"><div style="color: #666666; font-size: 14px; font-weight: bold; margin: 0px 0px 5px 0px;">
Siguenos!</div>
<a href="http://feeds.feedburner.com/USERNAME" rel="nofollow" target="_blank" title="Suscribirte via RSS Feed"><img src="http://4.bp.blogspot.com/-oEZz_GqHL2M/UDRi3CHsScI/AAAAAAAAAzE/qWreXE68iYI/s1600/MBT+Stay+Connected+RSS.png" /></a>
<a href="http://twitter.com/USERNAME" rel="nofollow" target="_blank" title="Síguenos en Twitter"><img src="http://3.bp.blogspot.com/-cL30fvGY-dA/UDRi34t3MBI/AAAAAAAAAzM/zLP4j1qEN-k/s1600/MBT+Stay+Connected+TWITTER.png" /></a>
<a href="http://www.facebook.com/USERNAME" rel="nofollow" target="_blank" title="Síguenos en Facebook"><img src="http://2.bp.blogspot.com/-l3b6Kgx6Hgg/UDRi1LUyXEI/AAAAAAAAAy0/0q-yrdGS_HA/s1600/MBT+Stay+Connected+FACEBOOK.png" /></a>
<a href="https://plus.google.com/NUMERO%20DE%20ID" rel="nofollow" target="_blank" title="Síguenos en Google+"><img src="http://1.bp.blogspot.com/-aLsfVd69V_w/UDRi2Zsu5aI/AAAAAAAAAzA/KQVwQ-GBcVE/s1600/MBT+Stay+Connected+GOOGLE.png" /></a>
</td>
</tr>
</tbody></table>
<div align="right">
<span style="color: solid #ffffff; font-size: 8px; font-style: italic;"><a href="http://tutorialesblogger.blogspot.com.ar/" style="text-decoration: none;" target="_blank"><span decoration="none" style="color: #848484;">[Crea este Gadget]</span></a></span></div>
</div>
</div>
</center>
  • Paso 4: Guardamos los Cambios efectuados en nuestra Plantilla y listo a disfrutar de nuestra caja de Suscripciones 

Nota:- Nota solo debes de Cambiar USERNAM por los enlaces de tus Redes Sociales y NUMERO DE ID por en de Google+
- - 0 Comentarios
Tag

Comentarios (0)

:))
:((
:D
:(
:)
:-)
;)
=))
:p
=.=
==
^_^
/=he
:*
/=r
/=l
:v
/=ok
/=clap
(y)
(yy)
/=hi
/=j
/=hup
/=hd
/=hl
/=hr
/=s
<3

Instrucciones Para omentar

Incertar Enlace

Utilice el codigo <a href='LINK'> EJEMPLO </a>

Cargar Imagen

[img] LINK_ANH [/img] -Use el codigo para cargar una imagen.

Formato Word

<b> negrita </b>
<i> cursiva </i>
<u> texto subrayado </u>
<strike> texto tachado </strike>

Insertar un Fragmento de codigo

Primero use esta herramienta para codificar el codigo que quiera agregar.
Luego utilice el codigo [code] CODIGO HTML [/code]

Cerrar