Squarespace tekst-til-tale – AI-stemme via kodeinjeksjon
Skapere, coacher og porteføljeeiere kan legg til AI-stemme i Squarespace med GSpeechLever naturlig fortellerstemme på blogger, kurssider og casestudier mens lyd genereres i GSpeech Cloud Console - Ingen API-nøkler kreves, og ingen TTS-belastning på Squarespace-hosting.
Denne guiden viser Squarespace-kodeinjeksjon TTSlim inn innebygd kode i bunntekstkodeinjeksjon før , plasser helsides / knapp / ring rundt spillere med en Kodeblokk, deretter kartlegg Innholdsvelger og Gjengi element slik at spilleren leser riktig blogg- eller porteføljetekst.
Kodeinjeksjon + kodeblokkering — innebygging av bunntekst for hele nettstedet pluss tilpassede HTML-monteringer per side.
Skybasert lydgenerering — syntetisere én gang, mellomlagre og spille av på tvers av besøk.
Ingen API-nøkler kreves — stemmer og spillere fra én konsoll.
Widgeter klare for skapere — blogger, kurs og portefølje-casestudier med separate design.
Best for: Squarespace-blogger, coaching- og kurssider og portefølje-casestudier der besøkende bør lytte til tekst i lengre formater uten å forlate siden.
Lim inn før — sett inn koden via Innstillinger → Avansert → Kodeinjeksjon (Funntekst) før avslutningen tagg, lagre og publiser deretter.
Tilkoblingskoden lastes inn GSpeech på hver side der den er tilstede. Spillere vises bare der du plasserer monteringer med en kodeblokk / innebygging / tilpasset HTML, og bare når den matchende widgeten er publisert og konfigurert.
Kartleggingsmodell
Kodeinjeksjon, kodeblokker og innholdskartlegging
På Squarespace laster Footer Code Injection inn motoren én gang. Hver widget mapper deretter bloggblokker, kursdeler eller porteføljekopi til en Code Block-montering – uten å bake lyd inn i hvert sideoppsett:
1Tilkoblingskode
Laster inn motoren fra Footer Code Injection. Uten den forblir Code Block-monteringer tomme.
2Tilpasset widget
Dashbordkonfigurasjon: tale, språk, design, innholdsinnstillinger, URL-regler for blogger kontra porteføljer.
3Montering / Kodeblokk
En markør på siden (for eksempel .gsp_full_player) der spillerens brukergrensesnitt vises.
4Innholdskartlegging
Innholdsvelger = hvilken Squarespace-tekst som skal leses. Gjengi element = der spilleren vises. Ekskluder / Tittel / URL-er avgrenser treffet.
Ubegrensede widgets – separate helside-, knapp- eller sirkel-widgeter for blogger, kurs og porteføljeoppsett.
Ubegrenset antall spillere per widget – én publisert widget kan drive alle matchende kodeblokkmonteringer som er tillatt av Render Element + URL-regler.
Kodeblokk / Tilpasset HTML — på Squarespace ser monteringen slik ut <div class="gsp_full_player"></div>På WordPress bruker den samme ideen kortkoder som [gspeech].
Standard kontra avansert – standardmonteringer fungerer raskt. Tilpassede seksjoner trenger presise verdier for innholdsvelger/gjengivelseselement.
Spillere
Legg til spillere med kodeblokk / tilpasset HTML
Plasser et av disse festene der spilleren skal vises på siden (kodeblokk / innebygd / tilpasset HTML). Klikk på et kort for å kopiere. Deretter angir du widgeten. Gjengi element til samme klasse.
Tilordne Squarespace-blokker og bloggtekst til spilleren
I widgeten Innhold fanen, punktvelgere ved Squarespace-bloggelementer, blokkinnhold og porteføljeseksjoner som besøkende skal høre – plasser deretter spilleren med en kodeblokkmontering.
id → # / klasse → . — kopier fra Inspect; skriv dem med en hash eller en prikk i konsollen.
Samle bitene — Innholdsvelgeren godtar flere mål, kommaseparerte.
Trim stykker — Ekskluderingslisten bruker de samme prefiksene + kommaene.
definerer hvilken tekst som blir lest oppBruk CSS-selektorer, kommaseparert. Eksempler:
Artikkel, .sqs-blokk-innhold, .blogg-element-innhold, #side – les disse elementene.
artikkel,seksjon,#mitt_id,.min_klasse – flere mål i ett felt.
foreldreklasse — les den overordnede innpakningen til monteringen (nyttig for en kodeblokk plassert inne i en tekstseksjon).
self_class – les den samme innpakningen som festet sitter i.
La stå tomt hvis du bruker Innhold Tekst i stedet (fast tekst, ikke DOM-innhold).
RE
Gjengi element
definerer hvor spillerens brukergrensesnitt injiseresDet må samsvare med et ekte element på siden.
For tilpassede HTML-monteringer, sett den til monteringsklassen: .gsp_full_player, .gsp_knapp_spillereller .gsp_sirkel_spiller.
Du kan også målrette layoutbeholdere som kroppen, #sideeller .blogg-element-innhold når du ikke bruker et dedikert feste.
Hvis innholdsvelgeren er riktig, men ingenting vises, er gjengivelseselementet vanligvis feil eller mangler på den siden.
RP
Gjengi posisjon
Plasserer spilleren Før or Etter Render Element-innholdet. For en dedikert monterings-div fungerer After/Before vanligvis fortsatt i forhold til den noden – hold monteringen tom og la widgeten fylle den.
EX
Ekskluder liste
Velgere som må ikke bli sagt, selv om de sitter i Innholdsvelgeren. Samme # / . regler, kommaseparert. Eksempel: #comments,.sidebar,.ads,.no-speech.
TT
Tittelvelger / Titteltekst
Tittelvelger — dynamisk tittel fra siden (eksempel: h1).
Titteltekst — fast tittel vist i spilleren. La tittelvelgeren stå tom når du bruker titteltekst.
CT
Innhold Tekst
Valgfri, fast fortellertekst. Innholdsvelgeren kan stå tom når den brukes. Nyttig for korte kursinnledninger eller porteføljesammendrag når DOM-innhold ikke skal drive lyd.
Tommelfingerregel for Squarespace: Mål for innholdsvelger .blog-item-content or .sqs-block-content, Render Element retter seg mot Code Block-monteringen, og Exclude List hopper over kommentarer og delingsstrimler.
Eksempler
Praktiske kartleggingseksempler for Squarespace-blogger og -porteføljer
Eksempel A
Portefølje-casestudie med fullsidespiller
En casestudieside med brødtekstinnhold og en kodeblokkmontering under helten:
Innholdsvelger - .blog-item-content (eller tekstomslag for casestudien)
Gjengi element - .gsp_full_player
Ekskluder liste - .share-buttons,.related-posts (om du har)
Tittelvelger - h1 (om du har)
Eksempel B
Kursside — Kodeblokk i innhold (parent_class)
Hvis kodeblokkmonteringen er inne i en leksjonsseksjon i kurset, kan innholdsvelgeren være relativ:
Innholdsvelger - parent_class (leser forelderen til monteringen)
Gjengi element - .gsp_full_player
Bruk self_class når selve monterings-wrapperen inneholder teksten som skal leses opp.
Eksempel C
Blogginnlegg fra skaperen med én knapp-widget
Sted .gsp_button_player på mange blogginnlegg. One-button Player-widget med gjengivelseselement .gsp_button_player kan drive alle. Legg til flere widgeter bare når stemme-, design- eller URL-regler må være forskjellige for kurs- kontra porteføljesider.
Velg nettstedet – åpne Squarespace-nettstedet du koblet til.
Legg til ny widget — Widgeter → Legg til ny widget → velg type (Full avspiller, Knapp, Sirkel, …) → Opprett.
Konfigurer innhold — angi innholdsvelger, gjengivelseselement, ekskluderingsliste og titler for blogger eller porteføljer.
Konfigurer spiller / Design — stemme, paneler, tema, bredde, marginer.
Publiser og lytt — sett Status til Publisert, oppdater den aktive Squarespace-siden, test avspillingen.
Når blogg- eller porteføljetekst endres, kan Smart Audio Sync gjenopprette fortellerstemme i bakgrunnen. Kartleggingsfelt avgjør fortsatt. hvilken tekst og hvor spilleren lever.
FAQ
Vanlige spørsmål: Squarespace tekst-til-tale og kodeinjeksjon
Støtter Squarespace tekst-til-tale og AI-stemmer med GSpeech?
Ja. GSpeech legger Squarespace tekst til tale med naturlige AI-stemmer for blogger, kurssider og porteføljer. Du kobler til med kodeinjeksjon, plasserer spillere med en kodeblokk og administrerer alt i Cloud Console – ingen API-nøkler kreves.
Hvordan legger jeg til spilleren med kodeinjeksjon og en kodeblokk?
Kopier tilkoblingskoden fra Integrasjoner → Squarespace / Html-nettsted. Lim den inn. Innstillinger → Avansert → Kodeinjeksjon (Bunntekst) før På hver side som trenger lyd, legg til en Kodeblokk med et feste som f.eks. <div class="gsp_full_player"></div> og sett Render Element til den klassen.
Hva er Content Selector kontra Render Element på Squarespace?
Innholdsvelger velger hvilken Squarespace HTML som skal fortelles – for eksempel .blog-item-content or .sqs-block-content. Gjengi element velger hvor spilleren vises – vanligvis monteringsklassen for kodeblokken. Feil tekst betyr at innholdsvelgeren må fikses; manglende spiller betyr at renderelementet må fikses.
Vil GSpeech-lyd gjøre Squarespace-nettstedet mitt tregere?
Nei. Lyd genereres og mellomlagres i GSpeech skyen, ikke på Squarespace. Footer Code Injection-skriptet er lett, og avspillere lastes bare der du legger til kodeblokker. Blogger og porteføljesider beholder normal ytelse mens besøkende lytter på forespørsel.
Trenger jeg API-nøkler for å legge til AI-stemme i Squarespace?
Nei. GSpeech is Ingen API-nøkler kreves for Squarespace. Logg på Cloud Console, legg til kodeinjeksjon, konfigurer widgeter og publiser. Stemmer og avspillere forblir i én konto uten tredjeparts TTS-nøkler på nettstedet ditt.
Hjelp
Trenger du hjelp med å finne selektorer for et Squarespace-layout eller en kodeinjeksjonsinnebygging?
Kontakt GSpeech-støtteSend en URL til siden, så hjelper vi deg med å tilordne innholdsvelgeren/gjengivelseselementet.
