Integreren van een viditour in je website

Onze viditours kunnen door ons worden aangepast zodat ze direct in je website kunnen worden geïntegreerd. Hierdoor wordt de viditour een integraal onderdeel van je website.

Technische uitleg werking iframe

Door het toevoegen van een klein stukje code op je website kun je de viditour toevoegen. Hiervoor maken we gebruik van een iframe. Onderstaand de code zoals die is gebruikt om de viditour die onderaan deze pagina staat te integrereren.

Voorbeeldcode

1
2
3
4
5
6

<iframe
    height="480 !important"
    width="100%"
    style="border: 0px"
    src="https://voorbeeld.viditour.nl/iframe-khalilah/">
</iframe>

Stap voor stap uitleg van de voorbeeldcode

2

    height="480 !important"

Hiermee bepaal je de hoogte van de viditour. Je kunt hiermee experimenteren en zelf een waarde kiezen die het beste past bij je website. Let er wel op dat je deze waarde niet te hoog instelt: op mobiel zal de tour dan te hoog zijn en dat is vervelend voor de navigatie. De waarde !important is belangrijk omdat sommige websites hier anders geen rekening mee houden.

3

    width="100%"

Hiermee bepaal je de breedte van de viditour. Wij adviseren deze op 100% te zetten. De viditour krijgt dan dezelfde breedte als het artikel of module op je website.

4

    style="border: 0px"

Het is mogelijk om de iframe een rand te geven. In dit voorbeeld hebben wij ervoor gekozen om geen rand te laten zien.

5

    src="https://voorbeeld.viditour.nl/iframe-khalilah/">

En tot slot: het internetadres van de viditour! We adviseren daarnaast om alle code op 1 regel te plaatsen zoals hieronder:

1

<iframe height="480 !important" width="100%" style="border: 0px" src="https://voorbeeld.viditour.nl/iframe-khalilah/"></iframe>

Tips voor de bezoeker

Niet iedere bezoeker zal weten wat de mogelijkheden zijn van een viditour. Wij raden daarom aan om altijd een introductietekst boven de viditour te plaatsen met een korte uitleg. Bijvoorbeeld:

Alvast een kijkje nemen?

In de onderstaande virtuele tour kun je alvast in 360 graden een kijkje nemen op deze locatie. Je kunt navigeren door op de pijltjes te klikken, maar je kunt het beeld ook zelf met je muis slepen. Als je de site vanaf je telefoon of tablet bekijkt, kun je ook met je vingers het beeld verplaatsen.

Over de auteur

Redmar is beeldmaker bij Viditour en tevens verantwoordelijk voor de technische realisatie van de viditours en alles daaromheen. Wil je op de hoogte blijven van nieuwe artikelen en projecten? Volg ons via Linkedin en/of Facebook.

Tips, vragen, aanvullingen of verbeteringen op dit artikel?

We zouden het heel leuk vinden om deze van je te horen! We horen het graag! Je kunt ons bellen: 0165 820 227 of rechtstreeks mailen: info@viditour.nl