Introduction to Mobikul
Give your customers an incredible mobile app experience by seamlessly converting your Shopify store into a Native Mobile Application using Mobikul.
Ahead in this document, we are going to discuss the installation and configuration of this app. Before that, let’s put a highlight on some of the features.
Highlights of Mobikul app
- A flutter-based hybrid app designed to be customer-centric which enables shoppers to have a complete online shopping experience from their smartphone and tablet devices.
- Simple configuration with customizable home page and side panels of the mobile application.
- Moreover, real-time product and order synchronization between the Shopify store and the mobile application.
We provide support to publish your mobile app on play store and app store.
How to install Mobikul app?
The app can be easily installed by visiting the landing page. All you need to do is enter your store name & click on the Get This App button.
You can also install this application from Webkul Store.
Once you click on the Get This App button, you’ll land on this following page:
Click on Continue setup
Further, click on start free trial
Once done with the installation, the mobile sales channel application will be listed under the Online Store menu on the left-hand side panel.
From the Dashboard, you can add mobile cards.
The card is a preview of detailed content a user sees on your mobile app. This can include text, links, multimedia, graphs, and captions.
Types of cards:
- Product Slider
How to add cards?
To add cards, click on the Add Card button as highlighted in the image above. This is the page you’ll be redirected to:
You can select the type of card that you want to display, i.e., Slider, Banner, Grid, Carousel, List, Product Slider. Further, enter a card title, you can hide card title if you don’t want to show it on the frontend.
You can add one slide at a time. To add one, you need to select either one product or one category at a time. Further, you can upload an image that will be shown on the frontend.
Below this, you’ll have a section to add a link to view all button (this is optional: uncheck the box to hide). In other words, when your customers will click on the view all button, they will be redirected to the collection/category that you have selected from here.
Once you add a slide, it will be displayed in the slide listing section. Refer:
Similarly, you can add multiple slides to a card.
The added cards will be listed on the dashboard. You can set the position of the cards by dragging & dropping them as per your choice. Refer:
You can edit the cards by either clicking on the customize menu or by clicking on the edit button. Similarly, it can be removed by clicking on the delete button.
When you’ll hover over the configuration menu, the card config button will take you to the same add card page. You can use this to add a new card as explained above.
Side Panel Configuration
When you’ll click on the Slide Panel Config button from the configuration drop-down, you’ll be redirected to the following page:
Use this section to add side panels on the mobile app. To add a section, click on the Add Section button. This action will give you a pop-up as shown below. Here, you’ll need to enter the section title.
Now after adding a section title, you’ll need to add items under this section.
Example: If you have added a product listing section, further you can add items in it like Men’s Catalog, Women Catalog & Kids Catalog.
To add an item under this section, click on the > icon. Refer:
Clicking on the Add Item menu will give you a pop-up. Here, you’ll need to enter a title for the item, select a category and click on add. You can also enable/disable the item.
Furthermore, you can add multiple items to a section by clicking on Add Items button. Also, multiple child items can be added to a parent item by clicking on Add Child Item button.
To get the mobile demo, click on the following button (refer to the image below):
This will give you the following page:
Note: Enter the shop name & token provided in the mobile demo page as shown in the image above.
To have the demo, you need to scan the following code, enter your shop name & token.
When you’ll click on the Need Help button, you’ll be redirected to the following page:
Use this section to request us regarding Mobile App, Configuration or any other issue. All you’ll need to do is mention your name, email ID, request for and a message. Click on send message & we’ll get back to you as soon as possible.
Check out the frontend documentation: Explore!
Furthermore, drop your query/suggestion at firstname.lastname@example.org or create your ticket at Webkul UV Desk.