> ## Documentation Index > Fetch the complete documentation index at: https://docs.thunderphone.com/llms.txt > Use this file to discover all available pages before exploring further. # CDN / Script Tag > Pievienojiet ThunderPhone balss logrīku jebkurai tīmekļa vietnei bez pakotņu veidotāja CDN būvējums iekšēji ietver React, tāpēc varat izmantot logrīku statiskās vietnēs, WordPress, Webflow vai jebkurā lapā, kur varat pievienot HTML. Nav nepieciešams npm, būvētājs vai ietvars. ## CDN URL ```html Latest (recommended) theme={null} ``` ```html Pinned version theme={null} ``` URL ar `latest` ir tie, ko ģenerē informācijas paneļa iegulšanas koda fragmentu ģenerators. Tie tiek kešoti 5 minūtes un automātiski saņem jaunus stabilos laidienus. Piespraustie ceļi `/widget/vX.Y.Z/` ir nemaināmi un tiek kešoti ilgtermiņā -- ja piespraužat versiju, saskaņojiet to ar `@thunderphone/widget` npm laidienu, pret kuru izstrādājat. *** ## Pamatlietojums ```html theme={null}

``` Logrīks tiek pievienots mērķa elementam un tiek attēlots kā **fiksētas pozīcijas josla skata apgabala stūrī** (noklusējums ir `bottom-right`, ko nosaka opcija `position`). Pievienošanas elements ir tikai React saknes elements -- tā atrašanās vieta lapā neietekmē vietu, kur tiek parādīts logrīks. *** ## Pievienošanas opcijas `ThunderPhone.mount()` pieņem tās pašas opcijas kā React komponents, kā arī rekvizītu `element`: | Opcija | Tips | Obligāts | Noklusējums | Apraksts | | ---------------- | -------------------------------------------------------------- | -------- | ----------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `element` | `string \| HTMLElement` | Jā | -- | CSS atlasītājs (piemēram, `'#thunderphone'`) vai DOM elementa atsauce. | | `publishableKey` | `string` | Jā | -- | Publicējamā API atslēga (`pk_live_...`). Balss aģents tiek automātiski noteikts no atslēgas logrīka konfigurācijas. | | `theme` | `'light' \| 'dark'` | Nē | `'light'` | Krāsu shēma. | | `primaryColor` | `string` | Nē | `'#000000'` (gaišs) / `'#ffffff'` (tumšs) | CSS krāsas virkne, kas tiek izmantota kā akcenta krāsa. | | `title` | `string` | Nē | `'Voice assistant'` | Logrīka joslā parādāmais teksts. | | `position` | `'bottom-right' \| 'bottom-left' \| 'top-right' \| 'top-left'` | Nē | `'bottom-right'` | Fiksēta pozīcija skata apgabalā. | | `apiBase` | `string` | Nē | `'https://api.thunderphone.com/v1'` | API bāzes URL pārrakstīšana. | | `language` | `string` | Nē | -- | Valodas pārrakstīšana katrai sesijai -- valodas kods vai lokalizācija, piemēram, `en`, `es` vai `fr-FR`. Ja nav iestatīta, tiek izmantota balss aģenta konfigurētā valoda. | | `voice` | `string` | Nē | -- | Balss pārrakstīšana katrai sesijai -- balss nosaukums, piemēram, `maria`. Ja nav iestatīta, tiek izmantota balss aģenta konfigurētā balss. | | `context` | `string` | Nē | -- | Faktuāls lapas vai vietnes konteksts katrai sesijai, kas tiek nodots balss aģentam. Servera pusē saīsināts līdz 12 000 rakstzīmēm. | | `onConnect` | `() => void` | Nē | -- | Tiek izsaukts, kad tiek savienota balss sesija. | | `onDisconnect` | `() => void` | Nē | -- | Tiek izsaukts, kad sesija beidzas. | | `onError` | `(error) => void` | Nē | -- | Tiek izsaukts kļūdu gadījumā. Kļūdai ir lauki `error` (kods) un `message`. | | `ringtone` | `boolean \| string` | Nē | `false` | Savienojuma veidošanas laikā atskaņot zvana signālu. `true` noklusējuma zvana signālam vai URL virkne pielāgotam audio. | *** ## Tīrīšana `ThunderPhone.mount()` atgriež logrīka instanci ar tīrīšanas metodēm: ```html theme={null} ``` Gan `unmount()`, gan `destroy()` dara vienu un to pašu — tās atvieno jebkuru aktīvu balss sesiju un noņem logrīku no DOM. Izmantojiet to, kura jūsu kodā ir saprotamāka. Vienmēr notīriet logrīku, pārejot uz citu skatu vienas lapas lietojumprogrammās vai noņemot ietverošo elementu. Tas nodrošina, ka aktīvās balss sesijas tiek pareizi atvienotas. *** ## Piemēri ### Tumšais motīvs ar pielāgotu krāsu ```html theme={null}

``` ### Pielāgota pozīcija ```html theme={null}

``` ### Ar notikumu atzvaniem ```html theme={null}

``` ### Ar zvana signālu ```html theme={null}

``` ### Izmantojot DOM elementa atsauci ```html theme={null}

``` ### WordPress / CMS integrācija Pievienojiet šo pielāgota HTML blokam vai savas tēmas kājenei: ```html theme={null} ``` `

` var atrasties jebkur — tas ir tikai pievienošanas punkts. Pats logrīks tiek attēlots kā fiksēts pārklājums skata loga stūrī (to nosaka opcija `position`) un neiekļaujas apkārtējā satura plūsmā. *** ## Problēmu novēršana Pārliecinieties, ka ir ielādēti gan CSS, gan JS faili. Pārbaudiet pārlūkprogrammas konsoli, vai nav tīkla kļūdu. Pirms `ThunderPhone.mount()` izsaukšanas pārbaudiet, vai mērķa elements pastāv DOM. Skripts vēl nav ielādēts. Pārliecinieties, ka `