How To Show Hidden Content Using A Button

The Action Button component can be used in conjunction with triggers to create a simple button that will trigger an action within your course, for instance, show a pop-up or show hidden content.

This article will show you a simple example to show hidden content, we’ll use this course as a reference.

We will:

• Create an article with an action button
• Create a hidden article, which will be revealed once the action button is clicked
• Create a trigger to reveal the hidden article

1.  Create your first article, including the Action Button

1. Create your first article
2. Once you have added in your required content to your first article you will need to add an Action Button component to the last block in your article
3. Select Edit Component and start editing the Action Button component
   1. Button Tab:
      1. Add Button Text
      2. Add an icon
      3. It is also possible to add images/hover images to the button
   2. Appearance Tab:
      1. Set the desired appearance for your button
   3. Behaviour Tab:
      1. Set your button action to No Action (this will ensure that any action is controlled by your trigger)
      2. Set the button completion to Click
      3. Choose whether to disable the button once clicked

2. Create your second hidden article

1. Add a new article with your desired content
2. Set the article to hidden

3. Create the trigger

You now need to create the trigger to reveal the hidden article

1. Select Logic
2. Add a new trigger:
   1. Event: Action Button Clicked
   2. Condition: Select your Action Button component
   3. Action 1:
      1. Set to Show Hidden Articles
      2. Set the correct hidden article
      3. 0 ms delay
   4. Action 2:
      1. Set to Navigate to Article
      2. Set the correct hidden article
      3. 100 ms delay

This process can then be repeated down the page with further action button components and hidden content.

Did this article help?

Let us know by leaving a star rating or review at the top of this article.