CSS Seçicileri

5 min read

CSS seçicileri, TTSWP'ye gönderinizin hangi bölümlerinin seslendirilip seslendirilmeyeceğini söyler. Daha basit "ses yok sınıfı" yöntemi yeterli olmadığında ya da her gönderiyi düzenlemeden site genelinde dışlamalar yapmak istediğinizde bunları kullanın.

İki tür seçici

Dahil etme seçicileri

Varsayılan olarak Metin Sese Dönüştürme - TTSWP, tüm gönderi içerik alanını seslendirir. Temanız ana makaleyi belirli bir kapsayıcıya (.article-body veya #main-content gibi) sardıysa, seslendirmeyi yalnızca o kapsayıcıyla sınırlayabilirsiniz.

Örnek:

.article-body

Yalnızca .article-body ile eşleşen öğelerin içindeki metin seslendirilir. Bu kapsayıcının dışındaki her şey görmezden gelinir.

Varsayılanı korumak (tüm gönderi içeriği) için alanı boş bırakın.

Dışlama seçicileri

Bir dışlama seçicisiyle eşleşen her öğe, oluşturma öncesinde metinden kaldırılır. Bu öğelerin içindeki her şey de kaldırılır.

Her satıra bir seçici olmak üzere birden fazla seçici girin:

.wp-caption
figcaption
.sidebar
.widget-area
.ad-container

Yaygın dışlama örnekleri

Temanıza uygulanıyorsa bunları dışlama listenize kopyalayıp yapıştırın.

Resim altyazıları

.wp-caption
figcaption
.caption

Kenar çubukları ve widget'lar

.sidebar
#secondary
.widget-area
.elementor-sidebar

Reklamlar

.ad-container
.advertisement
.ads
[data-ad]
.google-auto-placed

Yorumlar

.comments-area
#comments
.comment-list

İlgili gönderiler ve bülten kayıtları

.related-posts
.yarpp-related
.mailchimp-signup
.newsletter-form
.breadcrumbs
.post-meta
.entry-meta
.author-box

Sonra Kes

Sonra Kes özelliğini, seslendirmeyi gönderideki belirli bir noktada durdurmak istediğinizde kullanın. İlk eşleşmeden itibaren her şey, ses oluşturulmadan önce kaldırılır. Bu özellik, ana içerik alanında yer alan ve tek bir CSS sınıfıyla sarmalaması güç olan dipnotları, referans listelerini veya yazar kutularını kesmek için çok işe yarar.

Nasıl kurulur

  1. Metin Sese Dönüştürme - TTSWP → CSS Seçicileri bölümüne gidin.
  2. Sonra Kes kartına inin.
  3. Her satıra bir dize girin. Kaydedin.
  4. Herhangi bir gönderide sesi yeniden oluşturun.

Eşleştirme kuralları

  • Oluşturulan gönderi HTML'sine karşı büyük-küçük harfe duyarsız alt dize eşleşmesi yapılır.
  • Düz metin veya HTML işaretlemesi girebilirsiniz. Örneğin <strong>Dipnotlar</strong>, yalnızca Dipnotlar kalın yazıldığında eşleşirken Dipnotlar, sayfadaki herhangi bir görünümle eşleşir.
  • Birden fazla olası kesim noktası istiyorsanız birkaç dize girin. Gönderideki en erken eşleşme geçerli olur.

Örnekler

Kalın Dipnotlar başlığında kes:

<strong>Dipnotlar</strong>

Olası birkaç işaretin ilkinde kes:

<h2>Kaynaklar</h2>
<strong>Yazar hakkında</strong>

Dışlama Seçicileri ile Sonra Kes karşılaştırması

  • Atlama hedefi temiz bir sınıf veya ID ile sarmalanmışsa (kenar çubuğu, reklam, widget) Dışlama Seçicilerini kullanın.
  • Bir işaretin altındaki her şeyi kesmek istiyorsanız ve hedeflemek için temiz bir sarmalayıcı yoksa Sonra Kes özelliğini kullanın.

Her ikisi de sentezden önce çalışır; bu nedenle yalnızca sesi değiştirirler, görünür sayfayı değil.

Doğru seçici nasıl bulunur

Gönderinizi ön yüzde açın ve tarayıcınızın denetçisini kullanın (F12, ardından öğeye tıklayın).

Şunlara bakın:

  • Bir class özelliği (class="..." ile başlar) - .class-name olur
  • Bir ID özelliği (id="..." ile başlar) - #id-name olur
  • Yaygın bir etiket - yalnızca etiket adı olur (figcaption, aside)

Dışlamak istediğiniz her şeyi kapsayan en spesifik seçiciyi seçin. Benzer birden fazla öğeniz varsa bir sınıf veya etiket kullanın.

Seçicilerinizi test etme

Seçicileri kaydettikten sonra:

  1. Sesi olan herhangi bir gönderiyi açın.
  2. Gönderiler → Tüm Gönderiler bölümüne gidin.
  3. Yeniden Oluştur simgesine tıklayın.
  4. Yeni sesi oynatın.

İstenmeyen içerik hâlâ görünüyorsa seçiciniz eşleşmedi demektir. Tarayıcı denetçinizi açın, sınıfı veya etiketi onaylayın ve tekrar deneyin.

Sınırlamalar

  • CSS seçicileri, ham gönderi içeriğinde sentezden önce çalışır
  • Görsel sayfayı etkilemezler; yalnızca ElevenLabs'a gönderilen metni etkilerler
  • Karmaşık seçiciler çalışır (.widget-area aside > .title), ancak bakım kolaylığı için bunları sade tutun

İlgili sayfalar