User Guide to Build Your Mobile App With Mosho Cart

User Guide

You can select from different themes, colors, and fonts to create an attractive and professional-looking homepage. You can also add your logo and banner images that showcase your brand. Mosho Cart offers a user-friendly interface that enables you to make changes quickly and easily without needing technical expertise. Once you’ve personalized your homepage, your customers will know they are in the right place and can navigate your app with ease. Personalizing your app ensures a consistent and memorable experience for your customers, which can lead to increased retention and loyalty. This step by step user guide helps you in building your home screen, navigation menus with ease.

How to Edit Header Bar?

Step 1Click on the “Customize App” option.
Step 2Click on the Edit icon to update a Header bar section.
Step 3After editing details, click on the Submit button for update Header bar section.

How to Configure Navigation Menu?

A Navigation Menu is a list of links that helps users navigate your website or app. You can customize your Navigation Menu by adding, editing, or removing menu items. Follow these steps to configure a Navigation Menu:

Step 1
Navigate to “Navigation Menu” option from the sidebar menu options.
Step 2
Add a New Menu item by clicking on “Add Menu Item.”
Step 3
Choose a Menu Type to define the characteristics of the menu item.
Step 4
Search for the desired Collection or Product.
Step 5
Select the Collection or Product based on your search results.
Step 6
Provide a name for the Navigation Menu in the designated field.
Step 7
Click on the “Submit” button to finalize and save the configuration.
Step 8
To remove a menu item, Click the Remove icon.
Step 9
Confirm the removal by clicking on the “Yes” button.

How to Configure Banner Slider?

A Banners Slider is a feature that allows you to display multiple images or banners on your website or app. Follow these steps to configure a Banners Slider:

Step 1
Navigate to “Customize App” option from Sidebar menu.
Step 2
Select the “Banners Slider” option within the Add New Widget sidebar.
Step 3
“Add a new Banners Slider Item” by clicking the down arrow icon.
Step 4
Provide the necessary details and confirm by clicking the “Submit” button.
Step 5
Update specific details for a Banners Slider Item by selecting the “Edit” icon.
Step 6
Remove a particular Banners by clicking the “Remove” icon.
Step 7
Confirm the removal of the selected Banners Slider Item by clicking on the “Yes” button.
Step 8
Update for a specific Banners slider Layout by clicking the “Edit” icon.
Step 9
Remove the entire Banners slider Layout by clicking the “Remove” icon.
Step 10
Confirm the removal of the complete Banners Slider Layout by clicking on the “Yes” button.

How to Configure Collection Slider?

A Collection Slider is a feature that allows you to display multiple collections of products on your website or app. Follow these steps to configure a Collection Slider:

Step 1
Navigate to “Customize App” option from Sidebar menu.
Step 2
Select “Collection Slider Layout” option from the Add New Widget sidebar.
Step 3
Add a new Collection Slider Item using the down arrow icon.
Step 4
Enter the necessary details and confirm by clicking the “Submit” button.
Step 5
Update specific details for a Collection Slider Item by selecting the “Edit” icon.
Step 6
Remove specific Slider Items by clicking the “Remove” icon.
Step 7
Confirm the removal of the selected Slider Items by clicking on the “Yes” button.
Step 8
Update a specific Collection Slider Layout using the “Edit” icon.
Step 9
Remove the entire Collection Slider Layout by clicking the “Remove” icon.
Step 10
Confirm the removal of the complete Collection Slider Layout by clicking on the “Yes” button.

step by step user guide collection slider

How to Configure Collection Grid?

A Collection Grid is a feature that allows you to display a grid of products on your website or app. Follow these steps to configure a Collection Grid:

Step 1
Navigate to “Customize App” option from Sidebar menu.
Step 2
Select “Collection Grid Layout” option from the Add New Widget sidebar.
Step 3
Add a new Collection Grid Item using the down arrow icon.
Step 4
Enter the necessary details and confirm by clicking the “Submit” button.
Step 5
Update specific details for a Collection Grid Item by selecting the “Edit” icon.
Step 6
Remove specific Grid Items by clicking the “Remove” icon.
Step 7
Confirm the removal of the selected Grid Items by clicking the “Yes” button.
Step 8
Update a specific Collection Grid Layout using the “Edit” icon.
Step 9
Remove the entire Collection Grid Layout by clicking the “Remove” icon.
Step 10
Confirm the removal of the complete Collection Grid Layout by clicking the “Yes” button.

How to Configure Collection Section?

A collection section is feature that allows you to display a list of collection on your website or app. These steps guide you through the systematic configuration of a Collection Section with clarity and precision.

Step 1
Navigate to “Customize App” option from Sidebar menu.
Step 2
Select “Collection Section Layout” from the Add New Widget sidebar.
Step 3
Add a new Collection Section Item using the down arrow icon.
Step 4
Enter the necessary details and confirm by clicking the “Submit” button.
Step 5
Update specific details for a Collection Section Item by selecting the “Edit” icon.
Step 6
Remove specific Collection Items by clicking the “Remove” icon.
Step 7
Confirm the removal of the selected Collection Items by clicking the “Yes” button.
Step 8
Update a specific Collection Section Layout using the “Edit” icon.
Step 9
Remove the entire Collection Section Layout by clicking the “Remove” icon.
Step 10
Confirm the removal of the complete Collection Section Layout by clicking the “Yes” button.

step by step user guide collection section

How to Configure Product Slider?

A product slider is a way of showing multiple products on a website or on a mobile app in a slideshow format. These steps show you how to set up a Product Slider in a clear and exact way.

Step 1
Navigate to “Customize App” option from Sidebar menu.
Step 2
Choose “Product Slider Layout” from the Add New Widget sidebar.
Step 3
Add a new Product Slider Item using the down arrow icon.
Step 4
Enter the necessary details and confirm by clicking the “Submit” button for the Product Slider Item.
Step 5
Update specific details for a Product Slider Item by selecting the “Edit” icon.
Step 6
Remove specific Product Slider Items by clicking the “Remove” icon.
Step 7
Confirm the removal of the selected Product Slider Items by clicking the “Yes” button.
Step 8
Update a specific Product Slider Layout using the “Edit” icon.
Step 9
Remove the entire Product Slider Layout by clicking the “Remove” icon.
Step 10
Confirm the removal of the complete Product Slider Layout by clicking the “Yes” button.

How to Configure Standalone Banner?

A standalone banner is a banner that showcases the products or categories available on the app, along with a discount code or a special offer to entice the users. These steps guide you through the systematic configuration of a Standalone Banner with clarity and precision.

Step 1
Navigate to “Customize App” option from Sidebar menu.
Step 2
Choose “Configure Standalone Banner Layout” from the Add New Widget sidebar.
Step 3
Update the Standalone Banner Layout by clicking on the “Edit” icon.
Step 4
Enter the necessary details and confirm by clicking the “Submit” button for the Standalone Banner Layout.
Step 5
Remove the Standalone Banner Layout by clicking the “Remove” icon.
Step 6
Confirm the removal of the Standalone Banner Layout by clicking the “Yes” button.

step by step user guide standalone banner

How can push notifications be sent to users?

Step 1
Navigate to “Push Notification” option from Sidebar menu.
Step 2
Enter notification title and notification content into respective fields and click on the “Send Alerts” button to notify users.
NOTES:
- 1. Notifications will only be received by users if their notification settings are appropriately configured.
- 2. Users who have activated the “Do Not Disturb” (DND) mode on their mobile devices will not receive push notifications.
Additional Notes for Android users:

If you encounter issues with receiving notifications on your Android device. Follow these steps to enable app notifications:
- 1.
  Open the Settings app on your Android phone.
- 2.
  Navigate to the Notification Control Center menu.
- 3.
  Under “Most recent,” to find more apps, in the dropdown menu, select all apps. Alternatively, select the “App Notification” option to view a list of ll apps.
- 4.
  Locate and tap on the Moshocart app.
- 5.
  Toggle the switch to turn on “Allow Notifications” for the app.
- 6.
  Customize your notification preferences, such as those for the Lock screen, Banner/Floating Notification, and Badges/Bubble.
These steps provide an alternative set of instructions for users facing notification issues on their Android devices.

step by step user guide push notification

How to Configure Theme Color Option?

The steps below guide you through configuring a Theme Color option.

Step 1
Navigate to “Theme Settings” option from the sidebar menu.
Step 2
Select a Theme option or select a custom color from the custom Theme option from the “Theme Color option” section.
Step 3
Click on the “Save” button to finalize and save the configuration.
Step 4
Select the “Default Theme” option to establish it as the default theme for your application.

How to Configure Icons setup option?

The steps below guide you through configuring an Icon setup option.

Step 1
Navigate to “Theme Settings” option from the sidebar menu.
Step 2
Select an Icon Set option from the “Icons Setup Option” section.
Step 3
Click on the “Save” button to finalize and save the configuration.
Step 4
Select the “Default Icon Set” option to establish it as the default theme for your application.

How can I configure Color-Swatch Images?

Step 1Sign in to your Shopify Admin store.
Step 2From the menu bar, click on “Content > Files.”
Step 3Use the Upload Files icon to upload your image.
NOTES:
- 1.Format the image filename, e.g., “Blue Berry” should be formatted as blue_berry.
- 2.Image File Format should be set as JPG or PNG.
Step 4After successful upload, click on the link copy icon for the uploaded image.
Step 5Go to the Bridge App > Click on “App Features ” option from the sidebar menu.
Step 6Configure Toggle switch for Color swatch options.
Step 7Click the ‘Configuration’ button to configure color swatch options.
Step 8Add any additional details and Paste the copied URL into the Image URL field.
Step 9Click the “Save” button to finalize and save the configuration.

How to Reset my password?

Step 1Login into Mosho Cart Bridge App.
Step 2Navigate to “Navigation Menu” option from the sidebar menu options.
Step 3Click on the downward arrow located on the right side of the header.
Step 4Select the “Password Reset” option.
Step 5Enter your email address.
Step 6Click on the “Send Password Reset Link” button (Ensure that the provided email address matches your Shopify account email).
Step 7Verify your inbox and locate the email containing the password reset link. Click on the provided link.
Step 8Enter your new password and save the changes.

How to Preview?

After configuring relevant details on the MoshoCart app, please follow below mentioned steps to check the preview of your mobile app.

Step 1Navigate to the “Main Dashboard” option from the Sidebar menu.
Step 2Preview the app by selecting the “Preview App” button located in the header bar.

User Guide to Build Your
Mobile App With Mosho Cart