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. 

Note: This user guide is applicable to BigCommerce. 

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 build a custom page in Alphonso?

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.
Note: By default, the page type is Info Page. The other type is Store Locator, which is exclusively for the store locator page. 

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: Click Save draft in the bottom right corner to save your design. 

2.2 Make a custom page accessible

Step 6: Link the page to a block on a  page within the app. 
  1. The page can be accessed through a block or a button within the app, namely:
    1. On the home screen, you can link a block to a corresponding custom page.
    2. On the My Account screen, you can create an action button, configure it, and then directly link it to a specific custom page.
    3. If you want to navigate to the page from the bottom tab, in the Bottom tab section, configure a button and link it to a custom page. 
  2. In the design settings of the chosen block, under Where should this lead your customers?, select Page, then choose the custom page you want to link to.

Step 7:  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.

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 Alphonso and the core pages. By the end, you'll have a general understanding of leveraging ...

    • Build the categories page

      In this article, we'll take you through the step-by-step process of creating your categories page. Note: This user guide is applicable to BigCommerce. 1. About the category structure Here are some important notes on the category structure in ...

    • Build the brands page

      In this article, we'll provide you with an overview of the Alphonso brands page, step-by-step instructions, and best practices for building the page. Note: This user guide is applicable to BigCommerce. 1. About the brands page The Brands page in a ...

    • Push notifications in Alphonso

      Push notifications have been proven to be a direct and cost-efficient communication channel, fostering user engagement and retention. In this guide, we’ll explore the scope of push notifications in Alphonso and how to send push notifications. 1. ...

    • 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 ...