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 == "item"">
<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: "Trebuchet MS",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='#FBFBFB', endColorstr='#F4F4F4',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: "Trebuchet MS",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 == "") {this.value = "Enter your email…";}" onfocus="if (this.value == "Enter your email…") {this.value = ""}" 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
Comentarios (0)
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.
CerrarLuego utilice el codigo
[code] CODIGO HTML [/code]