<!--more--> y <a name="more"></a> en Blogger: uso correcto y cómo evitar errores
El uso de la etiqueta <!--more--> en Blogger ha sido una herramienta útil desde hace años para controlar cómo se muestra el contenido de una entrada en la página principal del blog. Sin embargo, esta funcionalidad, aunque sencilla, puede generar confusión técnica cuando se transforma automáticamente en <a name="more"></a> en el HTML publicado. En esta guía te explicamos de manera detallada qué significa esto, cómo evitar errores y cómo aprovecharlo para mejorar la experiencia de tus lectores y el SEO de tu blog.
¿Qué es <!--more--> y para qué sirve?
La etiqueta <!--more--> permite insertar un salto de contenido dentro de una entrada. Este salto separa la vista previa del contenido completo, mostrando solo un fragmento en la página principal o en las páginas de etiquetas, y reservando el resto para la página individual del post.
Cuando usas esta etiqueta en el editor HTML o mediante el botón de “salto de línea” del editor visual, Blogger transforma ese marcador en una ancla HTML: <a name="more"></a>. Esta conversión tiene implicaciones que vale la pena revisar si te preocupa la calidad del código o si estás optimizando para buscadores.
¿Por qué aparece <a name="more"></a> en el HTML?
Este marcador actúa como un punto de anclaje en el documento HTML. Es decir, le permite al navegador y a Blogger saber dónde continuar la lectura después de hacer clic en “Leer más”. Aunque esta práctica era común en versiones antiguas del HTML, actualmente el atributo name está en desuso y se recomienda usar id en su lugar.
Esto puede generar advertencias o errores en validadores modernos de HTML, o incluso problemas con ciertos temas o scripts personalizados que no interpretan correctamente la ancla sin un enlace directo.
¿Cómo evitar errores causados por <a name="more"></a>?
Si bien el marcador no causa errores funcionales en la mayoría de los blogs, puede resultar problemático si estás trabajando con plantillas personalizadas o estás buscando una validación estricta del código HTML. Aquí algunas soluciones:
1. Ocultarlo con CSS: Si deseas que el ancla no genere espacios visuales o interferencias, puedes aplicar un estilo específico:
a[name="more"] {
display: none;
}
2. Reemplazar el atributo name por id: Aunque Blogger lo genera automáticamente como name, puedes editar el HTML de la plantilla y asegurarte de que las referencias sean hacia un #more con id="more" para mantener compatibilidad con estándares actuales.
3. Mantenerlo como está si no hay conflictos: En muchos casos, puedes ignorarlo si no hay efectos negativos visibles ni errores SEO importantes.
Verificar y adaptar tu plantilla
Para que el botón de “Leer más” funcione correctamente, tu plantilla debe contener el siguiente fragmento después del contenido del post:
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"'><data:post.jumpText/></a>
</div>
</b:if>
Esto asegura que se muestre el enlace con el texto “Más información” o el texto personalizado que elijas. Puedes cambiar el contenido de <data:post.jumpText/> por una imagen o cualquier otro HTML personalizado.
Mejoras de diseño y personalización
El contenedor .jump-link puede estilizarse para adaptarse a la estética de tu blog. Puedes agregar en tu plantilla estilos como estos:
.jump-link a {
color: #0056b3;
text-decoration: underline;
}
.jump-link a:hover {
color: #ff6600;
}
Esto te da control total sobre cómo se ve y se comporta el botón de leer más, lo cual es clave para mejorar la experiencia del usuario y reducir la tasa de rebote.
Buenas prácticas de SEO con <!--more-->
El uso correcto del salto de contenido puede mejorar la navegación del blog, reduciendo el tiempo de carga inicial y aumentando las páginas vistas. Sin embargo, es importante mantener la coherencia semántica. Por ejemplo, asegúrate de que el contenido antes del salto sea representativo del tema del post y contenga algunas de las palabras clave principales.
Si estás trabajando con Blogger y deseas evitar problemas adicionales relacionados con las URL canónicas, puedes leer esta guía detallada: Evita la canonicalización en Blogger. Te ayudará a prevenir errores comunes que afectan la indexación de tu contenido.
Contenido de calidad antes y después del salto
Otro consejo importante es asegurarte de que el contenido previo al salto de línea tenga suficiente valor para enganchar al lector. Usa esta sección para introducir el tema, plantear una pregunta, o resumir los beneficios del post. Después del salto, desarrolla en profundidad la información.
Además, puedes complementar tu estrategia de contenido utilizando herramientas específicas para bloggers. En este artículo de Kolectiva se presentan opciones muy útiles: Herramientas esenciales para bloggers.
Resumen y recomendaciones finales
La etiqueta <!--more--> es una función sencilla pero poderosa en Blogger. Su transformación en <a name="more"></a> no debería causarte problemas si sigues buenas prácticas de plantilla y estilo. Con pequeños ajustes puedes mejorar la funcionalidad, evitar errores HTML y fortalecer la experiencia del usuario.
Recuerda revisar periódicamente el comportamiento de tus entradas, especialmente si estás usando plantillas personalizadas. Al cuidar estos detalles, no solo aseguras una mejor presentación visual, sino también una mayor eficacia en tu estrategia de SEO.
