In the Tiled Builder, you can easily create hotspots on your microapp pages that you can link to other microapp pages, external websites, external files, phone numbers, or email addresses.
From the Microapp Builder, navigate to the desired page or overlay. Ensure that the desired design element (for example, a company logo or navigation icons) to be associated with the hotspot has been included in the design of the page. Click and drag the Hotspot Tile from the Tile Panel to the desired location on the page.
The Hotspot Tile ( ) appears as a colored square in editing mode that is not visible to recipients when the microapp is shared. Once placed, you can move and resize the Tile as needed.
Specify a Target
Once you have placed the Hotspot Tile, you can then specify its desired target. Click the hotspot to open the Hotspot menu, and click the Link To dropdown list.
You can specify the following types of targets:
- Microapp page/microapp overlay
- Tiled lists the microapp pages and overlays by name in sequential order. Select the desired page to link it.
- External page/file
- You can link to an external web page or an external file that you want opened (like a PDF) or downloaded. Select External page/file from the dropdown list.
Paste the link to the webpage or file in the URL field. When selected, Tiled opens the location in a web browser.
Additionally, you can specify the desired options for users viewing the microapp on their mobile device:
Modal (iOS/Android) Display in a smaller, centered window instead of fullscreen. Hide controls When linking a hotspot to an external webpage, this option hides the standard browser controls (such as the address bar), restricting your viewers navigation. Deep link
Provides tracking and engagement information when creating a link to another microapp. To enable this functionality, you must ensure the following:
- The URL specified must be the Universal Link of the linked microapp, which can be found on the Sharing tab of the Microapp Settings window.
- The viewer must have been granted access to the microapp through the Tiled Library or from a direct share link.
- Phone Number
- Tiled allows you to link the hotspot to a phone number. Select Phone Number from the dropdown list, and enter the desired number. When selected, the viewer’s device attempts to call the telephone number using the configured default application.
- Tiled allows you to link the hotspot to an email address. Select Email from the dropdown list, and enter the desired email address. When selected, the viewer’s device attempts to create an email message using the default email application, with the specified address in the To field.
Create a multi-hotspot
If you design a microapp page where you want to link multiple elements that are grouped together side-by-side or on top of each other (for example, the navigation menu highlighted below), you can create a multi-hotspot.
Place the hotspot as normal, creating the initial link, and then adjust it so that it covers all of the elements you want linked. Ensure that the hotspot is selected, and repeatedly click the button on the Hotspot menu until you equal the number of desired links. The Tiled Editor divides the hotspot into equal partitions. Specify destinations for each partition as desired.
By default, the Tiled Builder divides the hotspot into vertical partitions. Click Horizontal to change them to horizontal partitions.
To delete a partition, hover over the partition name and select Delete.
Create a transition
If you want a transition for your link, such as a fade, click the Transition dropdown list and select the desired transition. No Transition is selected by default.
You can configure the hotspot as a completion event, so that when the viewer selects the link, Tiled records it as a completion event for the microapp. To set the hotspot as a completion event, move the Completion slider to the right.
Note: Completion events are associated with the entire hotspot. So, if Completion is selected for a multi-hotspot, then all links activate the completion event.
Delete a hotspot
Editors need to remember that hotspots are independent of the elements on their page, so if they delete the element (like a graphic) the hotspot remains on the page. To delete a hotspot, click to highlight the blue hotspot box, and press the DELETE key.