HTML-verkkosivuston teksti puheeksi — Upota tekoälyääni
HTML-integraatio
HTML-verkkosivuston tekstistä puheeksi — upota tekoälyääni yhdellä skriptillä
Kehittäjät ja tiimit käynnissä mukautettu HTML, staattiset sivustot tai muut kuin WordPress-sisällönhallintajärjestelmät voivat upota TTS-skripti kerran ja toimita luonnollinen mukautettu sivuston tekoälyääniGSpeechToisto ja synteesi tapahtuvat laitteen GSpeech Cloud Console - Ei vaadi API-avaimia, ei palvelinpuolen TTS-pinoa eikä ylimääräistä hosting-kuormitusta.
Tämä opas näyttää, miten lisää tekstiä puheeksi HTML-verkkosivustolle: liitä yksirivinen yhteyskoodi ennen , aseta koko sivun / painikkeen / ympyrän pelaajat mukautetuilla HTML-kiinnikkeillä ja sitten kartoita Sisällön valitsin ja Renderöintielementti asetteluluokkiin ja -tunnuksiin.
Yhden rivin upotus — liimaa ennen millä tahansa mukautetulla pinolla tai staattisella sivustolla.
Pilviäänen generointi — syntetisoi kerran, tallenna välimuistiin ja toista eri käyntien aikana.
Ei vaadi API-avaimia — äänet ja pelaajat yhdestä konsolista.
Valitsinpohjainen kartoitus — kohdista mihin tahansa artikkeliin, pääsisältöön tai mukautettuun asettelun kääreeseen.
Paras: kehittäjille, staattisille generaattoreille ja mukautetuille CMS-teemoille, joissa hallitset HTML:ää ja haluat yhden upotuksen sekä CSS-valitsimet mukautettuja asetteluja varten.
Luo verkkosivusto — jos et ole vielä lisännyt sivustoa, seuraa luoda verkkosivuston.
Avaa sivusto — mene luoksesi kojelauta ja valitse sivusto.
Kopioi HTML-koodi — avoin Integraatiot → HTML-verkkosivusto ja kopioi yhteyskoodi.
Liitä ennen — lisää koodi mallipohjaasi ennen sulkemista tunniste ja ota sitten käyttöön.
Yhteyskoodi latautuu GSpeech jokaisella sivulla, jolla se on läsnä. Soittimet näkyvät vain, mihin sijoitat kiinnityskohtia / mukautettua HTML:ää ja vain silloin, kun vastaava widget on julkaistu ja määritetty.
Kartoitusmalli
Upota skripti, liitokset ja valitsinmääritykset mukautetulle HTML:lle
Mukautetulla HTML-sivustolla yksi upotus lataa moottorin. Jokainen widget yhdistää sitten omat luokkasi ja tunnuksesi liitoskohtaan – joten säilytät täyden hallinnan asettelusta, kun taas kerronta pysyy Cloud Consolessa:
1Yhteyskoodi
Kuormittaa moottoria ennen Ilman sitä kiinnikkeet eivät tee mitään.
2Muokattu widget
Kojelaudan asetukset: ääni, kieli, ulkoasu, sisältöasetukset, URL-säännöt mille tahansa reitille tai mallille.
3Asenna / Mukautettu HTML
Sivusi HTML-koodissa oleva merkki (esimerkiksi .gsp_full_player), jossa soittimen käyttöliittymä näkyy.
4Sisällön kartoitus
Sisällön valitsin = mitä lukea. Renderöintielementti = missä pelaaja esiintyy. Sulje pois / Otsikko / URL-osoitteet tarkentavat osumaa.
Rajoittamaton määrä widgetejä — erilliset koko sivun, painikkeen tai ympyrän widgetit eri asetteluille, kielille tai malleille.
Rajoittamaton määrä pelaajia widgetiä kohden — yksi julkaistu widget voi pyörittää kaikkia Render Element + URL -sääntöjen sallimia vastaavia kiinnityksiä.
Mukautetut HTML-kiinnitykset — HTML-sivustoilla mount näyttää tältä <div class="gsp_full_player"></div>WordPressissä sama idea käyttää lyhyitä koodeja, kuten [gspeech].
Oletusasetukset vs. lisäasetukset — Oletusasennukset toimivat nopeasti. Yksilölliset mukautetut asettelut vaativat tarkat sisällönvalitsimen / renderöintielementin arvot.
Pelaajat
Lisää pelaajia mukautetulla HTML:llä
Aseta mikä tahansa näistä kiinnikkeistä kohtaan, johon haluat pelaajan näkyvän sivulla. Kopioi kortti napsauttamalla sitä. Aseta sitten widget. Renderöintielementti samaan luokkaan.
Widgetissä Sisältö välilehti, osoita valitsimia omistamiesi artikkelien, päätekstien tai mukautettujen kääreiden kohdalle — mihin tahansa CSS-valitsimeen, jonka merkinnät näyttävät.
CS
Sisällön valitsin
määrittelee mitä tekstiä puhutaanKäytä CSS-valitsimia pilkulla erotettuna. Esimerkkejä:
artikkeli, .post-content, #pääasiallinen, .mukautettu asettelu – lue nuo elementit.
artikkeli,osio,#oma_tunnus,.oma_luokka — useita kohteita yhdellä kentällä.
Jätä tyhjäksi, jos käytät Sisältöteksti sen sijaan (kiinteää tekstiä, ei DOM-sisältöä).
RE
Renderöintielementti
määrittelee mihin pelaajan käyttöliittymä ruiskutetaanSen on vastattava sivulla olevaa todellista elementtiä.
Mukautettuja HTML-liitäntöjä varten aseta se liitosluokkaan: .gsp_full_player, .gsp_painike_soitintai .gsp_ympyräpelaaja.
Voit myös kohdistaa asettelukontteja, kuten elin, #contenttai .article-header kun et käytä erillistä telinettä.
Jos sisällönvalitsin on oikein, mutta mitään ei näy, renderöintielementti on yleensä väärin tai puuttuu sivulta.
RP
Renderöinnin sijainti
Pelaajan paikat Ennen or Jälkeen Renderöintielementin sisältö. Omille mount-div-osioille After/Before-osiot toimivat yleensä edelleen suhteessa kyseiseen solmuun — pidä mount-osio tyhjänä ja anna widgetin täyttää se.
EX
Poissulje luettelo
Valitsimet, joiden on oltava emme voidaan puhua, vaikka ne olisivatkin sisällönvalitsimen sisällä. Pilkuilla erotettuna. Esimerkki: #comments,.sidebar,.ads,.no-speech.
Otsikon teksti — soittimessa näkyvä otsikko on kiinteä. Jätä otsikon valitsin tyhjäksi, kun käytät otsikkotekstiä.
CT
Sisältöteksti
Valinnainen kiinteä selostusteksti. Sisällönvalitsin voi pysyä tyhjänä, kun sitä käytetään. Hyödyllinen staattisille mainosblokeille, kun DOM-sisällön ei pitäisi ohjata ääntä.
HTML-sivustojen nyrkkisääntö: Sisällönvalitsin osoittaa hallitsemaasi kääreeseen (esimerkiksi article.post or #main), Renderöintielementti osoittaa kiinnitykseen ja Poissulkemisluettelo ohittaa navigoinnin, mainokset ja kommentit.
Esimerkit
Käytännön esimerkkejä mukautetuista HTML-asetteluista
Esimerkki A
Mukautettu asetteluartikkeli koko sivun soittimella
Staattinen tai CMS-mallipohjasi sisältää artikkelin ja mountin:
Poissulje luettelo - .share-buttons,.related-posts (Valinnainen)
Otsikon valitsin - h1 (Valinnainen)
Esimerkki B
Liitä CMS-sisältöalueen sisälle — parent_class
Jos mount-tiedosto sijaitsee mukautetun CMS-sisältöalueen sisällä, sisällönvalitsin voi olla suhteellinen:
Sisällön valitsin - parent_class (lukee vuoren vanhemman)
Renderöintielementti - .gsp_full_player
Käyttää self_class kun itse kiinnityskääre sisältää tekstin, joka tulisi lukea.
Esimerkki C
Staattiset sivustomallit yhdellä painikkeella varustetulla widgetillä
Paikka .gsp_button_player monissa staattisissa malleissa. Yhden painikkeen soitinwidget renderöintielementillä .gsp_button_player voi käyttää niitä kaikkia. Luo lisäwidgettejä vain, kun äänen, ulkoasun, valitsimien tai URL-sääntöjen on oltava erilaiset.
Kun sivun teksti muuttuu, Smart Audio Sync voi luoda kertojankerronnan uudelleen taustalla. Kenttien yhdistäminen ratkaisee edelleen joka teksti ja jossa pelaaja elää.
FAQ
Usein kysytyt kysymykset: HTML-verkkosivuston tekstin puheeksi upottaminen
Tukeeko HTML-verkkosivusto tekstistä puheeksi -toimintoa ja tekoälyääniä GSpeechin avulla?
Kyllä. GSpeech toimii millä tahansa HTML-sivustolla, staattisella generaattorilla tai mukautetulla sisällönhallintajärjestelmällä, johon voit liittää komentosarjan ennen Saat luonnollisia tekoälyääniä ja moderneja pelaajia ilman palvelinpuolen TTS-putken rakentamista.
Miten upotan GSpeech TTS -skriptin mukautetulle sivustolle?
Kopioi yhteyskoodi kohdasta Integraatiot → HTML-verkkosivusto. Liitä se kerran jaettuun mallipohjaasi ennen ja ota käyttöön. Lisää sitten kiinnitys, kuten <div class="gsp_full_player"></div> siinä asettelussa, johon pelaajan tulisi ilmestyä, ja aseta Render Element -arvoksi kyseinen luokka.
Mitä eroa on sisällönvalitsimella ja renderöintielementillä mukautetulla HTML-sivustolla?
Sisällön valitsin on mikä tahansa CSS-valitsin tekstille, jonka haluat puhuttavan — esimerkiksi #main, article.posttai sisällönhallintajärjestelmäsi kurssi. Renderöintielementti on kohta, johon pelaajan käyttöliittymä lisätään – yleensä liitosluokkasi. Koska hallitset merkintöjä, voit määrittää minkä tahansa mukautetun asettelun tarkasti.
Hidastaako GSpeech-ääni HTML- tai staattista sivustoani?
Ei. Synteesi ja välimuistiin tallennus tapahtuvat GSpeech pilvi. Upotus on kevyt asiakasskripti, ja soittimet latautuvat vain siellä, missä liittimet ovat olemassa. Hosting-palvelusi jatkaa normaalin HTML:n, CSS:n ja JS:n tarjoamista, kun taas kävijät kuuntelevat sitä pyynnöstä.
Ei. GSpeech is Ei vaadi API-avaimia HTML-sivustoille. Liitä upotus, määritä widgetit Cloud Consolessa ja julkaise. Ääniä ja soittimia hallitaan yhdeltä tililtä ilman kolmannen osapuolen TTS-avaimia koodikannassasi.
Apu:
Tarvitsetko apua valitsimien löytämisessä mukautetulle teemalle tai rakennustyökalun asettelulle?
Ota yhteyttä GSpeech-tukeenLähetä sivun URL-osoite, niin autamme sisällönvalitsimen / renderöintielementin kartoittamisessa.