How to add / edit a guided tour?

• Go to your CMS and navigate to the “Guided tours” section in the CMS dashboard.

• Click Add New Guided Tour. 

• In the “Title” field, input the title of the guided tour.

• In the Display Title field, optionally add the display title, i.e. this title will display on the front end in the guided tour sidebar. Refer to this article to help you understand display articles.

Introduction Section

• You have an option to choose between an image or an ambassador (Circle 1 & 2). This image will appear as a round thumbnail on the introduction and in the ambassador bubble. Only choose an ambassador if you have pre-populated the ambassador profile. Please refer to this article to guide you. This will give you a dropdown of pre-populated ambassador profiles that you can select and use in your guided tour (Circle 3).

• Alternatively, select use an image (Circle 4) . This will require you to populate the thumbnail image. If you don’t input an image, the image will not show and neither will the ambassador bubble. Selecting Add image will take you to the media library allowing you to choose an image of your choice or to upload a new image.

• Only when an image or ambassador profile is selected, two new video fields will appear. Upload an MP4 video of your ambassador (Circle 5), and optionally a WEBM version of the video that loads faster on browsers, apart from Safari which due to Apples’ limitations, don’t support WEBM (Circle 6). 

• Then, if either video is uploaded, the transcript settings will show, with the Real Time Caption toggle being off by default (Circle 7). This in turn, will show a text box to enter a transcript (Circle 9). However, if you turn the toggle on, it lets you upload a SRT or VTT file (Circle 8).

• In the “Body” section (Circle 10), input the introduction or overview text for the guided tour. This text will display next to the thumbnail image in the guided tour sidebar. It is a brief introduction to welcome your students to the guided tour.

• Start Tour: This text is editable (Circle 11). You can get creative with this to make the tour more exciting. This is the button that your students will need to click to start their tour.

Post Section

Prerequisite

• A quick recap, guided tours are made up of posts. Before you start this section, make sure you have created the relevant to your guided tour. Please review this article to guide you on creating posts.
• While guided tours can accommodate all the types of posts i.e. video, 360 panoramas, articles etc, we advise that you use 360 panoramas as the main posts and bring in the video, information and social media as content spots.
• If you intend to use the same post across multiple guided tours and you want to use the same description, please populate the excerpt field on the specific post. Review this article to guide you.

How to add posts to your guided tour.

Add Stops (Posts): From the drop-down list, select the post you want to include as a stop in your guided tour. To add more stops, click the 'Add Stop' button and select the desired post. 

Each stop can have:

• Relative Title: Input a brief title of the guided tour (optional). You can leave this empty if you want it to inherit the display name of the post.
• Relative Description: An optional description that will provide a  brief description of each stop. It will show in the info bar when the stop is active.

• Inline Video / Audio: Populate the mp3 or mp4 file here. If you use an audio file, the front-end will show an image of the ambassador and the player (see screenshot below). Refer to this article on recommended audio/video output.

• If you populate the  [transcription] field, it will automatically show.  Populate this field with the transcription of the video or audio clip if you have this.  If left blank, the transcription button won't show on the front end.  

End Screen (Optional but recommended)

This allows you to give your students direction on where to go next or guide them to a call to action that may be relevant to them. It’s exactly the same as the Introduction Screen, apart from:

• Circle 1, the Enable toggle switch. Set it to Yes to activate the end screen and show all the settings (this is optional).
• Circle 2,Under the Button section

• Choose the Button Type:

• Select External (Another website) if the button will direct users to an external link.
• Select Internal (Within the platform) if the button should link to another part of the tour.

•  In the Text field, enter the action prompt for users.
  • Example: Sign Up for Our Open Day.
• In the URL field, enter the full web address users should be directed to.
  • Example: https://www.weather.gov (Ensure it starts with http:// or https://).
• Check the Open in the new tab? box if you want the link to open in a separate browser tab. This is advised in order to keep students in your experience.

• Set Featured Image: Select or upload a featured image for the guided tour. 

Adding a second end screen button (optional)

You can now add an optional secondary call-to-action alongside the primary button on the end screen. This is useful when you want to offer your students two next steps, for example, a primary “Book an Open Day” action and a secondary “Browse Courses” link.

• Scroll to the Secondary end button copy (optional) group, just below the primary button settings.
• Leave it empty if you only want one button. The end screen will look exactly the same as before.
• Fill it in to show a second button. The fields are identical to the primary button (Button Type, Text, URL or internal link, Open in new tab, Open in modal).
• When both buttons are populated, they appear side-by-side on the end screen. The primary button keeps its standard styling and the secondary button is shown in an inverse style so the two are visually distinct.
• If you only fill in the secondary and leave the primary empty, the single button you’ve set will display as the main call-to-action.
• Tip: keep both labels short (2–4 words) so they sit neatly together on mobile.
• Set Featured Image: Select or upload a featured image for the guided tour. 

Turning off the mini map in the Guided Tour.

If you don’t need the mini map on your guided tours perhaps because all locations are within the same building or the content has no location, you can now toggle it off for specific tours. This can be done by toggling off the mini map button in the CMS.

Customisable Content Presentation

In your Vepple CMS, open Site Options to find a new sidebar menu called Guided Tour Settings. These controls allow you to decide how visitors experience the content viewer.

Auto-play

Toggle on “Auto-play On” and the panorama image rotates automatically. Each time a visitor moves to another stop, the rotation begins again unless it is turned off in the content viewer toolbar.

Info Panel Open

Toggle “Info Panel Open” if you want the information panel to open by default. If a visitor closes it on any stop, it will remain closed until they choose to open it again.

Content Drawer Open

Toggle “Content Drawer Open” on if you want the content drawer to open by default. If a visitor closes it on any stop, it will remain closed until they choose to open it again.

Both Open

By default, the info panel closes when the content drawer opens, and the content drawer closes when the info panel opens. If you turn on both options in Guided Tour Settings, they will load open together. Once a visitor closes or reopens one of them, normal behaviour resumes.
 

Related Articles.

How to add extra information on your spots to your 360 panoramas 

If you would like to add a bit of text or information describing a scene in your 360 to bring your guided tour to life, please refer to this article to guide you.

Adding Content Spots 

* If you would like to add videos, galleries or social media content spots to bring your guided tour to life, please refer to this article to guide you.

Why are my content spots not showing?

For 360 posts, ensure the content spot is marked 'Yes' under 'Show on guided tour' for it to appear in the guided tour. Please review this article to learn how to populate content and info spots.

If you would like to edit a specific post, instead of going to the post section, you can click the Edit Post and it will directly link you to the post.

How to add the map feature to your guided tour!

If any of your posts have a location, the mini map (top left corner) in the guided tour will appear on the front end.

If you would like to add a location to your post, use this article to guide you.

Embedding Guided Tours on your website 

If you have created your guided tour and would like to embed it or use this content externally outside Vepple. Use this article to guide you on how to create a guided tour embed.

How to add the content drawer to Guided Tours Sections 

Use this article to guide you.