How to Customize Your Mobile App
Product: Muvi OneHow to Customize Your Mobile App Theme
How to Edit/Delete Slider Images
Introduction
You can customize the appearance of your mobile app using our Visual Designer or VD. The screen layout, font, and design color can be easily changed from the CMS without writing a single line of code. Even you can add and customize the menu of your mobile app.
How to Customize Your Mobile App Theme
- To customize your mobile app, navigate to “Apps” -->” App Template” in the CMS.
- Click on “Customize” under the "Mobile Templates" tab.
- Under “Theme Manager” select the “Status Bar Color” (i.e., Dark, Light)
- Under “Customize the Swatch Colors”, select “Color Themes” from the drop-down.
- You can also customize the swatch colors separately for the “Header”, “Background”, “Text and Icon”, “Description” and “Button”.
- Select the “Font Style” for the app from the drop-down.
- Click on “Preview” to preview the changes that you have made.
- Click on “Save” in the top right corner to save the changes.
How to Upload Your App Logo
You can upload your logo to your mobile app. The logo will appear on the top bar of your app.
- To upload the app logo, navigate to “Apps” -->”App Template” in the CMS.
- Click on “Customize” under the "Mobile Templates" tab.
- .Click on the existing logo.
- On the right-hand side pane, click on “Upload New Image” to upload your logo image. You can upload an image size of 1600 x 900 under 2 MB (.jpg. jpeg, .png).
- Click on “Add Image” and then browse and select the image to upload.
- Click on “Save”.
How to Add App Slider Images
- To upload the app logo, navigate to “Apps” -->” App Template” in the CMS.
- Click on “Customize” under the "Mobile Templates" tab.
- Click on the existing “Slider Image”.
- On the right-hand side, click on “Upload Slider Images”.
- Click on the “Upload Icon” to upload the image.
- On the popup, click on “Add Image” (upload image size of 1600 x 900 under 2 MB in .jpg, .jpeg, and .png format).
- Browse and upload the image from your device and crop it.
- Click on “Next”.
- In the popup, in the “Link To” field, select “Content Category” or “Content” or “Web Address” to link with the image.
- In the “Target” field, select the content category, or content or type the URL of the web address.
- Select “Banner Text” if you want to show text on the banner. You add customized text on the banner.
- Select “Enable Button”, if you want to add a button on the banner.
- Type the “Button Name” (e.g., “Join Now”, ‘Subscribe Now”, ‘Watch Now”, etc.).
- In the “Link To” field, select “Content Category”, “Content” or “Web Address” to link with the button.
- In the “Target” field, select the content category, or content or type the URL of the web address.
- Click on “Add”.
- Click on “Save”.
- The slider image will be added.
- Repeat the process to add multiple slider images.
- Click on “Save” in the top right corner to save the changes made to the template.
How to Edit/Delete Slider Images
You can edit or delete the existing slider images added to the app template. You can change the existing slider image, edit the link and target, change the banner text, edit the banner button name, banner button link, and/or target. You can also delete the slider images.
- To edit the slider image, navigate to “Apps” -->” App Template” in the CMS.
- Click on “Customize” under the "Mobile Templates" tab.
- Click on the existing “Slider Image”.
- Click on the “Edit Icon” on the image that you want to edit.
- You can change the existing slider image, edit the link and target, change the banner text, edit the banner button name, banner button link, and/or target.
- Click on “Update”.
- To delete a slider image, click on the “Trash Icon”.
- Click on “Save” in the top right corner to save the changes made to the template.
How to Add the Menu
A well-structured menu helps end-users easily navigate your app, ensuring they can find key features and content. Using a visual designer (VD) can make this process more intuitive, allowing you to drag and drop elements, customize layouts, and preview changes in real time.
You can add the Content Categories, Content, and Web Address as menu items. You can rename a menu item, or delete the menu item.
Adding Category as Menu Item
- To add a category as a menu item, navigate to “Apps” -->” App Template” in the CMS.
- Click on “Customize” to go to the VD (visual designer) console.
- Click on “Add Menu” on the app.
- On the right-hand side under the “Menu Settings”, click “Add a Menu”.
- Under “Link To”, select “Category”.
- From the drop-down menu, select the “Content Category” that you want to add as a menu item.
- Under “Add New Menu”, type the “Menu Name” (e.g. video, audio, movies, etc.).
- Click on the “Tick Mark” to save the menu item.
- The menu item will be added to the menu.
- You can add multiple categories as menu items.
- Click on “Save” in the top right corner. The changes will be saved to the template.
Adding Content as Menu Item
- To add content as a menu item, navigate to “Apps” -->” App Template” in the CMS.
- Click on “Customize” to go to the VD (visual designer) console.
- Click on “Add Menu” on the app.
- On the right-hand side under the “Menu Settings”, click “Add a Menu”.
- Under “Link To”, select “Content”.
- Select the “Content” from the drop-down menu that you want to add as a menu item.
- Under “Add New Menu”, type the “Menu Name” (e.g. content name).
- Click on the “Tick Mark” to save the menu item.
- The menu item will be added to the menu.
- You can add multiple contents as menu items.
- Click on “Save” in the top right corner. The changes will be saved to the template.
Adding Web Address as Menu Item
- To add content as a menu item, navigate to “Apps” -->” App Template” in the CMS.
- Click on “Customize” to go to the VD (visual designer) console.
- Click on “Add Menu” on the app.
- On the right-hand side under the “Menu Settings”, click “Add a Menu”.
- Under “Link To”, select “Web Address”.
- Type the URL of the website that you want to add as a menu item.
- Under “Add New Menu”, type the “Menu Name” (e.g. website name).
- Click on the “Tick Mark” to save the menu item.
- The menu item will be added to the menu.
- You can add multiple websites as menu items.
- Click on “Save” in the top right corner. The changes will be saved to the template.
How to Manage the Menu
You can edit a menu item, duplicate a menu item, or delete a menu item. Even you can change the order of the menu items with drag and drop.
- To edit a menu item, navigate to “Apps” -->” App Template” in the CMS.
- Click on “Customize” to go to the VD (visual designer) console.
- On the right-hand side, under the “Menu Settings”, click on the “Edit Icon”.
- Make the necessary changes and then click on the “Save” on the top right corner.
- To duplicate a menu item, click on the 3 dots on the right-hand side of a menu item.
- Click on “Duplicate”. The menu item will be duplicated.
- To remove the menu item, click on the 3 dots on the right-hand side of a menu item.
- Click on “Remove”. The menu item will be removed from the menu.
- To change the order of the menu items, use drag and drop action.
- Click on “Save”. The changes will be saved to the template.
