Embed
Create a Collection
Update Collections
You can show that a Tile element has been selected by the learner by changing the icon displayed on the Tile.
This is helpful if you want to use the Tile as part of a menu page, for example.
There are two steps to this.
First, you tie the Tile to a variable to track that the Tile has been selected by the learner.
Second you select the icon you wish to display on the Tile when the variable is changed (as a result of the learner selecting the Tile).
NOTE: To use Tiles as “buttons’ on a menu page you’d also set up a Page Link action on the Tile to take the learner to the content you are targeting.
-
1Select the Tile component on the page.
Click the continue button:
-
2Select the Options tab.
Click the continue button:
-
3First, let's tie the Tile card to a variable so we can track that it has been selected on the page. This process also includes creating the variable itself. Select Variable.
Click the continue button:
-
4The Form Variables panel will open. Select the drop-down list to open it.
Click the continue button:
-
5Select New Variable.
Click the continue button:
-
6A text field will be shown, where you can type in a name for the new variable. The variable will be a boolean. It will have a value of false to start and will be set to true when the Tile is selected by the learner. For this lesson, select the text field and we'll add in a name for the variable for you.
Click the continue button:
-
7Select Ok.
Click the continue button:
-
8Now that the Tile is tied to a variable to track that it has been clicked on, we need to set what icon we want to show when the variable is changed. On the Options tab, select Viewed Icon.
Click the continue button:
-
9The Pick an Icon panel will open, where you can select an icon. For this lesson, select the checkmark icon.
Click the continue button:
-
10Select Ok.
Click the continue button:
-
11To see the icon change in action, select Preview.
Click the continue button:
-
12Select Current Page.
Click the continue button:
-
13The Current Page Preview will open in a new browser window. In this lesson, it has opened over the main authoring window. Select the Section 1 Tile element on the Preview page.
Click the continue button:
-
14The default carat icon changes to a checkmark icon.
Click the continue button:
Comments ( 0 )
Sign in to join the discussion.