CSS-väljare talar om för TTSWP vilka delar av ditt inlägg som ska eller inte ska berättas. Använd dem när den enklare metoden med "no-audio class" inte räcker till, eller när du vill ha webbplatsomfattande undantag utan att redigera varje inlägg.
Två typer av väljare
Inkluderingsväljare
Som standard berättar TTSWP hela inläggets innehållsyta. Om ditt tema lindar in huvudartikeln i en specifik behållare (som .article-body eller #main-content) kan du begränsa uppläsningen till just den behållaren.
Exempel:
.article-body
Endast text inuti element som matchar .article-body läses upp. Allt utanför den behållaren ignoreras.
Lämna fältet tomt för att behålla standardinställningen (hela inläggets innehåll).
Uteslutningsväljare
Varje element som matchar en uteslutningsväljare tas bort från texten innan generering. Allt inuti dessa element tas också bort.
Flera väljare, en per rad:
.wp-caption
figcaption
.sidebar
.widget-area
.ad-container
Vanliga uteslutningsexempel
Kopiera och klistra in dessa i din uteslutningslista om de stämmer för ditt tema.
Bildtexter
.wp-caption
figcaption
.caption
Sidopaneler och widgetar
.sidebar
#secondary
.widget-area
.elementor-sidebar
Annonser
.ad-container
.advertisement
.ads
[data-ad]
.google-auto-placed
Kommentarer
.comments-area
#comments
.comment-list
Relaterade inlägg och nyhetsbrevsprenumerationer
.related-posts
.yarpp-related
.mailchimp-signup
.newsletter-form
Brödsmulor och metainformation
.breadcrumbs
.post-meta
.entry-meta
.author-box
Avkorta efter
Använd Avkorta efter när du vill stoppa uppläsningen vid en specifik punkt i inlägget. Allt från den första matchningen och framåt tas bort innan ljudet genereras. Det här är praktiskt för att klippa bort fotnoter, referenslistor eller författarrutor som finns inuti huvudinnehållsytan och är svåra att omsluta med en enda CSS-klass.
Så här ställer du in det
- Gå till Text till tal - Inställningar för CSS-väljare.
- Scrolla till kortet Avkorta efter.
- Ange en sträng per rad. Spara.
- Regenerera ljudet på valfritt inlägg.
Matchningsregler
- Skiftlägesokänslig delmatchning mot den renderade inläggs-HTML:en.
- Du kan ange vanlig text eller HTML-kod. Till exempel matchar
<strong>Fotnoter<\/strong>bara när Fotnoter är fet, medanFotnotermatchar alla förekomster på sidan. - Ange flera strängar om du vill ha flera möjliga avskärningspunkter. Den tidigaste matchningen i inlägget vinner.
Exempel
Avkorta vid en fet rubrik för fotnoter:
<strong>Fotnoter<\/strong>
Avkorta vid den första av flera möjliga markörer:
<h2>Referenser<\/h2>
<strong>Om författaren<\/strong>
Uteslutningsväljare vs. Avkorta efter
- Använd Uteslutningsväljare när det du vill hoppa över är inlindat i en ren klass eller ett ID (sidopanel, annons, widget).
- Använd Avkorta efter när du vill klippa bort allt nedanför en markör och det saknas en ren behållare att rikta in sig på.
Båda körs före syntesen, så de påverkar bara ljudet, inte den synliga sidan.
Hur du hittar rätt väljare
Öppna ditt inlägg på fronten och använd webbläsarens inspektör (F12, klicka sedan på elementet).
Leta efter:
- Ett klassattribut (börjar med
class="...") - blir.klass-namn - Ett ID-attribut (börjar med
id="...") - blir#id-namn - En vanlig tagg - blir bara taggnamnet (
figcaption,aside)
Välj den mest specifika väljaren som ändå fångar allt du vill utesluta. Om du har flera liknande element, använd en klass eller tagg.
Testa dina väljare
Efter att du sparat väljare:
- Öppna valfritt inlägg med ljud.
- Gå till Inlägg - Alla inlägg.
- Klicka på ikonen Regenerera.
- Spela upp det nya ljudet.
Om oönskat innehåll fortfarande visas matchade inte din väljare. Öppna webbläsarens inspektör, bekräfta klassen eller taggen och försök igen.
Begränsningar
- CSS-väljare körs före syntesen på det råa inläggsinnehållet
- De påverkar inte den synliga sidan - bara texten som skickas till ElevenLabs
- Komplexa väljare fungerar (
.widget-area aside > .title), men håll dem enkla för enklare underhåll