Proximos Eventos

Proximos Eventos
Las fechas se publicaran mas adelante

ocultar la fecha de la entrada

Nos dirigimos a la pestaña Diseño.  Luego en Entradas del Blog hacemos click en editar

personalizar boton ir a pagina principal

Cómo Ponemos Una Imagen Para El Texto "Entradas Más Recientes" De Nuestro Salto De Línea. Paso A Paso.:


Los más creativos no se conformarán "sólo con texto". Si deseamos añadir una imagen, hay que seguir estos sencillos pasos:

1) Realiza una copia de seguridad de tu Blog siguiendo la guía para la que te he puesto el enlace. No te llevará más de dos minutos y si cometes cualquier error, simplemente podrás volver a tu copia de seguridad.

boton seguir leyendo

Si lo que quieres es poner un botón de ‘Leer mas’ curioso, llamativo…pues debes hacer lo siguiente.

Botones de “Seguir leyendo”

Lo primero de todo es encontrar el botón que quieras utilizar, busca uno que se adapte a tu blog y si no encuentras fabrica uno de tu cosecha, puedes utilizar Google Drive ‘crear dibujo’, paint, Power Point, Photoshop…. también tienes un montón por la red, aqui te dejo una colección de May de Creative Mindly y las Bloggeras Motivadas, son bastante variados y de muchos colores.
Además he creado unos poquitos por si os gustan:


entradas antiguas y recientes.


Entradas antiguas,recientes pagina principal


Personalizar los links Entradas antiguas, Entradas mas recientes

30 de julio de 2009 696 comentarios,
Los links del pie de navegación, o sea, esos que dicen Entradas antiguas - Entradas más recientes son de mucha utilidad para el lector pues facilita la navegación dentro del blog, sin embargo no siempre se ven muy atractivos, así que podemos personalizarlos para poner otro texto o sustituirlos con algún ícono.

Entra a Plantilla | Edición de HTML, y busca esto:
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl + &quot;?max-results&quot; ' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>

La parte que está en color rojo es la que muestra el texto Entradas más recientes, puedes eliminarlo y poner cualquier otro texto, o bien, cambiarlo por una imagen, sólo tendrías que sustituir lo que está en rojo por esto:
<img src='URL de la imagen'/>

Ahora buscamos un poco más abajo y encontramos este código:
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>

Este es el que muestra el link de Entradas antiguas. Haremos lo mismo que en el anterior cambiando lo que está en color rojo.

Y por último encontramos abajo este código:
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link' expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>

Este es el que muestra el texto Página principal, igual se cambia lo que está en rojo por otro texto o imagen.

Aquí les dejo unos íconos que encontré que pueden usar.

icon left home icon right icon
left icon home icon right icon
left icon home icon right icon
previous icon home icon next icon
icon icon icon
  

boton de volver

Tener un botón que nos mande al contenido anterior puede hacer más fácil la navegación a nuestros lectores, ya que con sólo un click pueden volver a la página que estaban viendo sin necesidad de subir y usar los botones del navegador.
La colocación es bastante sencilla, prácticamente es sólo un paso:

Vamos a Plantilla | Edición de HTML y buscamos esta línea:
<!-- feed links -->
Debajo de ella pegamos lo siguiente:
<script>function goBack() {window.history.back()}</script>
<button onclick="goBack()">Regresar</button>
Guardamos los cambios y damos click en el título de un post para ver el resultado. El botón de atrásquedará abajo de los posts, si quieres puedes moverlo de lugar y colocarlo donde más te guste. Incluso, sino quieres moverle a la plantilla sólo pega el código al final de cada post.

Si lo deseas, también puedes usar un enlace de texto en lugar del botón:
<script>function goBack() {window.history.back()}</script>
<a href onclick="goBack()">Regresar</a>

El resultado lo puedes ver aquí mismo dando click a cualquiera de las dos opciones:

Regresar


Regresar

 





Personalizar Títulos de Gadgets  

Para personalizar los títulos de los gadgets vamos a Plantilla ( o Tema )  → Personalizar → Avanzado → Añadir CSS y pegamos el siguiente código (recuerda que si tienes otro código allí sólo tienes que dar un par de intros antes de pegar el siguiente código) 

.sidebar h2{ /**Adornar el título del gadget*/
background: #cccccc; /*Color de fondo*/
border-top: 1px solid #000000; /**Borde Superior**/
border-bottom: 1px solid #000000; /**Borde Inferior**/
border-left: 1px solid #000000; /**Borde Izquierdo**/
border-right1px solid #000000; /**Borde Derecho**/
text-align: center; /**Texto centrado**/
}

Una vez pegas el código, los títulos de todos  los gadgets aparecerán así:


Para Cambiar:

♥ Lo que está en Rojo: Son los colores (Fondo y Líneas) en hexadecimal.
♥ Lo que está en Verde: Es el ancho de la línea (si la quieres más ancha, aumenta el valor)
♥ Lo que está en Azul: Es el tipo de Línea
♥ Lo que está en morado: es para centrar los títulos, si no los quieres centrados solo tienes que borrar esta línea del código. 

Tipos de Líneas

Azul ; 2E64FE

eliminar con la tecnologia

Porque lo de ". Con la tecnología de Blogger." sale siempre por defecto. 

Nunca está de más, cuando vamos a toquetear el HTML hacer una copia de la plantilla antes por si acaso, pero en este caso es tan tan tan fácil que me atrevo a decir que ni os hace falta.

Vamos allá:

✎ Plantilla

✎ Edición de HTML

✎ Continuar

✎ Y con Ctrl + F, buscamos:

Attribution

✎ Y veremos esto:


✎ Entonces:

A) En la línea en la que sale la palabra Attribution dos veces:

Donde dice locked='true'

Quitamos true y ponemos false

Dejamos todo lo demás igual. Es decir, el false tiene que ir entre comas

B) Ya que estamos, en la línea anterior:

Donde dice al final showaddelement='no'

Quitamos el no y ponemos yes.

Lo mismo, sólo esa palabra, todo lo demás igual.

✎ Tendréis que tener esto:


✎ Guardar plantilla

✎ Y Cerrar

Y ya está.

Si ahora váis al gadget de Attribution otra vez... Editar...


Voilá. Nos aparece la opción Eliminar.

Ahora si le damos a Eliminar, ya no sale nada abajo ;)

¿Veis que guay?

tutorial para acortar las entradas en pagina principal

En ocasiones nos parece que una entrada resulta demasiado larga para colocarla de forma íntegra y nos parece más interesante poner sólo una parte de la misma a modo de aperitivo, de manera que quién esté interesado pueda acceder a la información completa a través del típico "Leer más".

Esta función se realiza en Blogger de una forma muy sencilla. Una vez estemos en la edición de nuestra entrada debemos colocar el cursor en el sitio dónde queramos cortar la entrada y pinchar en "Insertar salto de línea", es decir en el folio fragmentado que nos ofrecen los iconos principales (ver imagen, 1). Arriba a la derecha al lado de despues del enlace, insertar video y una carita esta el icono