Nämä ohjeet kuvaavat Toimiita julkaisun jälkeen. Hallintapaneeli ja laskutus eivät ole vielä käytössä — Toimii julkaistaan vuonna 2026.

Näin upotat yhteydenottolomakkeen Wixiin (rehellinen ohje 2026)

Wix:n Embed-widget ajaa sandboxatussa iframessä — joten yksittäinen liittäminen ei toimi. Tässä jaettu menetelmä, joka toimii.

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

Toimiiko tämä oikeasti?

Kyllä — mutta vain jaetulla menetelmällä, Core-tilauksella tai uudemmalla.

Wix:n "Embed a Widget" -lohko ajaa sandboxatussa iframessä. Joulukuussa 2025 Wix tiukensi sandboxia poistamalla allow-same-origin-attribuutin — joten yksittäinen all-in-one-liittäminen ei enää toimi. Script-tagi latautuu iframen sisällä, jossa se ei näe Wix-sivusi DOM:ia, ja mukautettu elementti rekisteröityy väärään paikkaan.

Korjaus on jaettu menetelmä: laita script-tagi Settings → Custom Code -kohtaan (joka injektoituu suoraan Wix-sivullesi, EI iframen sisään), ja laita mukautettu elementtitagi <toimii-contact></toimii-contact> Embed a Widget -lohkoon. Script rekisteröi elementin vanhempisivulle, widget-lohko sijoittaa tagin, ja lomake renderöityy.

Vaihe vaiheelta

Avaa Settings → Custom Code

Mene Wix-koontinäytöstä kohtaan Settings → Custom Code (Advancedin alla). Huom — tämä vaatii Core-tilauksen ($17/kk) tai uudemman. Klikkaa + Add Custom Code.

Lisää script-tagi

Liitä vain script-tagi — kahdesta rivistä ensimmäinen: <script src="https://cdn.toimii.io/components/your-code.js" async></script>. Aseta "Add Code to Pages" arvoksi "All Pages" (tai vain sivu, jolle upotat lomakkeen). Aseta "Place Code in" arvoksi Body — start. Tallenna.

Lisää Embed a Widget -lohko

Avaa Wix-editori sivulle, jolle haluat lomakkeen. Klikkaa Add (+) → Embed Code → Embed a Widget. (EI Embed HTML — se on sandboxattu versio.) Pudota widget kohtaan, jossa lomakkeen tulisi olla.

Liitä mukautettu elementtitagi

Liitä widget-asetuksissa vain mukautettu elementtitagi — toinen rivi: <toimii-contact></toimii-contact>. Klikkaa Update.

Aseta widget-lohkon koko

Muuta widget-lohkon kokoa editorissa lomakkeen korkeuteen sopivaksi. Lomake itse renderöityy iframen ulkopuolella (Wix-sivullasi) — widget-lohko toimii sijoittelun ankkurina.

Julkaise ja katso live

Klikkaa Publish. Pelkkä Preview ei näytä lomaketta — Custom Code -säännöt ajavat vain tallennetuilla/julkaistuilla versioilla. Katso live-URL:a varmistaaksesi.

Vaadittu tilaus

Settings → Custom Code vaatii Core-tilauksen ($17/kk) tai uudemman. Ilmainen tilaus ja Light-tilaus voivat käyttää Embed a Widgetiä, mutta niistä puuttuu Custom Code, joten jaettu menetelmä ei toimi — sinun tulee päivittää.

Yleiset sudenkuopat

Yksittäinen all-in-one Embed-widget-liittäminen EI toimi. Wix tiukensi Embed-sandboxia joulukuussa 2025 (poisti allow-same-origin-attribuutin). Script latautuu, mutta mukautettu elementti rekisteröityy iframen sisällä — ei Wix-sivullasi.
Settings → Custom Code vaatii Core-tilauksen ($17/kk) tai uudemman. Ilmainen tilaus ja Light-tilaus eivät sisällä sitä.
Custom Code -säännöt ovat voimassa tallennuksessa — ne eivät näy Wix-editorin esikatselussa. Klikkaa "Preview" tai parempi vielä "Publish" ja katso live-URL:a.
Embed a Widget -lohkossa on kiinteä iframe-koko. Muuta lohkon kokoa editorissa lomakkeen luonnolliseen korkeuteen sopivaksi; lomake itse istuu iframen ULKOPUOLELLA (vanhempisivulla), joten iframe on vain sijoittelun ankkuri.
Jos custom code -säännöt ovat ristiriidassa keskenään, viimeisin tallennus voittaa hiljaisesti. Pidä yksi sääntö, kohdista molempiin sivuihin, head + body — helpompi debugata kuin erilliset säännöt sivua kohti.

Usein kysyttyä

Mitä "sandboxattu iframe" tarkoittaa?

Sandboxattu iframe on iframe, jolla on sandbox-attribuutti, joka rajoittaa sisäkkäisen sisällön toimintaa. Joulukuussa 2025 Wix poisti allow-same-origin-attribuutin Embed-widgetin sandboxista. Script latautuu silti, mutta mukautettu elementti rekisteröityy iframen sisällä — ei Wix-sivullasi. Siksi yksittäinen upotuslohko ei toimi; meidän on jaettava se.

Miksi "Embed HTML" ei toimi enää kuten ennen?

Molemmat ajavat samassa sandboxatussa iframeissä (sen jälkeen kun Wix tiukensi tietoturvaa joulukuussa 2025 poistamalla allow-same-origin-attribuutin). Script latautuu, mutta mukautettu elementti rekisteröityy iframessa — ei vanhempisivulla. Siksi suosittelemme jaettua menetelmää.

Hetkinen — toimiiko jaettu menetelmä oikeasti?

Kyllä. Script-tagi menee Settings → Custom Code -kohtaan (head tai body) — se on vanhempisivu-injektio, ei iframe. Mukautettu elementti menee Embed a Widget -lohkoon, joka renderöi tagin vanhempisivulle (widget-sisältö ajaa iframessä, mutta itse tagi mountataan vanhemman DOM:iin). Yhdessä: script rekisteröi elementin vanhempisivulle, tagi on vanhemman DOM:issa, lomake renderöityy.

Entä Velo (Wix Dev Mode)?

Velo (Wix Dev Mode) antaa backend-koodin ja frontend-tapahtumat — mutta HTML-renderöintipinta on silti sama Embed-widgetin iframe. Velo ei poista sandboxia; se vain antaa tavan skriptata sen ympäri. Useimmille käyttäjille jaettu menetelmä on yksinkertaisempi.

Pitäisikö vaihtaa toiselle alustalle?

Rehellisesti, jos olet juuri valitsemassa no-code-sivustorakentajaa, Squarespace, Webflow ja WordPress.com kaikki tukevat upotustamme puhtaammin kuin Wix. Emme sano tätä kevyesti — mieluummin haluamme sinulle sujuvaa kokemusta kuin että taistelisit sandboxin kanssa.

Upotat eri alustalle?

Sama kaksi riviä koodia, jokaiselle alustalle eri ohjeet.

WordPress

Custom HTML -lohko, Block-editori tai perinteinen. Ei lisäosia. Yksi mutka — käyttäjäroolisi tarvitsee unfiltered_html-oikeuden.

Lue koko opas

Squarespace

Pudota koodilohko mille tahansa sivulle. Vaatii Core-tilauksen (vuoden 2025 uusi nimi Businessille) tai uudemman.

Lue koko opas

Webflow

Code Embed -elementtiin mahtuu 50 000 merkkiä. Mukautettu koodi vaatii Basic-tilauksen tai uudemman. Julkaise nähdäksesi tuloksen.

Lue koko opas

Shopify

Lisää Custom Liquid -osio mihin tahansa teemaan — sovellusta ei tarvita. Kassasivu vaatii Shopify Plus -tilauksen.

Lue koko opas

Staattiset sivustot

Astro, Hugo, 11ty, Jekyll — sama kaksi riviä layout-tiedostoon. Buildit pysyvät nopeina.

Lue koko opas

HTML / Muu

Pelkkä HTML-sivu riittää. Avaa tekstieditorissa, liitä, tallenna, lataa palvelimelle. Kolme askelta ja toimii.

Lue koko opas

React / Vue / Angular

Käytä mukautettua elementtitagia suoraan JSX:ssä, Vue-templateissa tai Angular-komponenteissa. Ei wrapper-komponenttia, ei lisäpaketteja.

Lue koko opas

Valmis kokeilemaan?

30 päivän ilmainen kokeilu. Ei luottokorttia. Valmis minuuteissa.

Ei luottokorttia. Valmis kahdessa minuutissa.