Embed code (put the tour on your website)
How to: in the editor, open Share › Embed code (in the projects list: Share options › Embed code on the tour’s card). Pick the options, click Copy embed code, and paste the code into your website’s HTML; in a site builder, paste it into an HTML or embed element. Preview shows the tour inside a sample web page first.
- Embed type:
- Responsive (100% width) (the default): the tour fills the width of the place where you paste it, and its height follows the Aspect ratio: 16:9 (the default), 4:3, 1:1, 3:2 or 21:9. This code sets no height in pixels.
- Fixed size (px): a set width × height, 800 × 450 to start. It doesn’t shrink to fit phones.
- Allow fullscreen mode (on by default) lets visitors open the tour full screen. Disable mouse wheel to zoom (recommended) (on by default) makes the mouse wheel scroll your page instead of zooming the tour.
- Empty space under the tour: the tour is only as tall as the embed code makes it. If your site builder’s HTML or embed box is taller, the rest of the box shows empty below the tour, more so on phones, where a responsive tour gets narrower and so shorter. Make the box as tall as the tour, or choose Fixed size (px) and enter the box’s height. The responsive code also leaves a small margin above and below the tour.
- Portrait, such as 9:16: the Aspect ratio list has no portrait shape. Choose Fixed size (px) and enter, for example, 360 × 640. Or, in the responsive code, change the
padding-toppercentage to the height divided by the width:177.78%for 9:16,125%for 4:5. A responsive portrait tour gets very tall on a wide page, so place it in a narrow column.