---
title: Kyselyn upottaminen verkkosivulle
description: Upotetun kyselyn avulla voit näyttää Buennon kyselyn suoraan omalla verkkosivullasi, esimerkiksi tilausvahvistuksen tai asiakaspalvelusivun yhteydessä. Vastaaja ei poistu sivustoltasi, ja vastaukset tallentuvat Buennon raporttiin samaan tapaan kuin linkin kautta annetut vastaukset. Kysely upotetaan sivulle kopioimalla lyhyt koodinpätkä. Tämä on Buennon…
url: "https://buenno.fi/docs/kyselyn-upottaminen-verkkosivulle/"
updated: "2026-10-26"
category: Vastausten kerääminen
---

# Kyselyn upottaminen verkkosivulle

Upotetun kyselyn avulla voit näyttää Buennon kyselyn suoraan omalla verkkosivullasi, esimerkiksi tilausvahvistuksen tai asiakaspalvelusivun yhteydessä. Vastaaja ei poistu sivustoltasi, ja vastaukset tallentuvat Buennon raporttiin samaan tapaan kuin linkin kautta annetut vastaukset. Kysely upotetaan sivulle kopioimalla lyhyt koodinpätkä.

Tämä on Buennon lisämaksullinen ominaisuus. Jos haluat ottaa käyttöön kyselyn upottamisen, otathan yhteyttä Buennon supporttiin.

**Mitä sivulla näkyy**

Kysely piirtyy sivulle sille varattuun kohtaan, eikä se avaudu erillisenä ikkunana. Kysely noudattaa kyselylomakkeen asetuksia.

- Tuetut kysymystyypit ovat yhden vaihtoehdon valinta (esimerkiksi asteikko tai pudotusvalikko), monivalinta, vapaa tekstikenttä sekä yksirivinen teksti. Myös lomakkeen ohjetekstit näytetään normaalisti.
- Tiedoston lisäämistä, taustakysymyksiä (esimerkiksi myyjä, tuote tai ulkoinen tunniste) ja toimipaikan valintaa ei näytetä kyselyssä. Toimipaikka valitaan sen mukaan, minkä toimipaikan koodin liität sivulle.
- Vastaaja voi vaihtaa kyselyn kielen sivulla, jos kyselyllä on useita kieliä.
- Ulkoasu seuraa kyselylomakkeen väri- ja fonttiasetuksia. Kyselyn kulmat ovat oletuksena kulmikkaat, ja ne voi pyöristää sivuston CSS:llä alla olevan ohjeen mukaan..

![](https://buenno.fi/wp-content/uploads/2026/10/Nayttokuva-2026-10-26-kello-8.34.27-1024x591.png)

**Upotetun kyselyn luominen**

1. Siirry vasemmasta valikosta kohtaan Survey widgets ja napsauta oikeasta yläkulmasta Create survey widget.
2. Täytä Settings-välilehdellä pakolliset kentät:

- Widget name — sisäinen nimi, ei näy verkkosivulla.
- Survey — valitse kysely, jonka vastaukset tallentuvat. Vastaukset näkyvät kyselyn raportissa.
- Default store — myymälä, johon vastaukset tallennetaan, jos koodissa ei ole nimetty myymälää. Voit myös jättää kentän tyhjäksi.

1. Settings-välilehden alalaidassa näkyy Embedded questions -taulukko, josta näet, mitkä kyselylomakkeen kysymyksistä tulevat sivulle ja mitkä jäävät pois ja miksi.
2. Siirry Domains-välilehdelle ja lisää sivustot, joilla kyselyä saa käyttää. Katso ohje alempaa kohdasta *Sallitut sivustot.*
3. Napsauta Create. Tallennuksen jälkeen näkyviin tulee Embed-välilehti.

![](https://buenno.fi/wp-content/uploads/2026/10/Nayttokuva-2026-10-26-kello-8.35.16-1024x292.png)

**Sallitut sivustot**

Domains-välilehdellä listataan ne sivustot, joille kysely saa piirtyä. Kysely ei piirry sivustolle, jota ei ole listattu, eikä palvelin ota vastaan vastauksia muilta sivustoilta.

1. Napsauta Domains-välilehdellä lisäyspainiketta ja kirjoita sivuston osoite muodossa [https://www.example.com](https://www.example.com).
2. Lisää tarvittaessa useita osoitteita, yksi per rivi. Osoitteita voi olla enintään 20.
3. Napsauta Save.

Osoitteessa ei saa olla polkua (esimerkiksi /kiitos), kysymysmerkkiä eikä risuaitaa. Portin saa kirjoittaa mukaan. Osoitteen täytyy alkaa https://. Jos käytössä on sekä www-osoite että ilman www:ta oleva osoite, lisää molemmat erikseen.

**Koodin kopioiminen ja lisääminen sivulle**

1. Avaa luomasi widget Survey widgets -listasta ja siirry Embed-välilehdelle.
2. Valitse Store-valinnasta myymälä, jolle vastaukset tallentuvat. Jokaiselle myymälälle on oma koodinsa, mutta sama widget palvelee kaikkia kyselyn myymälöitä, joten uutta widgetiä ei tarvitse luoda.
3. Valitse Language-valinnasta kieli, jolla kysely avautuu ensin.
4. Kopioi koodi ruudun kohdasta *Paste this where the survey should appear* ja toimita se verkkosivustonne vastaavalle henkilölle upottamista varten.
5. Julkaise sivu. Kysely näkyy sivulla, kun sivusto on listattu Domains-välilehdellä.

**Seuraavat tiedot on tarkoitettu verkkosivustonne kehittäjälle.**

Koodi koostuu kahdesta osasta. Ensimmäinen on skriptitunniste, joka lataa kyselyn, ja toinen on kohta, johon kysely piirtyy. Sivulla voi olla useita kyselyitä, jokaiselle oma div-elementti.

Kohta data-content-identifier on myymälän oma tunniste, ja data-locale on kielikoodi. Kopioi koodi aina Embed-välilehdeltä, jotta tunniste on oikea. Skriptitunniste kirjoitetaan div-elementin yläpuolelle.

Jos sivustolla on Content-Security-Policy, siihen tarvitaan Embed-välilehdellä näkyvät lähteet. Tuotannossa ne ovat tyypillisesti seuraavat:

script-src cdn.buenno.fi;
connect-src cdn.buenno.fi webreport.buenno.fi;

Jos kyselylomakkeella on käytössä Google-fontti, tarvitaan lisäksi seuraavat. Embed-välilehti näyttää nämä erikseen.

style-src [https://fonts.googleapis.com](https://fonts.googleapis.com);
font-src [https://fonts.gstatic.com](https://fonts.gstatic.com);

Kysely ei käytä iframe-kehystä, joten sivuston ei tarvitse sallia frame-src-lähdettä. Kysely piirtyy erilliseen suojattuun alueeseen, joten sivuston tyylisäännöt eivät yleensä vaikuta sen ulkoasuun.

Jos sivusto on yhden sivun sovellus, joka vaihtaa sivun sisältöä lataamatta sivua uudelleen, kysely voidaan piirtää uudelleen seuraavalla kutsulla. Asetukset ovat valinnaisia, ja ilman niitä käytetään elementin omia data-attribuutteja.

Kyselyn kulmat saa pyöristettyä lisäämällä sivuston CSS-tiedostoon seuraavan säännön.

.buenno-embed-survey-widget {
--buenno-survey-border-radius: 12px;
}