Þessar leiðbeiningar lýsa Toimii eftir að þjónustan fer í loftið. Mælaborðið og innheimta eru ekki enn tiltæk — Toimii fer í loftið árið 2026.

Bæta sambandaformi við kyrrstæðar síður: Astro, Hugo, 11ty, Jekyll

Einn kóðabútur í útlitssniðmátið. Virkar í Astro, Hugo, 11ty, Jekyll, Gatsby, Bridgetown og öllum öðrum kyrrstæðum síðugeneratorum.

<script src="https://cdn.toimii.io/components/your-code.js" async></script>
<toimii-contact></toimii-contact>

Virkar þetta í raun?

Já — og kyrrstæðar síður eru hreinasta dæmið. Enginn viðbótarsandkassi, enginn ritill fjarlægir skript, engin áskriftarþrep. Tvær línurnar fara í útlitssniðmátið á sama hátt og þær færu í hvaða HTML-skrá sem er.

Skref fyrir skref

Opnaðu útlitssniðmátið þitt

Opnaðu útlitssniðmátið sem vefur hverja síðu — _layouts/default.html í Jekyll, src/layouts/Base.astro í Astro, layouts/partials/footer.html í Hugo, _includes/layout.njk í 11ty.

Límdu innfellingarkóðann

Límdu tvær línurnar úr Toimii-mælaborðinu þínu inni í <body>. Til að sýna formið aðeins á tilteknum síðum skaltu gæta sérsniðna einingamerkið með sniðmátatögun þíns generators (front matter-merki, síðuslóðarskoðun o.s.frv.); script-merkið getur verið í útlitinu.

Keyrðu þróunarþjóninn

Keyrðu þróunarþjóninn (npm run dev / hugo server / jekyll serve). Formið birtist strax — engar aukauppsetningar, engin viðbót, engin @types.

Smíðaðu og birtu

Smíðaðu og birtu eins og venjulega (Netlify, Vercel, GitHub Pages, S3 + CloudFront, hvar sem þú hýsir). Formið heldur áfram að virka — Toimii-CDN sér um restina.

Algeng gildrur

Flestar Markdown-birtarar kyrrstæðra síðna fjarlægja hrátt HTML að sjálfgefnu. Í Jekyll / 11ty / Hugo skaltu virkja hrát HTML eða líma innfellinguna í útlitsskrá í stað innihaldsskrár.
Hot reload endursetur stundum skriftið mörgum sinnum meðan á þróun stendur. Þetta er aðeins þróunarkvilli; smíðar í framleiðslu gefa frá sér merkið einu sinni á síðu.
Sum hýsingarþjónustur bæta við árásargjörnum Content-Security-Policy-hausana (Netlify og Vercel leyfa sérstillingu). Leyfðu cdn.toimii.io og api.toimii.io í script-src og connect-src.
Settu ekki kóðabútinn í <head>. Sérsniðna einingamerkið er body-stig merki — geymdu skriftið í <head> ef þú vilt (með async), en merkið verður að vera í <body>.

Oft spurð

Hvernig bæti ég þessu við í Astro?

Slepptu script-merkinu í grunnútlitseiningu þína (t.d. src/layouts/Base.astro) og notaðu sérsniðna eininguna í hvaða .astro-skrá sem er. Astro birtir óþekktar einingar sem venjulegt HTML — engin client-tilskipun þarf á sjálfa merkið.

Hvernig bæti ég þessu við í Hugo?

Bættu kóðabútnum við layouts/partials/footer.html (eða þar sem þú hleður sérsniðnum skriftum) og notaðu sérsniðna eininguna í innihaldsskrám, útlitssniðmátum eða shortcodes.

Hvernig bæti ég þessu við í 11ty (Eleventy)?

Bættu kóðabútnum við grunnútlitið (_includes/layout.njk í Eleventy-sjálfgefnum). Það á við um hverja síðu sem nær yfir útlitið. Kveiktu á hot-reload; þú sérð formið um leið og þróunarþjónninn smíðar aftur.

Hvernig bæti ég þessu við í Jekyll / GitHub Pages?

Bættu kóðabútnum við _layouts/default.html (eða útlitið sem þú velur). Notaðu sérsniðna eininguna í hvaða Markdown-færslu sem er með því að virkja html í Markdown-birtaranum.

Mun þetta hægja á smíðinni?

Nei. Skriftið hleðst á keyrslutíma, ekki smíðunartíma — smíðin gefur frá sér script-merki og vafrinn sækir raunverulegu eininguna þegar gestur fer á síðuna. Astro, Hugo, 11ty, Jekyll: allt óhaft.

Ert þú að fella inn á annan vettvang?

Sömu tvær línur af kóða, útfærðar fyrir hverja vettvang.

WordPress

Custom HTML-blokkur, blokkaritill eða klassískt. Engin viðbótauppsetning. Ein gildra — notandahlutverk þitt þarf unfiltered_html-heimild.

Lesa allar leiðbeiningar

Squarespace

Slepptu kóðablokk á hvaða síðu sem er. Krefst Core-áskriftar (2025-endurnefning á Business) eða hærri.

Lesa allar leiðbeiningar

Webflow

Code Embed-einingin ræður 50.000 stafi. Sérsniðinn kóði krefst Basic-áskriftar eða hærri. Birtu til að sjá.

Lesa allar leiðbeiningar

Wix

Wix sandkassast Embed-widget, þannig að við notum skiptaaðferð — skrift í Settings → Custom Code, merki í gegnum Embed a Widget. Heiðarleg leiðbeining.

Lesa allar leiðbeiningar

Shopify

Bættu Custom Liquid-hluta við hvaða þema sem er — engin forritauppsetning þarf. Slepptu greiðslugáttarsíðum nema þú sért með Shopify Plus.

Lesa allar leiðbeiningar

HTML / Sérsniðið

Venjuleg HTML-síða dugar. Opnaðu í hvaða textaritli sem er, límdu inn, vistaðu, hladdu upp. Þrjú skref og þú ert búinn.

Lesa allar leiðbeiningar

React / Vue / Angular

Notaðu sérsniðna einingamerkið beint í JSX, Vue-sniðmátum eða Angular-einingum. Engin hjúpunareining, enginn aukapakki.

Lesa allar leiðbeiningar

Tilbúinn að prófa?

30 daga ókeypis prufa. Ekkert kreditkort. Tilbúið á mínútum.

Ekkert kreditkort nauðsynlegt. Tilbúið á 2 mínútum.