How to Add a Web Page to Your App

This guide will walk you through the process of integrating any web page directly into your application using the Web View plugin.

Step 1: Accessing the Plugin Manager

To begin, navigate to the app builder section. On the left side of your screen, you will find a pencil icon; click on it to enter the builder. To the right of the search bar, select the "Add Plugins" button.

Step 2: Installing the Web View Plugin

A new search bar will appear. Type "Web View" into this search bar. A feature box for "Web View" will be displayed. Click "Add Plugin." You will then be prompted to give your new feature a title. Enter your desired title and click "Add."

Step 3: Configuring the Web Page URL

Once the plugin is added, you will see a URL search bar on the right of the emulator. In this field, paste the full link of the web page you wish to display. After pasting the link, click the "Validate" button to ensure it is correctly formatted.

Step 4: Choosing the Display Mode

Below the URL input, you will find several display options for your web page:

  • In Pop-up Window: This option will open the web page in a new window that appears on top of the app. When the user presses the back button, they will be returned directly to the app.

  • In Feature: Selecting this mode will display the web page within the app's existing framework. The app's home screen and navigation icons will remain visible at the bottom, making the web page appear as an integrated feature.

  • Default Device's External Browser: This will redirect the user out of your app and open the web page in their device's default browser, such as Chrome or Safari.

It is generally recommended to use the "In Feature" or "In Pop-up Window" options to maintain a seamless user experience. However, some web pages may require you to use the external browser option.

Step 5: Customizing the Feature Icon

After adding the plugin, you can customize its appearance within your app. On the left side of the screen, you will see the title you assigned to your feature, with "Web View" written underneath. To the left of this, there is an icon. Click on this icon to select a new one that best represents your added web page. This new feature can then be placed anywhere within your app's layout.