Onboarding Screen

Overview

Introduce users to the enhanced functionality and features of your application through an informative and user-friendly onboarding screen. This guide will help you customize and set up the onboarding screen to provide a seamless and intuitive experience for your users.

Key Features

• User-Friendly Interface: Customizable pages using images, text, and buttons.
• Enhanced User Experience: Educates and empowers users about the app’s capabilities.
• Real-Time Changes: All modifications are reflected in real time, but a rebuild is required for changes to appear in the app.

Setting Up the Onboarding Screen

1. Add Onboarding Screen to Cart:
   • Add the onboarding screen feature to your cart.

2. Enable/Disable Onboarding Screen Addon:
   • Go to the left side panel and click on the onboarding screen option.
   • Enable or disable the onboarding screen addon as needed.

Customizing the Skip Button

• Text: Change the skip button text to suit your needs.
• Text Color: Customize the text color.
• Button Background Color: Adjust the background color of the button.
• Border Color: Set the border color.
• Border Corner: Choose between rounded or square corners.
• Save: Save your changes.

Onboarding Screen Settings

1. Carousel Settings:
   • Set the active and inactive colors for the carousel indicators.

2. General Settings:
   • Change the background color of the onboarding screen.

• Enable or disable the option to show the onboarding screen every time the user opens the app.

• Save your changes.

Adding and Customizing Pages

1. Add Onboarding Pages:
   • Add multiple pages to your onboarding screen as needed.

• Click on Add or Edit to customize each page.

2. Upload Images and Add Text:
   • Upload images to each page.

• Add and customize text with various options such as font weight, size, and color.

• Set margins as required.

3. Show Skip Button:
   • Enable or disable the skip button for each page.

• Save your changes.

Adding Buttons to Onboarding Pages

1. Add Button:
   • Set the button text and customize the text color.
   • Adjust the button’s background color, border color, and border corner type (rounded or square).

2. Set Button URL:
   • Provide the URL that the button should link to.

3. Save:
   • Save your changes.

Final Steps

• Rebuild App: Rebuild your app to apply and view all changes.

By following these steps, you can successfully integrate and customize the onboarding screen, providing a more engaging and educational experience for your users.