Wix text-till-tal — lägg till AI-röstberättelse med anpassad kod
Ge din Wix blogg, företagswebbplats eller Wix Studio projicera en lyssningsklar upplevelse med GSpeechBesökare kan leka i naturen Wix AI-röst berättarröst på inlägg och sidor medan ljud genereras och cachas i GSpeech Cloud Console - Inga API-nycklar krävs, och ingen TTS-belastning på Wix-hosting.
Den här guiden visar hur man lägg till text till tal i Wix: klistra in anslutningskoden med Wix anpassad kod (eller anpassad HTML) före , placera helsides-/knapp-/cirkelspelare med en anpassad HTML-inbäddning och mappa sedan Innehållsväljare och Render element så att spelaren läser blogginlägg, servicesidor och Om-sidor korrekt.
Wix anpassad kod TTS — webbplatsomfattande inbäddning via Inställningar → Anpassad kod, eller anpassad HTML per sida.
Molnljudgenerering — syntetisera en gång, cachelagra och spela upp över besök.
Inga API-nycklar krävs — hantera röster och spelare från en konsol.
Obegränsade anpassade widgetar — separat berättarröst för bloggar, servicesidor och Studio-layouter.
Bäst för: Wix-bloggar, lokala företagssajter och Wix Studio-marknadsföringssidor där du vill ha AI-röst på inlägg, tjänstebeskrivningar och om-text – utan att bygga en anpassad TTS-backend.
Skapa en webbplats — om du inte har lagt till en webbplats än, följ skapa en webbplats.
Öppna webbplatsen — gå till din instrumentbräda och välj Wix-webbplatsen.
Kopiera Wix-koden — öppen Integrationer → Wix och kopiera anslutningskoden.
Klistra in före — ange koden via Wix anpassad kod (Inställningar → Anpassad kod) eller en anpassad HTML-inbäddning före avslutningen tagga och publicera sedan.
Anslutningskoden laddas GSpeech på varje sida där den finns. Spelare visas bara där du placerar monteringar / anpassad HTML och bara när matchande widget är publicerad och konfigurerad.
Kartläggningsmodell
Wix anpassad kod, widgetar och innehållsmappning
På Wix, GSpeech hårdkodar inte en spelare till ett textblock. Du kopplar Anpassad kod en gång och mappar sedan varje widget till den RTF-text eller det avsnitt du vill ha uppläst:
1Anslutningskod
Laddar motorn via Wix Custom Code. Utan den förblir anpassade HTML-monteringar tomma.
2Anpassad widget
Instrumentpanelkonfiguration: röst, språk, design, innehållsinställningar, URL-regler för blogg- kontra företagssidor.
3Montera / Anpassad HTML
En markör på Wix-sidan (till exempel .gsp_full_player) där spelarens användargränssnitt visas.
4Innehållsmappning
Innehållsväljare = vilken Wix-text som ska läsas. Render element = där spelaren visas. Exkludera / Titel / URL:er förfinar matchningen.
Obegränsad widgets — separata widgetar för helsida, knapp eller cirkel för blogginlägg, servicesidor och Studio-layouter.
Obegränsat antal spelare per widget — en publicerad widget kan driva varje matchande anpassad HTML-montering som tillåts av Render Element + URL-regler.
Anpassad HTML / inbäddning — på Wix ser monteringen ut så här <div class="gsp_full_player"></div>På WordPress använder samma idé kortkoder som [gspeech].
Standardvärden kontra avancerade — standardmonteringar fungerar snabbt. Anpassade Wix-sektioner behöver exakta värden för Content Selector / Render Element.
Spelare
Lägg till spelare med Wix Custom HTML
Placera någon av dessa fästen där spelaren ska visas på sidan (Anpassad HTML / inbäddad). Klicka på ett kort för att kopiera. Ställ sedan in widgeten. Render element till samma klass.
I widgeten Innehåll flik, pekselektorer vid Wix rich-text och section wrappers som besökare ska höra – vanligtvis blogginlägg, servicetext och om-sektioner.
id → # / klass → . - t.ex id="main" → #main; class="wix-rich-text" → .wix-rich-text.
Samla bitar — Innehållsväljaren accepterar flera mål, kommaseparerade.
Trimma bitar — Exclude List använder samma prefix + kommatecken.
definierar vilken text som läses uppAnvänd CSS-selektorer, kommaseparerade. Exempel på Wix-liknande markup:
.wix-rich-text, .blogginläggsinnehåll, [data-testid="richTextElement"] — vanliga Wix-textomslag.
.wix-rich-text,.blogginläggsinnehåll,#mitt_id — flera mål i ett fält.
förälderklass — läs den överordnade omslaget till monteringen (användbart när anpassad HTML finns inuti ett textblock).
självklass — läs samma omslag som fästet sitter i.
Lämna tomt om du använder Innehållstext istället (fast text, inte DOM-innehåll).
RE
Render element
definierar där spelarens användargränssnitt injicerasDet måste matcha ett verkligt element på Wix-sidan.
För anpassade HTML-monteringar, sätt den till mount-klassen: .gsp_full_player, .gsp_knappspelare, eller .gsp_cirkel_spelare.
Du kan också rikta in dig på layoutbehållare som kropp, en Wix-sektionsklass eller en blogginnehållsomslutare när du inte använder en dedikerad montering.
Om Innehållsväljaren är korrekt men ingenting visas, är Render Element vanligtvis fel eller saknas på den sidan.
RP
Rendera position
Placerar spelaren Innan or Efter Render Element-innehållet. För en dedikerad monterings-div fungerar After/Before vanligtvis fortfarande relativt till den noden — håll monteringen tom och låt widgeten fylla den.
EX
Uteslut lista
Väljare som måste inte bli upplästa, även om de sitter i Innehållsväljaren. Samma # / . regler, kommaseparerade. Exempel: .share-buttons,.related-posts,.wix-comments,.no-speech.
TT
Titelväljare / Titeltext
Titelväljare — dynamisk titel från sidan (exempel: h1 eller en Wix-rubrikomslag).
Titeltext — fast titel visas i spelaren. Lämna titelväljaren tom när du använder titeltext.
CT
Innehållstext
Valfri fast berättartext. När den används kan Innehållsväljaren förbli tom. Användbar för korta reklamavsnitt på Wix-företagssidor när DOM-text inte ska driva ljud.
Tumregel för Wix: Innehållsväljaren pekar på den RTF-text du vill ska läsas upp, Render Element pekar på den anpassade HTML-monteringen och Exclude List hoppar över kommentarer, delningsfält och remsor för relaterade inlägg.
Exempel
Praktiska mappningsexempel för Wix-bloggar och företagssidor
Exempel A
Wix blogginlägg med helsidesspelare
En blogginläggstext och en anpassad HTML-montering under titeln:
Uteslut lista - .share-buttons,.related-posts (Tillval)
Titelväljare - h1 (Tillval)
Exempel B
Servicesida — montera inuti RTF (parent_class)
Om anpassad HTML finns i ett Wix-textavsnitt på en tjänstesida kan Content Selector vara relativ:
Innehållsväljare - parent_class (läser föräldern till fästet)
Render element - .gsp_full_player
Använda self_class när själva monteringsomslaget innehåller texten som ska läsas upp.
Exempel C
Om- och Studio-sidor med widgeten One Button
Plats .gsp_button_player på Om-sidor och upprepade Studio-layouter. Widget med enknappsspelare och renderingselement .gsp_button_player kan driva dem alla. Lägg bara till fler widgetar när röst, väljare eller URL-regler måste skilja sig åt.
Välj webbplatsen — öppna Wix-webbplatsen du anslöt till.
Lägg till ny widget — Widgetar → Lägg till ny widget → välj typ (Fullständig spelare, Knapp, Cirkel, …) → Skapa.
Konfigurera innehåll — ange innehållsväljare, renderingselement, undantagslista och titlar för blogg- eller företagssidor.
Konfigurera spelare / Design — röst, paneler, tema, bredd, marginaler.
Publicera och lyssna — ställ in Status till Publicerad, uppdatera Wix-sidan, testa uppspelningen.
När Wix-blogg- eller sidtext ändras kan Smart Audio Sync återskapa berättarröst i bakgrunden. Mappningsfält avgör fortfarande. som text och var spelaren lever.
FAQ
Vanliga frågor: Wix text-till-tal och anpassad kod
Stöder Wix text-till-tal och AI-röster med GSpeech?
Ja. GSpeech tillägger Wix text till tal med naturliga AI-röster för bloggar, företagswebbplatser och Wix Studio-sidor. Du ansluter via anpassad kod, placerar spelarmonteringar med anpassad HTML och hanterar röster i molnkonsolen – inga API-nycklar och ingen TTS-bearbetning på Wix-servrar.
Hur lägger jag till GSpeech-spelaren med Wix Custom Code?
Kopiera Wix-anslutningskoden från Integrationer → Wix i din dashboard. Klistra in den. Inställningar → Anpassad kod (eller anpassad HTML) så att den laddas före och publicera sedan. Lägg till en montering som t.ex. <div class="gsp_full_player"></div> på blogg- eller servicesidor och ställ in Render Element till samma klass.
Vad är Content Selector kontra Render Element på Wix?
Innehållsväljare berättar GSpeech vilken Wix-text som ska läsas upp – till exempel .wix-rich-text eller en blogginläggstext. Render element anger var spelaren ska visas — vanligtvis din anpassade HTML-monteringsklass. Om ljudtexten är fel, åtgärda Content Selector. Om spelaren saknas, åtgärda Render Element.
Kommer GSpeech-ljud att sakta ner min Wix-webbplats?
Nej. Ljud genereras och cachas i GSpeech molnet, inte på Wix-hosting. Anslutningsskriptet är lättviktigt och spelare laddas bara där du placerar fästen. Blogginlägg och företagssidor behåller normal Wix-prestanda medan besökare lyssnar på begäran.
Behöver jag API-nycklar för Wix AI-röstberättelse?
Nej. GSpeech is Inga API-nycklar krävs för Wix. Du loggar in på Cloud Console, klistrar in anpassad kod, konfigurerar widgetar och publicerar. Röster, språk och spelare hanteras på ett ställe utan tredjeparts TTS-nycklar på din Wix-webbplats.
Hjälp
Behöver du hjälp med att hitta selektorer för en Wix-layout eller inbäddning av anpassad kod?
Kontakta GSpeech-supportenSkicka en sid-URL så hjälper vi dig att mappa innehållsväljaren/renderingselementet.
