Crear una tabla de contenidos automática con etiquetas de plantilla
En una plantilla HTML creada por ti puedes indicar qué encabezados deben aparecer en la tabla de contenidos. De esta forma, Laposta generará automáticamente la lista de enlaces a los artículos a medida que vayas rellenando el boletín.
Estas etiquetas solo sirven para una plantilla HTML importada. Si trabajas en el editor drag & drop, utiliza el bloque «Contenido»: ver Colocar enlaces internos para una tabla de contenidos en tu boletín.
Colocar la tabla de contenidos con <lp-toc>
Pon la etiqueta <lp-toc> en el lugar donde quieras que aparezca la tabla de contenidos. Allí se mostrará una lista con enlaces internos al contenido que está más abajo en el boletín.
La lista se genera como un elemento <table>, ya que varios programas de correo electrónico lo muestran mejor. El elemento <td> que contiene el enlace recibe la clase lp-toc-link, y el <td> que contiene la viñeta recibe la clase lp-toc-bullet.
Indicar los encabezados con el atributo lp-toc
En la tabla de contenidos solo puedes utilizar el texto de elementos singleline. Añade lp-toc a un singleline para incluir ese encabezado:
Si el singleline se encuentra dentro de un repeater, todos los singlelines que crees dentro de él se incluirán en la tabla de contenidos.
¿Quieres incluir varios grupos de singlelines, como los encabezados de la sección principal y los de una columna lateral? En ese caso, asigna un número al atributo. Los encabezados aparecerán siguiendo el orden de esos números.
Al rellenar el boletín, todavía podrás indicar para cada encabezado si debe incluirse o no en la tabla de contenidos.
Modificar la viñeta
Por defecto, delante de cada elemento aparece el código HTML •. Con estos atributos para <lp-toc> puedes modificar la viñeta y el espacio en blanco:
Una viñeta personalizada. Puede ser texto (por ejemplo, * o ‣), pero también la URL de una imagen. Laposta importará y alojará esa imagen.
Número para el relleno (padding) en píxeles en el lado izquierdo.
Número para el relleno (padding) en píxeles en el lado derecho.
Si utilizas una imagen como viñeta, indica aquí el ancho (como atributo width). Así podrás utilizar una imagen con una resolución mayor.
Una tabla de contenidos con una viñeta propia y espacio a ambos lados se ve así: