Muchas de las opciones de Blogger son de relativa importancia, pero pocas como la división de las entradas, lo que hace esta opción es dividir la entrada en una introducción que se muestra en la portada y el texto en su totalidad en una pagina permanente. Todos hemos tenido esta opción, en algunas ocasiones la utilizamos aunque la mayoría de nosotros no la conocemos, la división de entradas puede ser útil sobre todo para limpiar la portada de material multimedia, ya que dicho contenido entorpece la carga rápida de cualquier blog, entre muchas otras ventajas que podemos considerar.

1. Cómo implementar la opción de división de la entrada

Por lo regular la división de entradas se agrega después de una introducción detallada de la entrada. Cuando se llegue al final del párrafo que queremos incluir en la portada, hacemos clic en el icono que se encuentra en la barra de menú en la forma Redactar, este icono se representa con una hoja rota, nombrado Insertar salto de linea, por lo que aparece una linea horizontal punteada de color gris que divide el texto principal, y el texto que se mostrara por completo en su enlace permanente.

Dentro del código fuente de la Edición de HTML se habrá introducido lo siguiente:

<!-- more -->

Con esto podremos asegurar que a nuestra entrada se le ha incorporado el texto "Mas información" bajo la introducción que hemos agregado en la portada del blog, un enlace que al ser pulsado nos llevara a leer la entrada completa, este enlace se puede editar, mas adelante veremos como hacerlo.

2. Cómo hacer una buena introducción

Las buenas introducciones pueden contener los siguientes puntos:

El resumen que nos dará a conocer de que se tratara la entrada completa.
Una imagen que nos dará una perspectiva mas detallada del contenido, esta se puede incluir a la derecha o bien a la izquierda del texto. Las imagenes mas grandes se pueden dejar para la entrada completa.
Frases atractivas que llamen la atención de nuestros lectores, que apelen a sus conocimientos.
Podría incluir una invitación final para seguir leyendo la entrada en forma total, así como información en forma de enlaces para quien no quiera leer la entrada en tu totalidad.
Se puede incluir todo lo necesario siempre que sea valido, desde mi punto de vista con la imagen e información detallada del contenido dará como resultado una buena introducción.

3. Personalizar el enlace Más información »

Ese enlace que agrega el texto, Más información » se puede editar, además si le asignamos un poco de CSS también se le puede cambiar el aspecto de manera notable.

Primero cambiemos el texto que se agrega por defecto, para cambiar el texto por el que nosotros queramos, entremos a Diseño y hacemos clic en Editar sobre el elemento Entradas del blog. Dentro cambiamos el texto porque el que nos paresca conveniente.

Para darle un mejor aspecto coloquemos algo de codigo CSS en nuetra plantilla, vamos a Plantilla y antes de ]]> peguemos el siguiente código que cambiara el aspecto del enlace.

.jump-link {  
float:right;  /* Posicion */  
background: #33aaff; /* Color de fondo */  
border: 1px solid #999999;  
font-weight: bold;  
padding: 1px 2px;  
}  

.jump-link a {  
color: #FFFFFF; /* Color del texto */  
text-decoration: none;  
font-weight: bold;  
}  

.jump-link:hover {  
background: #2288bb; /* Color de fondo al pasar el cursor */  
border: 1px solid #999999;  
text-decoration:none;  
}

Podemos cambiar los atributos que se muestran en el código, cambiar el color de fondo, o el color del texto, o bien el color que se mostrara al pasar el mouse por el enlace.

El resultado final sera el que se muestra en la siguiente imagen.

Para cambiar el texto que nos muestra por defecto por una imagen cualquiera, debemos sustituir una parte del código principal por el código de la imagen, entremos a Plantilla > Edición HTML > Expandimos los artilugios de la plantilla y buscamos lo siguiente dentro del código.

<data:post.jumpText/>

El texto anterior lo sustituimos por el siguiente.

Aquí cabe recordar que si optamos por agregar una imagen en lugar de texto borremos el código CSS si lo hemos agregado, de esta manera la imagen se visualizara de forma correcta.