Use Layers to group elements together on a Claro page for organizing the page and for targeting with actions

Claro pages have a stacking order. Like working in PowerPoint, as you add elements to a Claro page each element is added to the stacking order above the previous element.

You can see the stacking order on the Layers option (2) when you select Page tab (1) to the left of the Stage:


In the image above, you can see that the Background Image is the lowest in the stacking order, and that the Audio file is at the top of the stacking order.

In the image above you can also see that at the top of the stacking order is an item called Base Layer. 

By default, elements added to a Claro page are added to the Base Layer.

NOTE: In Claro pages the stacking order determines the Tab order for learners who use a screen reader tool to navigate the page. The screen reader will start at the top and tab through the elements down the stacking order.

You can add more Layers to help you organize your page, especially to help create interactions such as Shows and Hides.

Instead of setting up a show action on multiple elements, you can add those elements to a new Layer and then target just the Layer with the Show action.

Here’s how to add a new Layer:



Adding new Elements to a Layer

To add a new element to a Layer, select the Layer on the left-side panel then simply add the new element to the Page. It will be assigned to the selected Layer as it is added to the page.


Moving existing Elements to a Layer

You can select also elements on the left-side panel and simply and drag and drop them into a different Layer.


Moving Elements to a new Layer

You can also select several elements on the left-side panel then move them to a new layer. To do this, select the three-dot menu then select Move Elements To A New Layer:


Llike elements, Layers have a stacking order on the page.

All of the elements in a Layer are together in that stacking order. For example, if you add a new Layer1 above the Base Layer, all of the elements added to Layer1 will be above all of the elements in the Base Layer on the Page.


Targeting Layers with Actions

Layers can be targeted by Actions. This is more effective than setting up Show actions on the individual elements.

Here’s how to set up a button to Show a Layer:



  0     0

Similar Projects

Questions  ( 0 )