Easy Table of Contents

Descripción

Un plugin fácil de usar, que te permite insertar una tabla de contenidos en tus entradas, páginas y tipos de contenido personalizados.

Características

  • Genera automáticamente una tabla de contenidos para tus entradas, páginas y tipos de contenido personalizados analizando el contenido para las cabeceras.
  • Compatible con la etiqueta <!--nextpage-->.
  • Compatible con el plugin Rank Math.
  • Works with the Classic Editor, Gutenberg, Divi, Elementor, WPBakery Page Builder and Visual Composer page editors.
  • Opcionalmente se puede activar para páginas y/o entradas. Se admiten los tipos de contenido personalizados, siempre que tu contenido se genere con la etiqueta de plantilla the_content().
  • Opcionalmente, puede insertar automáticamente el índice de contenidos en la página, seleccionable por el tipo de contenido activado.
  • Proporciona muchas opciones fáciles de entender para configurar cuándo y dónde insertar la tabla de contenidos.
  • Hay muchas opciones disponibles para configurar cómo aparece la tabla de contenido insertada que incluye varios temas incorporados. Si los temas suministrados no satisfacen tus necesidades, puedes crear los tuyos propios eligiendo tus propios colores para el borde, el fondo y el color del enlace.
  • Múltiples formatos de contador de viñetas entre los que elegir; ninguno, decimal, numérico y romano.
  • Elige entre mostrar la tabla de contenido de forma jerárquica o no. Esto significa que las cabeceras de menor prioridad estarán anidadas bajo cabeceras de mayor prioridad.
  • El usuario puede opcionalmente ocultar la tabla de contenidos. Tú tienes el control total de esta característica. Puede desactivarse y puedes elegir tenerlo oculto por defecto.
  • Compatible con el desplazamiento suave.
  • Activación o desactivación selectiva del índice de contenidos entrada por entrada.
  • Elige qué encabezados se usarán para generar la tabla de contenidos. Esto también se puede configurarse entrada por entrada.
  • Excluye fácilmente las cabeceras de forma global y entrada por entrada.
  • Si prefieres no insertar el índice en el contenido de la entrada, puedes usar el widget suministrado y colocar la tabla de contenidos en la barra lateral de tu tema.
  • Los widgets se pueden colocar o pegar en la página para que estén siempre visibles a medida que te desplazas por la página. NOTA: esta es una opción avanzada ya que cada tema es diferente, es posible que necesites el asesoramiento del desarrollador del tema para saber cuál es el selector de elementos correcto a utilizar en los ajustes para activar esta característica.
  • El widget resalta automáticamente las secciones actualmente visibles en la página. El color de realce es configurable.
  • Para el desarrollador con muchos ganchos de acción y filtros disponibles. Se pueden añadir más a petición en Github. Las solicitudes de pull son bienvenidas.

Ejemplos en vivo

Aquí hay enlaces a páginas de documentación de varias de las plantillas premium para el plugin Connections Business Directory plugin que utilizan el widget incluido con este plugin:

Hoja de ruta

  • Almacenamiento en caché de fragmentos para mejorar el rendimiento.
  • Improve SEO by adding options to add nofollow to TOC link and wrap TOC nav in noindex tag.
  • Improve accessibility.
  • Add Bullet and Arrow options for list counter style.

Reconocimiento

Easy Table Contents es una bifurcación del excelente plugin Table of Contents Plus de Michael Tran.

Capturas

  • La sección general de los ajustes.
  • La sección de apariencia de los ajustes.
  • La sección avanzada de los ajustes.

Instalación

Usando la búsqueda de plugins de WordPress

  1. Ve a la sub página Añadir nuevo en la página de plugins del escritorio.
  2. Busca easy table of contents.
  3. El plugin debería estar de primero en la lista de los resultados de búsqueda.
  4. Haz clic en el botón Instalar ahora.
  5. Finalmente, haz clic en el botón Activar para activar el plugin.

Subiendo a la administración de WordPress

  1. Descarga el archivo .zip del plugin y guárdalo en tu ordenador.
  2. Ve a la sub página Añadir nuevo en la página de plugins del escritorio.
  3. Haz clic en el botón Subir.
  4. Selecciona el archivo zip de «Easy Table of Contents» desde donde lo guardaste en tu ordenador.
  5. Haz clic en el botón Instalar ahora.
  6. Finalmente, haz clic en el botón Activar para activar el plugin.

Usando FTP

  1. Descarga el archivo .zip del plugin y guárdalo en tu ordenador.
  2. Descomprime el archivo zip de Easy Table of Contents.
  3. Crea una nueva carpeta llamada easy-table-of-contents en el directorio ../wp-content/plugins/.
  4. Sube los archivos desde la carpeta extraída en el paso 2.
  5. Activa el plugin en la página de administración de plugins.

FAQ

Vale, he instalado esto…. ¿qué hago ahora?

La primera parada debe ser la página de administración de la configuración de la tabla de contenido. Encontrarás esto en la opción de menú de ajustes.

La primera y única decisión que se requiere es la de decidir para qué tipos de contenido deseas activar la compatibilidad con la tabla de contenido. Por defecto es el tipo de contenido de páginas. Si el único lugar en el que planeas usar la tabla de contenido es en las páginas, no hay nada más que hacer en la página de ajustes. Para simplificar las cosas, recomiendo no cambiar ninguno de los demás ajustes en este momento. Muchos de los otros ajustes controlan cuándo y dónde se inserta la tabla de contenido y cambiar estos ajustes podría causar que no se muestre, lo que dificulta un poco más la tarea de empezar. Después de que te sientas cómodo con la forma en que esto funciona…. entonces haz los ajustes 🙂

Con eso quitado, asegúrate de leer la FAQ ¿Cómo se crean las tablas de contenido? para que sepas cómo se genera automáticamente la tabla de contenido. Después de haber configurado las cabeceras de página, o antes, de cualquier manera…. Desplázate hacia abajo en la página y verás una caja meta llamada «Tabla de Contenidos«, activa la opción Insertar_tabla de contenidos. y actualiza y/o publica tu página. El índice debe aparecer automáticamente en la parte superior de la página.

¿Cómo se crean las tablas de contenidos?

La tabla de contenido la generan las cabeceras que se encuentran en una página. Las cabeceras son las siguientes: <h1>,<h2>,<h3>,<h4>,<h5>,<h6> HTML tags. Si utilizas el editor visual de entradas de WordPress, estas etiquetas de encabezado se utilizan y se insertan en el mensaje cuando selecciona una de las opciones de encabezado desde el menú desplegable de formato . Cada encabezado que se encuentre en la página creará una tabla de contenido. He aquí un ejemplo que creará una tabla de contenidos que contiene los seis elementos.

<h1>Item 1</h1>
<h1>Item 2</h1>
<h1>Item 3</h1>
<h1>Item 4</h1>
<h1>Item 5</h1>
<h1>Item 6</h1>

También puedes crear una tabla de contenidos «anidada». Esto es difícil de explicar, así que voy a ilustrar la construcción sobre el ejemplo anterior. En este ejemplo se creará un índice de contenidos con los mismos seis elementos, pero ahora los tres primeros serán cada uno un elemento subordinado anidado debajo de él. La sangría no es necesaria, sólo se ha añadido con fines ilustrativos.

<h1>Item 1</h1>
    <h2>Item 1.1 -- Level 2</h2>
<h1>Item 2</h1>
    <h2>Item 2.1 -- Level 2</h2>
<h1>Item 3</h1>
    <h2>Item 3.1 -- Level 2</h2>
<h1>Item 4</h1>
<h1>Item 5</h1>
<h1>Item 6</h1>

Tampoco está limitado a un solo elemento anidado. Puedes añadir tantos como necesites. Incluso puede crear múltiples niveles anidados….

<h1>Item 1</h1>
    <h2>Item 1.1 -- Level 2</h2>
        <h3>Item 1.1.1 -- Level 3</h3>
        <h3>Item 1.1.2 -- Level 3</h3>
        <h3>Item 1.1.3 -- Level 3</h3>
    <h2>Item 1.2 -- Level 2</h2>
      <h3>Item 1.2.1 -- Level 3</h3>
      <h3>Item 1.2.2 -- Level 3</h3>
      <h3>Item 1.2.3 -- Level 3</h3>
    <h2>Item 1.3 -- Level 2</h2>
<h1>Item 2</h1>
    <h2>Item 2.1 -- Level 2</h2>
    <h2>Item 2.2 -- Level 2</h2>
<h1>Item 3</h1>
    <h2>Item 3.1 -- Level 2</h2>
    <h2>Item 3.2 -- Level 2</h2>
<h1>Item 4</h1>
<h1>Item 5</h1>
<h1>Item 6</h1>

Puedes anidar hasta 6 niveles de profundidad si es necesario. ¡Espero que esto te ayude a entender cómo crear y construir tu propio índice de contenido generado automáticamente en tus sitios!

Reseñas

1 de septiembre de 2020
Thanks for the plugin. I’ve a big request for you: 1) Add the ability to change the color of the text in the numbers of the table of contents (without changing the text of the heading). EXAMPLE in the table of content: Numbers in green color, headings in orange color. Thanks!!
4 de septiembre de 2020
Wonderful plugin with many features and settings! I really love it and will it use on every long post/page. But the documentation could be better. The description of how one can select to display the TOC on a page per page basis is hidden in the FAQs. (Scrolling to the end of the page, tick the checkbox for "Insert table of contents" AND save/publish the page. – Just to preview the page did not work for me and made me believe that the checkbox did not work.) From the reviews, I can see that I am not alone struggling with the functionality. People are hunting for a shortcode ([ez-toc]) in the SVN repository or de-install the plugin frustrated. This is a pity, as the plugin is really great!
4 de agosto de 2020
Terrific plugin, too bad I had to dig and hunt for the shortcode to display it. It is [ez-toc] Author mentions "it is not officially supported". Yet, I do not want to "auto" anything on pages with a ton of content - this can completely ruin the site. Thank you to the author for this amazing plugin, and please make the shortcode known to all.
20 de julio de 2020
Without the ability to manually insert the table of contents, I am uninstalling this plugin. I am sorry if I am missing something.
Leer todas las 100 reseñas

Colaboradores y desarrolladores

«Easy Table of Contents» es un software de código abierto. Las siguientes personas han colaborado con este plugin.

Colaboradores

«Easy Table of Contents» ha sido traducido a 11 idiomas locales. Gracias a los traductores por sus contribuciones.

Traduce «Easy Table of Contents» a tu idioma.

¿Interesado en el desarrollo?

Revisa el código , echa un vistazo al repositorio SVN o suscríbete al registro de desarrollo por RSS.

Registro de cambios

2.0.11 05/01/2020

  • COMPATIBILITY: Add support for the Uncode theme.
  • COMPATIBILITY: Do not run on WooCommerce pages.
  • DEV: Correct typo in phpDoc.

2.0.10 04/20/2020

  • TWEAK: Add trailing span to heading, to prepare for # option and to fix duplicate heading title matching.
  • TWEAK: Add second heading search/replace function to search for heading in content with heading html entities decoded. May help Beaver Builder users as it seems like it does not encode HTML entities as WP core does.

2.0.9 04/08/2020

  • TWEAK: AMP/Caching plugins seems to break anchors with colons and periods even though they are valid characters for the id attribute in HTML5.
  • TWEAK: Replace multiple underscores with a single underscore.
  • DEV: Update the UWS library which fixes the deprecation notice for PHP 7.4.
  • DEV: Add phpcs.xml.dist.
  • DEV: Strict type checks.
  • DEV: Inline doc updates.

2.0.8 04/03/2020

  • TWEAK: Convert <br /> tags in headings to a space.
  • TWEAK: Add additional widget classes.
  • TWEAK: Improve the sanitization of the excluded headings field post setting.
  • TWEAK: Minor optimization of creating the matching pattern for excluding headings for improved performance.
  • COMPATIBILITY: Exclude Create by Mediavine from heading eligibility.
  • BUG: Ensure excluded headings are removed from the headings array.
  • BUG: Ensure empty headings are removed from the headings array.

2.0.7 04/02/2020

  • NEW: Exclude any HTML nodes with the class of .ez-toc-exclude-headings.
  • TWEAK: Change smooth scroll selector from 'body a' to 'a.ez-toc-link'.
  • TWEAK: Declare JS variables.
  • TWEAK: Support unicode characters for the id attribute. Permitted by HTML5.
  • TWEAK: Move the in-page anchor/span to before the heading text to account for long headings where it line wraps.
  • TWEAK: Slight rework to ezTOC widget container classes logic.
  • TWEAK: Cache bust the JS to make dev easier.
  • TWEAK: JavaScript cleanup.
  • TWEAK: URI Encode the id attribute to deal with reserved characters in JavaScript. Technically not necessary for the id attribute but needed to work with the jQuery smoothScroll library.
  • COMPATIBILITY: Reintroduce filter to exclude Ultimate Addons for VC Composer Tabs from heading eligibility.
  • BUG: Correct array iteration logic when processing headings.
  • BUG: Tighten matching for headings in excluded HTML nodes. The loose matching was excluding far too many headings.
  • BUG: Use esc_attr() instead of esc_url() for the anchor href because valid id attribute characters would cause it to return an empty href which cause a nonworking link.

2.0.6 03/30/2020

  • BUG: Ensure minified files are current.

2.0.5 03/27/2020

  • BUG: Prevent possible «strpos(): Empty needle in» warnings when excluding nodes from TOC eligibility.

2.0.4 03/16/2020

  • NEW: Introduce the ez_toc_container_class filter.
  • TWEAK: Slight rework to ezTOC container classes logic.
  • BUG: sprintf() was eating % in the TOC heading item.
  • BUG: Do not insert TOC at top of post if before first heading option is selected even if first heading can not be found. Some page builders cause the TOC to insert twice or on blog pages.

2.0.3 03/12/2020

  • TWEAK: Slightly tighten heading matching, last update made it a little too loose.
  • BUG: Correct logic required to place TOC before first heading which is required for the more lax heading matching required for page builders.

2.0.2 03/12/2020

  • COMPATIBILITY: Remove filter to exclude Ultimate Addons for VC Composer Tabs from heading eligibility.
  • COMPATIBILITY: Add additional filters to improve Elementor compatibility.
  • TWEAK: Loosen heading matching when doing find/replace to insert in page links. Excluding the opening heading tag to allow matching heading where page builders dynamically add classes and id which break heading matching during find/replace.

2.0.1 03/09/2020

  • COMPATIBILITY: Exclude the WordPress Related Posts plugin nodes.
  • COMPATIBILITY: Exclude a couple Atomic Block plugin nodes.
  • COMPATIBILITY: Exclude JetPack Related Posts from heading eligibility.
  • COMPATIBILITY: Exclude Ultimate Addons for VC Composer Tabs from heading eligibility.
  • COMPATIBILITY: Exclude WP Product Reviews from heading eligibility.
  • TWEAK: Prevent possible «strpos(): Empty needle in» warnings when excluding nodes from TOC eligibility.

2.0 02/01/2020

  • NEW: Major rewrite of all code and processing logic to make it faster and more reliable.
  • NEW: Support for the