Usamos cookies propias y de terceros para ofrecer info personalizada según su navegación. Si continua navegando consideramos que acepta el uso de cookiesOKMás información

Poner imagen en los títulos de los gadgets

tituloCómo poner imágenes de fondo en el título de ciertos gadgets.

La siguiente explicación nos servirá para cambiar cualquier titulo por imagen en cualquier gadget de nuestro blog.
Identificaremos el id del gadget. el cual queremos modificar, entraremos en Plantilla | Edición de HTML buscaremos el gadget que queremos modificar, lo puedes identificar por el título, por ejemplo Etiquetas, o Seguir por Email o cualquiera que sea el nombre del Gadget
<b:widget id='FollowByEmail1' locked='false' title='Seguir por Email' type='FollowByEmail'>
En este ejemplo el id del gadget es FollowByEmail1 Ya teniendo el id del widget, pega antes de]]></b:skin>
lo siguiente:
#FollowByEmail1 {background: url(URL de la imagen) left top;color: #000;}
Y así sucesivamente para todos los gadgets a los que queráis ponerle la imagen de fondo, sólo debes cambiar la URL de la imagen y en color cambiar el color del texto del título.Si lo prefieres también puedes cambiar todo el título por una imagen, sólo que en su lugar pegamos antes de
]]></b:skin>
esto:
#FollowByEmail1 {background: url(URL de la imagen) no-repeat top;height: 30px;}
De igual forma hay que cambiar la URL de la imagen, y en heigth poner el alto de la imagen.
Ahora en Diseño y en Editar
Busca el gadget al que le cambiaste el fondo y borra el título del gadget, en su lugar escribe esto:
&nbsp; 
Con esto eliminamos el texto del gadget, pon las imágenes que se adapten al estilo de tu plantilla.  ¿Has conseguido, añadir el truco?¿Te ha interesado?

tituloCómo poner imágenes de fondo en el título de ciertos gadgets.

La siguiente explicación nos servirá para cambiar cualquier titulo por imagen en cualquier gadget de nuestro blog.
Identificaremos el id del gadget. el cual queremos modificar, entraremos en Plantilla | Edición de HTML buscaremos el gadget que queremos modificar, lo puedes identificar por el título, por ejemplo Etiquetas, o Seguir por Email o cualquiera que sea el nombre del Gadget
<b:widget id='FollowByEmail1' locked='false' title='Seguir por Email' type='FollowByEmail'>
En este ejemplo el id del gadget es FollowByEmail1 Ya teniendo el id del widget, pega antes de]]></b:skin>
lo siguiente:
#FollowByEmail1 {background: url(URL de la imagen) left top;color: #000;}
Y así sucesivamente para todos los gadgets a los que queráis ponerle la imagen de fondo, sólo debes cambiar la URL de la imagen y en color cambiar el color del texto del título.Si lo prefieres también puedes cambiar todo el título por una imagen, sólo que en su lugar pegamos antes de
]]></b:skin>
esto:
#FollowByEmail1 {background: url(URL de la imagen) no-repeat top;height: 30px;}
De igual forma hay que cambiar la URL de la imagen, y en heigth poner el alto de la imagen.
Ahora en Diseño y en Editar
Busca el gadget al que le cambiaste el fondo y borra el título del gadget, en su lugar escribe esto:
&nbsp; 
Con esto eliminamos el texto del gadget, pon las imágenes que se adapten al estilo de tu plantilla.  ¿Has conseguido, añadir el truco?¿Te ha interesado?

Titulo del post en la pestaña del Navegador

Unknown
titulo


optimizar-los-post

Para que salga en la pestaña el titulo del post

Sólo hay que ir a Diseño > Edición de HTML y buscar al inicio de la plantilla esta estiqueta:









<title><data:blog.pagetitle/></title>


Y la remplazamos por esto:


<b:if cond='data:blog.homepageUrl == data:blog.url'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if>
titulo


optimizar-los-post

Para que salga en la pestaña el titulo del post

Sólo hay que ir a Diseño > Edición de HTML y buscar al inicio de la plantilla esta estiqueta:









<title><data:blog.pagetitle/></title>


Y la remplazamos por esto:


<b:if cond='data:blog.homepageUrl == data:blog.url'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if>

Optimizar los titulos en blogger modificando la plantilla

Unknown
titulo


plantilla-blog Optimizar los titulos en blogger ○
¿Como optimizar los títulos en blogger?
Accedemos a nuestra plantilla de la forma acostumbrada, y ayudados por nuestro buscador de códigos (CTRL+F) ubicamos esto

<head> 

justo después encontraremos éste código:  

<title><data:blog.pageTitle/></title>
el cual vamos a eliminar sustituyéndolo por éste:

<b:if cond='data:blog.pageType == &quot;item&quot;'><title><data:blog.pageName/>Aquí el título del blog</title><b:else/><title><data:blog.pageTitle/></title></b:if>


Con este cambio ya tendremos optimizado los títulos del blog. Espero que esta información les halla sido de utilidad.
titulo


plantilla-blog Optimizar los titulos en blogger ○
¿Como optimizar los títulos en blogger?
Accedemos a nuestra plantilla de la forma acostumbrada, y ayudados por nuestro buscador de códigos (CTRL+F) ubicamos esto

<head> 

justo después encontraremos éste código:  

<title><data:blog.pageTitle/></title>
el cual vamos a eliminar sustituyéndolo por éste:

<b:if cond='data:blog.pageType == &quot;item&quot;'><title><data:blog.pageName/>Aquí el título del blog</title><b:else/><title><data:blog.pageTitle/></title></b:if>


Con este cambio ya tendremos optimizado los títulos del blog. Espero que esta información les halla sido de utilidad.

Como Centrar el Titulo del Blog con un sencillo codigo

titulo
Desde la vista Principal del blog, iremos a Plantilla, luego Personalizar, en la siguiente pantalla Avanzado, CSS. en esta pantalla,
Pantalla Avanzado CSS






Pegaremos este código, si tuviéramos algún otro código, separaremos con un par de Intros.

.header .widget { text-align:center;}.header img {margin:0 auto;}

Y ya tendremos nuestra cabecera centrada.
titulo
Desde la vista Principal del blog, iremos a Plantilla, luego Personalizar, en la siguiente pantalla Avanzado, CSS. en esta pantalla,
Pantalla Avanzado CSS






Pegaremos este código, si tuviéramos algún otro código, separaremos con un par de Intros.

.header .widget { text-align:center;}.header img {margin:0 auto;}

Y ya tendremos nuestra cabecera centrada.