En este tutorial vamos a crear una tabla de contenidos en WordPress e insertarla automáticamente en nuestros post o sidebar con el plugin Table of Contents Plus, es una técnica muy útil y sirve para crear un índice del contenido de nuestros post parecido a la de wikipedia y como consecuencia mejora la usabilidad y el SEO de nuestra web.
La tabla de contenidos o índice en post mejora la usabilidad y el SEO.
La razón por la que usar una tabla de contenidos es que mejora la usabilidad ya que los usuarios pueden encontrar ordenado y en un solo lugar todo el contenido de un post como si fuera un índice y llegar al contenido haciendo clic en los enlaces internos.
Además de la usabilidad la tabla de contenidos también mejora nuestro SEO por que los enlaces generan interacción con nuestra web de forma parecida a la de un botón o llamada a la acción.
Table of Content Plus plugin para WordPress
La mejor forma para crear un índice o tabla de contenidos en WordPress es con el plugin Table of Content Plus.
Este plugin nos permite generar automáticamente un índice en todos nuestros post y páginas de forma fácil y como ya he dicho automática para cada post.
Table of content Plus también permite crear un mapa con índices de nuestro sitio web.
Las tablas de contenido se pueden insertar automáticamente, o usar un shortcode para colocarla en el lugar que queramos de nuestro WordPress.
Características del Table of Content Plus plugin de WordPress
- Permite crear tablas de contenido automáticamente.
- Permite crear un mapa del sitio con enlaces.
- Con shortcodes para activar o desactivar las tablas en post.
- Es un plugin gratuito.
- Esta traducido al español.
Instalación del plugin de WordPress Table of Content Plus
Instalar Table of Content Plus es igual y tan fácil como instalar cualquier otro plugin gratuito del repositorio de WordPress.
Podemos instalarlo directamente desde WordPress desde el menú principal Plugin > Añadir nuevo o descargar el archivo ZIP desde el repositorio de WordPress para subirlo por FTP.
Configuración del plugin Table of Content Plus
Vamos al menú de configuración de Table of content Plus que se encuentra en Ajustes > TOC+.
En este menú de configuración se encuentran tres pestañas:
Ajustes Principales: donde configuraremos la tabla de contenidos en WordPress.
Mapa del sitio: donde se configura una estructura con enlaces a modo de mapa de sitio.
Ayuda: Te redirige al blog del plugin Table of Content Plus.
Ajustes Principales de la tabla de contenidos
Table of Content Plus esta traducido totalmente al español y junto que sus opciones son sencillas de comprender hace que sea muy fácil configurar los ajustes principales.
Posición de la tabla de contenidos: Aquí podemos elegir donde se insertara la tabla de contenidos dentro de los post o páginas. Podemos elegir entre, antes o después del primer titular (H1, H2, H3 etc), o al principio o final del contenido.
Auto insertar para los siguientes tipos de contenido: Puedes elegir que solo los post tengan tabla de contenidos o desactivar todas las casillas y incrustar la tabla con un shortcode que veremos más adelante.
Texto del encabezado: En este apartado personalizamos el título de la tabla de contenidos y el texto para Ocultar o Mostrar la tabla.
Mostrar jerarquía: Si esta activada se crea una sangría en el índice para diferenciar los sub niveles de la tabla de contenidos en WordPress.
Numerar la lista de elementos: la tabla de contenidos de los post estará organizada con números.
Habilitar el efecto de scroll suave: Al pulsar en la tabla de contenidos en WordPress se ira al contenido de una manera menos brusca con un efecto de desplazamiento en vez de un salto directo al contenido.
Cambiar la apariencia de la tabla de contenidos en WordPress
En el apartado “Apariencia” de la pestaña “Ajustes principales” del menú de Table of Content Plus podemos encontrar las configuraciones que nos permiten cambiar los colores de la tabla de contenidos, los links, el fondo y los bordes.
Ancho: cambia el ancho de la tabla de contenidos en WordPress, lo puedes personalizar según ancho fijo, relativo, automático o definir directamente el número de pixeles.
Envoltura: hace que la tabla de contenidos en WordPress este rodeada por el texto del post.
Tamaño de fuente: cambia el tamaño de la fuente de la tabla de contenidos en WordPress.
Presentación: cambiamos los colores del fondo, borde, título, enlaces, enlaces al pasar el ratón y enlaces visitados.
Podemos elegir entre varios estilos predefinidos o crear en nuestro y si en el campo de elección del color ponemos una almohadilla # se usara el color del estilo de la plantilla.
Opciones Avanzadas de Table of Content Plus
En el apartado opciones avanzadas hay un par de opciones muy interesantes, sobre todo las que personalizan los links de los anclajes.
Minúsculas: las URL de los enlaces de la tabla de contenidos de WordPress estarán en minúsculas. Actívalas para hacer las URL mas amigables.
Usar guiones: cambia los guiones bajos por guiones medios de las URL de los anclajes de la tabla de contenidos. Como la opción anterior mejora el aspecto y integración de los enlaces haciéndolos más amigables.
Incluir portada: inserta la tabla de contenidos en la página de inicio de tu WordPress.
Excluir archivos CSS: ignora el estilo para la tabla de contenidos en WordPress y utiliza el estilo de enlaces de tu plantilla. En resumen la tabla de contenidos pierde el borde, el color de fondo y únicamente se crea una lista de enlaces con el estilo de tu plantilla.
Mantener los estilos de viñeta del tema: Muestra los puntos de la lista en la tabla de contenidos.
Niveles de titulares: Incluye los siguientes niveles de titulares. Desmarcar un titular lo excluirá
Generalmente excluye los títulos H1 de la lista si la usas en los post, ya que los temas de WordPress suelen colocar el título H1 en la parte superior de la página y si los incluyes en la lista, cuando los usuarios lo pulsen volverán arriba.
Excluir titulares: excluye los titulares de la tabla de contenidos de WordPress según las palabras que incluyan.
Es útil si tienes una zona de agradecimientos y no quieres que aparezca en el índice o si otro plugin crea títulos y aparecen en la tabla de contenidos de WordPress y los quieres quitar.
Espacio superior para navegación suave: si el menú de WordPress se queda fijado a la parte superior de la página, el título al que te desplazas mediante la tabla de contenidos queda oculto, para que esto no suceda puedes definir unos pixeles a modo de margen para que el desplazamiento se quede justo antes del título.
Restringir ruta: puedes definir una ruta para que las tablas de contenido en WordPress solo se generen en las páginas de esa ruta.
Ejemplo: si la URL de los post de tu blog es «www.tuweb.com/blog/categoria/mi-post» puedes poner en el campo de configuración la categoría así /categoría/ y las tablas solo se generaran para los post de esa categoría. Esto es muy útil para Wikis o páginas de informes.
Shortcodes del plugin Table of Content Plus.
Con el plugin Table of Content Plus podemos generar la tabla de contenidos automáticamente, pero también podemos usar un sencillo shortcode para insertarla en la parte que queramos de nuestra web.
[ toc ] : Genera la tabla de contenidos en la parte deseada de nuestra web.
[ no_toc ] : Desactiva la tabla de contenidos para la página o post donde lo insertes.
AVISO: los sortcodes anteriores tienen una separación antes y después del texto dentro de los corchetes para poder mostrarlos sin que se ejecuten, quita el espacio para que funcionen.
Crear un mapa del sitio con Table of Content Plus
Aunque la principal función de Table of Content Plus es crear índices en los post de nuestro blog también sirve para generar un mapa del sitio de nuestra web.
Este mapa del sitio está pensado para los usuarios y no es el sitemap que se utiliza en SEO específicamente para los robots de Google, Bing y demás buscadores aunque su función es parecida.
Podemos configurar el mapa en la pestaña “Mapa del Sitio” e insertarlo en una página con el shortcode «[ sitemap ]».
Es la forma más sencilla si queremos poner una página con nuestro mapa del sitio y luego agregarla al footer de nuestra web.
Puedes usar otros shortcodes para crear diferentes mapas:
[ sitemap_pages ] el mapa web solo listara las páginas.
[ sitemap_categories ] el mapa del sitio solo listara las categorías.
[ sitemap_posts ] el sitemap solo listara los post.
Puedes personalizar estos shortcodes con funciones especiales que encontraras en la página de ayuda del plugin.
Por ejemplo:
[ sitemap_categories no_label=»true» ] esconderá el título del sitemap
[ sitemap_pages heading=»6″ label=»Mapa de páginas» exclude=»1,15″ ] muestra el sitemap de las paginas, usando H6, el titulo será Mapa de páginas y excluye del mapa las paginas por ID 1 y 15.
AVISO: los sortcodes anteriores tienen una separación antes y después del texto dentro de los corchetes para poder mostrarlos sin que se ejecuten, quita el espacio para que funcionen.
Conclusiones
Crear una tabla de contenido en wordpress para los post es una mejora tanto en usabilidad como en SEO.
Los usuarios y los buscadores lo agradecerán ya que encuentran el contenido organizado y pueden acceder a él rápidamente.
Si una página de referencia en el SEO como Wikipedia usa tablas de contenido será por algo.
Por si Table of Content Plus no te funcionara te dejo aquí una alternativa que hace exactamente lo mismo plugin Easy Table of Contents.
También le puedes echar un vistazo al tutorial para crear un mapa del sitio para los buscadores y mejorar tu SEO, Tutorial Google XML Sitemaps.
¡Muy completo y útil! Gracias!
Gracias a ti por leerlo Vanessa.
Muy Articulo Gracias me sirvio!!!!
Hola Gerardo, gracias por el post, necesitaba un plugin para un post con mucho contenido y no sabía como ordenarlo, quería preguntarte, he instalado el plugin pero me aparecen los enlaces subrayados y queda un poco feo, ¿cómo se puede quitar la linea de subrayado? y ya de paso cambiarle el color de la fuente, si me puedes ayudar te lo agradecería. Muchas gracias!
Hola!
Si estas utilizando una plantilla, puedes buscar el estilo de los enlaces en las opciones y cambiarlos, si no tendrás que utilizar css para personalizar el indice.
Me parece genial.. Desde ya practicando. Gracias!
exelente artuclo, gracias
Excelente artículo: Pregunta..
Porqué en el listado que se genera aparece también listados los artículos relacionados?
Sabes alguna solución al respecto?
Muchas Gracias!
El listado se crea a partir de los títulos h2,h3,h4 etc.. que se pueden configurar en el plugin, si aparecen los artículos relacionados en el índice, puede se por que esten como h3 h4 etc..
Con la opción «excluir titulares» puedes escribir el titular que no quieras que se ponga en el índice, asi que ahi puedes poner «artículos relacionados», pero si tambien el titulo de los propios artículos relacionados aparecen en el índice, tendrás que modificar esos títulos y ponerlos como párrafo o como un nivel de título inferior como h5 h6 que no utilices en el post.
Un saludo!
El shortcode [toc] sin los espacios sirve para le plugin «Easy table of content» que parece el mismo pero no lo es creo.. Porque el shortcode que tu compartiste aquí no me funciono, pero al sacar los espacios y activar en la entrada el «Desactivar la inserción automática de la tabla de contenidos.» funciona correctamente. Ideal para cuando la inserción automática se superpone a una imagen o molesta en un lugar que no queda bien. Gracias por compartir esta entrada, un saludo cordial!
Hola Gerardo, gracias por tu ayuda. Instalé inicialmente el plugin de Easy Table Of Contents y aunque el nombre es parecido, nada que ver visualmente. Éste está genial, es fácil de instalar y puedes personalizar su apariencia. Muchas gracias 😉👋
Muchísimas gracias por tu publicación, me ha ayudado mucho,recién ahora estoy necesitando de un buen SEO para la redacción de mis artículos en un nuevo blog de perros y los artículos a veces llegan hasta 5 mil palabras, así que esto me va a ayudar mucho en los enlaces internos como a mejorar la experiencia de los lectores, gracias, saludos!