---
title: Using the App Builder to Customize Your Mobile App
description: Discover how to build and customize your event’s mobile app, from choosing a color theme to creating  menu items and adding content to each section of the Home Screen of your event.
---

[Skip to content](https://help.vfairs.com/knowledge/how-to-design-vfairs-mobile-app-using-the-app-builder#main-content)

English

Show submenu for translations

[Customer portal](https://support.vfairs.com/care?hsLang=en)

Open main navigation

Close main navigation

- English
  
  Show submenu for translations
- [Customer portal](https://support.vfairs.com/care)

 Welcome to vFairs Help Center

- There are no suggestions because the search field is empty.

1. [Help Center](https://help.vfairs.com/knowledge?hsLang=en)
2. [Attendee Mobile App](https://help.vfairs.com/knowledge/attendee-mobile-app?hsLang=en)
3. [Build & Customize Your App](https://help.vfairs.com/knowledge/attendee-mobile-app?hsLang=en#build-customize-your-app)

# Using the App Builder to Customize Your Mobile App

## Learn how to customize your mobile app by configuring branding, adding navigation items, creating home screen sections, and managing the bottom navigation menu.

<iframe height="210" src="https://player.vimeo.com/video/1111886832?autoplay=1&amp;loop=1" app_id="122963&quot;" style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; border-image: initial; border: medium none currentcolor;" width="426" data-mce-src="https://player.vimeo.com/video/1111886832?app_id=122963" data-mce-style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; border-image: initial; border: medium none currentcolor;" data-mce-fragment="1"></iframe>

 

### **Table of Contents**

1. [Accessing App Builder](https://help.vfairs.com/knowledge/how-to-design-vfairs-mobile-app-using-the-app-builder#:~:text=Bottom%20Navigation-,Accessing%20App%20Builder,-From%20the%20Event)
2. [App Theme](https://help.vfairs.com/knowledge/how-to-design-vfairs-mobile-app-using-the-app-builder#:~:text=in%20your%20app.-,App%20Theme,-Expand%20the%20App)
3. [Quick Links](https://help.vfairs.com/knowledge/how-to-design-vfairs-mobile-app-using-the-app-builder#:~:text=consistent%20event%20branding.-,Quick%20Links,-Quick%20Links%20are)
4. [Home Screen Sections](https://help.vfairs.com/knowledge/how-to-design-vfairs-mobile-app-using-the-app-builder#:~:text=vFairs%20Mobile%20App-,Home%20Screen%20Sections,-By%20default%2C%20newly)
5. [Bottom Navigation](https://help.vfairs.com/knowledge/how-to-design-vfairs-mobile-app-using-the-app-builder#:~:text=other%20important%20content.-,Bottom%20Navigation,-The%20Bottom%20Navigation)

### **Accessing App Builder**

1. From the Event Backend, expand **Mobile App** in the left navigation menu.
   
   ![](https://help.vfairs.com/hs-fs/hubfs/Mobile%20App-png-2.png?width=255&height=362&name=Mobile%20App-png-2.png)
2. Click **App Builder**.

This opens the Mobile App Builder where you can customize the appearance, navigation, and content displayed in your app.

![](https://help.vfairs.com/hs-fs/hubfs/App%20Builder-png-4.png?width=600&height=377&name=App%20Builder-png-4.png)

### **App Theme**

Expand the **App Theme** section to customize your app branding.

![](https://help.vfairs.com/hs-fs/hubfs/App%20Theme-png-1.png?width=250&height=433&name=App%20Theme-png-1.png)

#### **Event Logo**

Upload your event logo.

- Recommended size: **200 × 200 px**
- Supported formats: **JPEG, PNG**

#### **Event Thumbnail**

Upload the banner that appears on the app home screen.

- Recommended size: **1600 × 900 px**
- Supported formats: **JPEG, PNG, GIF, MP4**
- Multiple files can be uploaded to create a carousel

#### **App Title**

Enter the title that will appear on the app home screen.

#### **Accent Color**

Select the **Accent Color** for your mobile app.

This color is used throughout the app to maintain consistent event branding.

**Note:** In the Legacy App Builder, there were two additional color options available:

- Primary Color
- Secondary Color

These options have been removed in the new App Builder to better support **Dark Mode** in the new mobile app.

Dark Mode was not available in the legacy mobile app. Since the new app now supports both Light and Dark themes, using multiple custom color layers could negatively impact UI consistency, readability, and overall appearance in Dark Mode.

To provide a more consistent user experience across themes, the new App Builder now uses a single Accent Color configuration.

### **Quick Links**

Quick Links are the menu items displayed on the home screen that provide attendees with quick access to app features and content.

#### **Adding a Quick Link**

1. Expand the **Quick Links** section.
2. Click **Add Link**.
   
   ![](https://help.vfairs.com/hs-fs/hubfs/Expand%20Quick%20Links-png-2.png?width=250&height=419&name=Expand%20Quick%20Links-png-2.png)
3. Select the menu item you want to add.
   
   ![](https://help.vfairs.com/hs-fs/hubfs/Add%20Quick%20Link-png-2.png?width=600&height=380&name=Add%20Quick%20Link-png-2.png)

#### **Managing Quick Links**

Hover over a Quick Link to reveal additional actions:

![](https://help.vfairs.com/hs-fs/hubfs/Managing%20Quick%20Links-png.png?width=250&height=461&name=Managing%20Quick%20Links-png.png)

- **Hide/Show:** Control whether the menu item appears in the mobile app.
- **Edit:** Open the Quick Link settings panel.
- **Delete:** Remove the Quick Link from the app.

#### **Editing a Quick Link**

Click the Edit icon to configure the Quick Link. Available options include:

- Change or upload a custom icon
- Update the menu label
  
  ![](https://help.vfairs.com/hs-fs/hubfs/Edit%20Quick%20Item-png.png?width=250&height=331&name=Edit%20Quick%20Item-png.png)
- Control visibility by user type
- Configure visibility based on attendee actions such as check-in or badge printing
- Configure time-based visibility
  
  ![](https://help.vfairs.com/hs-fs/hubfs/Edit%20Quick%20Item%202-png.png?width=250&height=453&name=Edit%20Quick%20Item%202-png.png)

Some Quick Links may also include additional settings that are specific to that menu item. For example, certain Quick Links allow you to select which content, categories, groups, or records should be displayed when attendees open that menu item.

These settings vary depending on the selected Quick Link.

Click **Save Changes** after making updates.

#### **Managing Quick Link Order and Hierarchy**

To learn how to reorder Quick Links or create nested menu items, refer to:

[How to Manage Quick Links in the vFairs Mobile App](https://help.vfairs.com/knowledge/how-to-manage-quick-links-in-the-vfairs-mobile-app?hsLang=en)

### **Home Screen Sections**

By default, newly created events only include the **Quick Links** section.

Additional sections can be added to highlight important content directly on the app home screen.

#### **Adding a Section**

1. Click **Add Section**.
   
   ![](https://help.vfairs.com/hs-fs/hubfs/Add%20Section-png.png?width=250&height=259&name=Add%20Section-png.png)
2. Select one of the available section types:
   
   ![](https://help.vfairs.com/hs-fs/hubfs/Select%20Session%20Section-png.png?width=600&height=378&name=Select%20Session%20Section-png.png)  
     - Sessions
     - Today's Agenda
     - Speakers
     - Sponsors
     - Exhibitors
     - Products
     - Jobs
     - Floor Plan
     - Ads
     - About
3. Click **Continue**.

Depending on the selected section, you may be prompted to choose the content you want displayed.

For example, when adding a **Sessions** section:

1. Select the sessions you want to display.
2. Click **Add Sessions**.
   
   ![](https://help.vfairs.com/hs-fs/hubfs/Add%20Sessions-png.png?width=600&height=377&name=Add%20Sessions-png.png)

The section will then appear in the App Builder.

#### **Managing Sections**

Each section card includes the following options:

![](https://help.vfairs.com/hs-fs/hubfs/Manage%20Section-png.png?width=250&height=173&name=Manage%20Section-png.png)

- Drag and drop to reorder sections
- Hide or show the section
- Delete the section
- Expand the section for additional settings

When expanded, you can:

![](https://help.vfairs.com/hs-fs/hubfs/Expand%20Section-png.png?width=250&height=256&name=Expand%20Section-png.png)

- Change the section title
- Reorder content
- Add additional items
- Remove existing items

#### **Sessions**

Display selected sessions directly on the home screen for quick attendee access.

To learn how you can add and manage new sessions in your event, please refer to the following article: [How to Add and Manage Sessions](https://help.vfairs.com/knowledge/how-to-add-and-manage-sessions?hsLang=en)

#### **Today's Agenda**

Display the sessions scheduled for the current day directly on the app home screen, giving attendees quick access to their daily agenda.

To learn how to configure **Today's Agenda**, refer to:  
[How to Add Today's Agenda to the Mobile App](https://help.vfairs.com/knowledge/how-to-add-todays-agenda-to-the-mobile-app?hsLang=en)

#### **Speakers**

Show featured speakers on the home screen.

To learn how you can add and manage new speakers in your event, please refer to the following article: [How to Add and Manage Speakers](https://help.vfairs.com/knowledge/how-to-add-speakers-to-sessions?hsLang=en)

#### **Exhibitors**

Display selected exhibitor booths.

To learn how you can add new exhibitors (booths) to your event, please refer to the following articles: [How to Add a Booth (Exhibitor)](https://help.vfairs.com/knowledge/how-to-add-and-import-booths?hsLang=en)

#### **Products**

Display selected products directly on the app home screen, making it easier for attendees to discover products available at your event.

**Note:** The **Products** section is available only when the **Tradeshow** module is enabled for your event.

#### **Jobs**

Display selected job listings directly on the app home screen, allowing attendees to discover available opportunities.

**Note:** The **Jobs** section is available only for events configured as a **Careers Fair**.

#### **Sponsors**

Highlight event sponsors and sponsor groups.

To learn how you can Add new Sponsors to your event, refer to the following article: [How to Add and Manage Sponsors](https://help.vfairs.com/knowledge/how-to-enable-and-manage-the-sponsors-hub?hsLang=en)

#### **Ads**

Display mobile app banner advertisements.

To learn how you can create new Mobile App Ads to choose from, refer to the article below: [How to Create an Ad in the Mobile App](https://help.vfairs.com/knowledge/how-to-create-an-ad-in-vfairs-mobile-app?hsLang=en)

#### **Floor Plan**

Provide attendees with quick access to the event floor plan.

To learn how you can create new Floor Plans to choose from, refer to the article below: [How to Create and Manage a Floor Plan](https://help.vfairs.com/knowledge/how-to-create-and-manage-a-floor-plan?hsLang=en)

#### **About**

Create a custom informational section consisting of:

- Title
- Description
  
  ![](https://help.vfairs.com/hs-fs/hubfs/About%20Section-png.png?width=250&height=335&name=About%20Section-png.png)

This section can be used to display welcome messages, event information, or other important content.

### **Bottom Navigation**

The Bottom Navigation menu appears at the bottom of the mobile app and provides quick access to core app areas.

Expand the **Bottom Navigation** section to configure these items.

![](https://help.vfairs.com/hs-fs/hubfs/Bottom%20Nav-png.png?width=250&height=186&name=Bottom%20Nav-png.png)

#### **Available Items**

- Home
- Agenda
- Contacts

#### **Configuration**

- **Home** is always available and cannot be removed.
- **Agenda** and **Contacts** can be removed or replaced with other supported menu items based on your event requirements.
  
  ![](https://help.vfairs.com/hs-fs/hubfs/Add%20Bottom%20Menu%20Item-png.png?width=600&height=378&name=Add%20Bottom%20Menu%20Item-png.png)

You can customize the labels and visibility settings for supported navigation items.

### **Publish Changes**

After making any updates in the App Builder, click **Publish Changes** to apply your changes to the mobile app.

- [Organization Management](https://help.vfairs.com/knowledge/organization-management?hsLang=en)
- [Event Setup & Navigation](https://help.vfairs.com/knowledge/event-setup-navigation?hsLang=en#main-content)

    - [Document Library](https://help.vfairs.com/knowledge/event-setup-navigation?hsLang=en#document-library)
    - [Translations And Labels](https://help.vfairs.com/knowledge/event-setup-navigation?hsLang=en#translations-and-labels)
- [Attendee Management](https://help.vfairs.com/knowledge/attendee-management?hsLang=en)
- [Agenda Management](https://help.vfairs.com/knowledge/agenda-management?hsLang=en#main-content)

    - [Session Management](https://help.vfairs.com/knowledge/agenda-management?hsLang=en#session-management)
    - [Speaker Management](https://help.vfairs.com/knowledge/agenda-management?hsLang=en#speaker-management)
- [Speaker Management](https://help.vfairs.com/knowledge/speaker-management?hsLang=en)
- [Event Website & Landing Pages](https://help.vfairs.com/knowledge/event-website-landing-pages?hsLang=en#main-content)

    - [Web Page Management](https://help.vfairs.com/knowledge/event-website-landing-pages?hsLang=en#web-page-management)
- [Registration & Ticketing](https://help.vfairs.com/knowledge/registration-ticketing?hsLang=en#main-content)

    - [Registration](https://help.vfairs.com/knowledge/registration-ticketing?hsLang=en#registration)
    - [Ticketing](https://help.vfairs.com/knowledge/registration-ticketing?hsLang=en#ticketing)
    - [Payments](https://help.vfairs.com/knowledge/registration-ticketing?hsLang=en#payments)
- [Exhibitor Management](https://help.vfairs.com/knowledge/exhibitor-management?hsLang=en#main-content)

    - [Booth Negotiation](https://help.vfairs.com/knowledge/exhibitor-management?hsLang=en#booth-negotiation)
    - [Task Management](https://help.vfairs.com/knowledge/exhibitor-management?hsLang=en#task-management)
    - [Booth Management](https://help.vfairs.com/knowledge/exhibitor-management?hsLang=en#booth-management)
    - [Document / Video](https://help.vfairs.com/knowledge/exhibitor-management?hsLang=en#document-video)
    - [Jobs](https://help.vfairs.com/knowledge/exhibitor-management?hsLang=en#jobs)
- [Sponsor Management](https://help.vfairs.com/knowledge/sponsor-management?hsLang=en)
- [Networking](https://help.vfairs.com/knowledge/networking?hsLang=en#main-content)

    - [Chat](https://help.vfairs.com/knowledge/networking?hsLang=en#chat)
    - [Chat Queue](https://help.vfairs.com/knowledge/networking?hsLang=en#chat-queue)
    - [Video Matchmaking](https://help.vfairs.com/knowledge/networking?hsLang=en#video-matchmaking)
    - [Reports](https://help.vfairs.com/knowledge/networking?hsLang=en#reports)
    - [Meeting](https://help.vfairs.com/knowledge/networking?hsLang=en#meeting)
- [Engagement](https://help.vfairs.com/knowledge/engagement?hsLang=en#main-content)

    - [Certificate Management](https://help.vfairs.com/knowledge/engagement?hsLang=en#certificate-management)
    - [Scavenger Hunt](https://help.vfairs.com/knowledge/engagement?hsLang=en#scavenger-hunt)
    - [Notifications](https://help.vfairs.com/knowledge/engagement?hsLang=en#notifications)
    - [Survey](https://help.vfairs.com/knowledge/engagement?hsLang=en#survey)
    - [LeaderBoard](https://help.vfairs.com/knowledge/engagement?hsLang=en#leaderboard)
    - [Quiz](https://help.vfairs.com/knowledge/engagement?hsLang=en#quiz)
- [Reports & Analytics](https://help.vfairs.com/knowledge/reports-analytics?hsLang=en#main-content)

    - [Registration and Ticketing](https://help.vfairs.com/knowledge/reports-analytics?hsLang=en#registration-and-ticketing)
    - [User Journey Tracker](https://help.vfairs.com/knowledge/reports-analytics?hsLang=en#user-journey-tracker)
    - [Post Event PDF Report](https://help.vfairs.com/knowledge/reports-analytics?hsLang=en#post-event-pdf-report)
    - [Survey](https://help.vfairs.com/knowledge/reports-analytics?hsLang=en#survey)
    - [Cross Event Report & Reporting 360](https://help.vfairs.com/knowledge/reports-analytics?hsLang=en#cross-event-report-reporting-360)
- [Marketing](https://help.vfairs.com/knowledge/marketing?hsLang=en#main-content)

    - [Email Campaigns](https://help.vfairs.com/knowledge/marketing?hsLang=en#email-campaigns)
    - [System Emails](https://help.vfairs.com/knowledge/marketing?hsLang=en#system-emails)
    - [SMS Campaign](https://help.vfairs.com/knowledge/marketing?hsLang=en#sms-campaign)
    - [AI Assistant](https://help.vfairs.com/knowledge/marketing?hsLang=en#ai-assistant)
    - [Social Meta](https://help.vfairs.com/knowledge/marketing?hsLang=en#social-meta)
    - [Web Notifications](https://help.vfairs.com/knowledge/marketing?hsLang=en#web-notifications)
- [Accommodation & Budget Management](https://help.vfairs.com/knowledge/accommodation-budget-management?hsLang=en#main-content)

    - [Accommodation](https://help.vfairs.com/knowledge/accommodation-budget-management?hsLang=en#accommodation)
- [Attendee Mobile App](https://help.vfairs.com/knowledge/attendee-mobile-app?hsLang=en#main-content)

    - [Event Assistant](https://help.vfairs.com/knowledge/attendee-mobile-app?hsLang=en#event-assistant)
    - [Getting Started & App Access](https://help.vfairs.com/knowledge/attendee-mobile-app?hsLang=en#getting-started-app-access)
    - [Build & Customize Your App](https://help.vfairs.com/knowledge/attendee-mobile-app?hsLang=en#build-customize-your-app)
    - [Legacy App](https://help.vfairs.com/knowledge/attendee-mobile-app?hsLang=en#legacy-app)
    - [Sessions & Event Content](https://help.vfairs.com/knowledge/attendee-mobile-app?hsLang=en#sessions-event-content)
    - [Engagement & Networking](https://help.vfairs.com/knowledge/attendee-mobile-app?hsLang=en#engagement-networking)
    - [Event Operations & Insights](https://help.vfairs.com/knowledge/attendee-mobile-app?hsLang=en#event-operations-insights)
- [Lead Capture App](https://help.vfairs.com/knowledge/lead-capture-app?hsLang=en#main-content)

    - [Reporting 360](https://help.vfairs.com/knowledge/lead-capture-app?hsLang=en#reporting-360)
- [Badge Printing & Check-in App](https://help.vfairs.com/knowledge/badge-printing-check-in-app?hsLang=en#main-content)

    - [Printers](https://help.vfairs.com/knowledge/badge-printing-check-in-app?hsLang=en#printers)
    - [Badge Design](https://help.vfairs.com/knowledge/badge-printing-check-in-app?hsLang=en#badge-design)
- [Integrations](https://help.vfairs.com/knowledge/integrations?hsLang=en#main-content)

    - [Custom Workflow](https://help.vfairs.com/knowledge/integrations?hsLang=en#custom-workflow)
- [E-commerce](https://help.vfairs.com/knowledge/e-commerce?hsLang=en#main-content)

    - [Product Management](https://help.vfairs.com/knowledge/e-commerce?hsLang=en#product-management)
    - [Allowance Negotiation](https://help.vfairs.com/knowledge/e-commerce?hsLang=en#allowance-negotiation)
- [Venue Builder](https://help.vfairs.com/knowledge/venue-builder?hsLang=en)
- [Abstract Management](https://help.vfairs.com/knowledge/abstract-management?hsLang=en)
- [Group Meeting](https://help.vfairs.com/knowledge/group-meeting?hsLang=en)
- [Exhibitor Portal](https://help.vfairs.com/knowledge/exhibitor-portal?hsLang=en#main-content)

    - [Booth](https://help.vfairs.com/knowledge/exhibitor-portal?hsLang=en#booth)
- [Search Attendee](https://help.vfairs.com/knowledge/search-attendee?hsLang=en)
- [Data Tags](https://help.vfairs.com/knowledge/data-tags?hsLang=en)
- [Organization Website](https://help.vfairs.com/knowledge/organization-website?hsLang=en)
- [AI Tools](https://help.vfairs.com/knowledge/ai-tools?hsLang=en)

[![vfairs-logo-landscape-gradient-5 (3)-1](https://help.vfairs.com/hs-fs/hubfs/vfairs-logo-landscape-gradient-5%20(3)-1.webp?width=107&height=44&name=vfairs-logo-landscape-gradient-5%20(3)-1.webp "vfairs-logo-landscape-gradient-5 (3)-1")](http://vfairs.com)

vfairs.com Help Center

<https://www.linkedin.com/company/vfairs>

Copyright © 2026, vFairs LLC