Skip to main content

How do I Add and Configure Engagement App Button for a Web Page on the Web Builder?

Azavista Support
Updated

Adding and Configuring Engagement App Button on a Webpage

Overview

The Engagement App Button allows organizers to add a clickable button on a web page that directs users to an external or internal engagement application. Using the Web Builder, you can add and configure the Engagement App Button by defining its appearance, navigation URL, visibility rules, section version type, styling, and placement within the page layout. This article explains how to add, configure, and manage an Engagement App Button on a web page.

Step-by-Step Approach

1. Access the Web Builder

  • From the Event Dashboard, navigate to the Content module.
  • Select the Pages submenu.
  • Open the required web page in edit mode.

2. Drag and Drop the Engagement App Button

  • From the Components panel, locate the Engagement App Button component.
  • Drag and drop the button onto the desired section of the web page.

3. Enter or Edit Hexa Code for Color

  • Select the Engagement App Button to open its Settings panel.
  • Enter or edit the hexadecimal (hex) color code to define the background or text color of the button.

4. Select Dependency from the Dependency Select Field

  • In the button settings, locate the Dependency select field.
  • Select an existing dependency from the list.
  • The Engagement App Button displays or hides based on the configured dependency conditions.

5. Select Section Version Type from the Section Version Type Select Field

  • Locate the Section Version Type select field.
  • Select the appropriate section version type.
  • This defines how the Engagement App Button behaves across different versions of the webpage.

6. Enter or Edit Title

  • Locate the Title field in the button settings.
  • Enter or edit the title as required.

7. Select URL from the URL Select Field

  • Locate the URL select field.
  • Select the appropriate URL type to define where the button redirects users.

8. Enter New URL With or Without HTTPS

  • Enter the destination URL manually.
  • The URL can be entered with or without the https prefix, based on your configuration.

9. Select Target from the Target Select Field

  • Locate the Target select field.
  • Select whether the URL opens in the same tab or a new tab.

10. Rename the Button Using Styling and Formatting Options

  • Select the Engagement App Button on the Web Builder canvas.
  • Use the available styling and formatting options.
  • Rename the button and adjust its appearance as needed.

11. Manage the Engagement App Button

  • Reposition the Engagement App Button using drag-and-drop within the page layout.
  • Remove the Engagement App Button if it is no longer required.

12. Save and Apply Changes

  • Save and publish the web page to apply the Engagement App Button configuration.
  • Preview the page to confirm that the button displays and functions correctly.

Related to

Related articles