Los selectores CSS le indican a TTSWP qué partes de tu publicación deben narrarse o no. Úsalos cuando el método simple de "clase sin audio" no sea suficiente, o cuando quieras exclusiones en todo el sitio sin editar cada publicación.
Dos tipos de selectores
Selectores de inclusión
De forma predeterminada, TTSWP narra toda el área de contenido de la publicación. Si tu tema envuelve el artículo principal en un contenedor específico (como .article-body o #main-content), puedes restringir la narración solo a ese contenedor.
Ejemplo:
.article-body
Solo se narrará el texto dentro de los elementos que coincidan con .article-body. Todo lo que esté fuera de ese contenedor se ignora.
Deja el campo vacío para mantener el valor predeterminado (todo el contenido de la publicación).
Selectores de exclusión
Cualquier elemento que coincida con un selector de exclusión se elimina del texto antes de la generación. Todo el contenido dentro de esos elementos también se elimina.
Varios selectores, uno por línea:
.wp-caption
figcaption
.sidebar
.widget-area
.ad-container
Ejemplos comunes de exclusión
Copia y pega estos en tu lista de exclusiones si aplican a tu tema.
Pies de imagen
.wp-caption
figcaption
.caption
Barras laterales y widgets
.sidebar
#secondary
.widget-area
.elementor-sidebar
Anuncios
.ad-container
.advertisement
.ads
[data-ad]
.google-auto-placed
Comentarios
.comments-area
#comments
.comment-list
Publicaciones relacionadas e inscripciones a boletines
.related-posts
.yarpp-related
.mailchimp-signup
.newsletter-form
Migas de pan e información meta
.breadcrumbs
.post-meta
.entry-meta
.author-box
Truncar Después
Usa Truncar Después cuando quieras detener la narración en un punto específico de la publicación. Todo lo que aparece desde la primera coincidencia en adelante se descarta antes de generar el audio. Esto es muy útil para eliminar notas al pie, listas de referencias o cajas de autor que están dentro del área de contenido principal y son difíciles de envolver en una sola clase CSS.
Cómo configurarlo
- Ve a Texto a Voz → Selectores CSS.
- Desplázate hasta la tarjeta Truncar Después.
- Ingresa una cadena por línea. Guarda.
- Regenera el audio en cualquier publicación.
Reglas de coincidencia
- Coincidencia de subcadena sin distinción entre mayúsculas y minúsculas contra el HTML renderizado de la publicación.
- Puedes ingresar texto simple o marcado HTML. Por ejemplo,
<strong>Notas al pie</strong>coincide solo cuando Notas al pie está en negrita, mientras queNotas al piecoincide con cualquier aparición en la página. - Ingresa varias cadenas si deseas múltiples puntos de corte posibles. La coincidencia más temprana en la publicación tiene prioridad.
Ejemplos
Cortar en un encabezado en negrita de Notas al pie:
<strong>Notas al pie</strong>
Cortar en el primero de varios marcadores posibles:
<h2>Referencias</h2>
<strong>Acerca del autor</strong>
Selectores de exclusión vs. Truncar Después
- Usa Selectores de exclusión cuando el elemento a omitir está envuelto en una clase o ID limpia (barra lateral, anuncio, widget).
- Usa Truncar Después cuando quieras cortar todo lo que aparece debajo de un marcador y no hay un contenedor limpio al cual apuntar.
Ambos se ejecutan antes de la síntesis, por lo que solo cambian el audio, no la página visible.
Cómo encontrar el selector correcto
Abre tu publicación en el front-end y usa el inspector de tu navegador (F12, luego haz clic en el elemento).
Busca:
- Un atributo de clase (comienza con
class="...") - se convierte en.nombre-de-clase - Un atributo de ID (comienza con
id="...") - se convierte en#nombre-de-id - Una etiqueta común - se convierte simplemente en el nombre de la etiqueta (
figcaption,aside)
Elige el selector más específico que aún capture todo lo que deseas excluir. Si tienes varios elementos similares, usa una clase o etiqueta.
Probar tus selectores
Después de guardar los selectores:
- Abre cualquier publicación con audio.
- Ve a Publicaciones → Todas las publicaciones.
- Haz clic en el ícono Regenerar.
- Reproduce el nuevo audio.
Si el contenido no deseado sigue apareciendo, tu selector no coincidió. Abre el inspector del navegador, confirma la clase o etiqueta e inténtalo de nuevo.
Limitaciones
- Los selectores CSS se ejecutan antes de la síntesis sobre el contenido sin procesar de la publicación
- No afectan la página visual, solo el texto enviado a ElevenLabs
- Los selectores complejos funcionan (
.widget-area aside > .title), pero mantenlos simples para facilitar el mantenimiento