Build custom pages

Build custom pages

In this article, we'll elaborate on the possibilities of custom pages. You can use this feature to provide information about, for example, the company, FAQs, shipping information, and more. 

1. About custom pages

Custom pages can be displayed on the mobile app through links on the home screen or within the My Account page.

Our feature-rich custom pages empower you to design a truly immersive experience. Tailor your pages with two major elements, namely visuals and HTML. 
  1. Visual components include image banner, image grid, and video, creating a visually appealing and informative experience.
  2. Content can be displayed in various formats by leveraging the HTML block, which is a text-based approach to designing a page’s content. 

2. How to create a custom page?

2.1 Design a custom page

Step 1: Go to Design > Custom Pages. 

Step 2: Click the plus icon to create a new page and provide a name for your page. Confirm the creation by clicking OK.

Step 3: Design the page.
  1. Drag and drop a block onto the preview pane, then hover over a block and click Design. 
    1. Images: Upload image banners or grids of images. The recommended dimensions for an image banner and an image grid are 1125 px x custom height and 500 px x custom height, respectively. All images should be under 15MB.
    2. Visual components include image banner, image grid, and video, creating a visually appealing and informative experience. Upload videos up to 15MB. 
Note: Remember to link images and videos to categories, products, pages, URLs, email addresses, phone calls, or social media profiles.
    1. HTML: Use the HTML block to add content to your page. You can insert various elements and edit the text formats, including fonts, font size, text color, and more. Please note that deep links on content HTML pages to pages or sections in the app are not supported out-of-the-box.

  1. To reorder a block, drag and drop it in the preview pane.
  2. To delete a block, hover over it and click Delete.
Step 4: Manage the page.
  1. To edit a custom page you created, select the page from the dropdown list.

  1. To delete the page, click the trash bin icon.
  2. To edit the page name, click the pencil icon. 
  3. To create a new page, click the plus icon.
Step 5: To finish, click Save draft in the bottom right corner. 
Please note that saving a draft affects only the design page, allowing you to make further changes. To make the current design available to all mobile users, click Publish to Mobile.

2.2 Make a custom page accessible

Once you've crafted your desired custom pages, it's time to make them accessible to your app users. 
  1. On the home screen, you can use action links to link a block or an element to a corresponding custom page.
  2. On the My Account screen, you can create an action button, and then directly link it to a specific custom page.
  3. When configuring a button on the bottom tab, you can also link it to a custom page. 
With the ability to customize custom pages, you can now provide valuable information, engage your users, and create a genuinely immersive app experience. So let your creativity soar as you design captivating content that informs, delights, and keeps users coming back for more.

If you have any further questions, please reach out to us at customer.success@jmango360.com!

    • Related Articles

    • Getting started with Alphonso

      Welcome to Alphonso - the advanced app builder designed to empower you to create exceptional mobile apps. This article will take you on a guided tour of the Alphonso app builder and the core pages in the app builder. By the end, you'll have a general ...

    • Build the category structure

      In this article, we'll share information about the Alphonso category tree and take you through the step-by-step process of creating your category page. The synchronized category structure automatically pulls the category tree from BigCommerce. In ...

    • Design the home screen

      In this guide, we'll explore the power of multi-home and various blocks that allow you to customize and enhance the visual appeal of your app's home screens. From showcasing product collections to adding interactive elements, these blocks offer ...

    • Preview the app

      With our intuitive app previewer powered by Appetize.io, you can get a realistic and interactive preview of your app before publishing it. This article will guide you through previewing and interacting with your app, ensuring it meets your ...

    • Configure My Account page

      In this article, we'll explore the elements and configuration options that allow you to create a tailored and engaging experience for your app users. 1. About My Account The My Account screen in your app is a crucial hub of information and ...