The usage of mobile devices has increased quite a lot in the past decade. That too, when we consider online shopping, everyone prefers to shop from the app on their smartphone. Hence, more businesses are willing to make extra efforts to be available on mobile platforms. For eCommerce businesses, having a mobile app with a dynamic & customizable home-page design helps them to keep their customers engaged in a profitable manner. Every time, a new offer/ new-arrival/ sale/ etc. is put up on the shopping app, making the customers aware of it can naturally boost their sales. The most organic way to do so is by optimizing the home-page design of the shopping app (apart from push notifications & other campaigns).
To make the home-page designing & re-editing easier for store owners, KnowBand has developed eCommerce Mobile App Builder extensions. It helps the eCommerce businesses with building their eCommerce Mobile Apps & also offers feature-rich backend & frontend to benefit the app users as well as the businesses. This tutorial write-up will elaborate on how to use the WooCommerce Mobile App Creator plugin to create, design & edit the dynamic home-page layouts of the Mobile Apps.
Once this WooCommerce Mobile App Builder plugin is installed on your WooCommerce website backend, you can easily customize the home-page of your app from the backend of this plugin.
- Select ‘Home-Page Layout’ from the side menu.
- To create a new layout, click the ‘add new layout’ button. You can also re-edit the existing layouts. Also, you can pre-design multiple layouts & keep any one of the active (from the General settings on the side menu).
- While designing or editing your app home-page layout, you can use a maximum of 20 components (from the complete list of different components shown in the side menu on the left). Hence, you can also use a single component multiple times in your layout
- Upon adding these components, you can edit each one of them & organize them using the drag & drop feature.
All the edits that you make instantly reflect on the demo app screen as shown in the screenshot above.
Components To Design Your WooCommerce Home-Page Layout:
1. Top Categories:
In a slider form, you can display small image icons with landing page links to relevant categories on your app. You can add a total of 8 of such categories in a single ‘top category’ component.
2. Square, Grid & Horizontal-Sliding Banners:
For all these 3 banner types, you can choose the landing page options among category pages, product pages, home-page & even any of the CMS pages.
3. Square, Grid & Horizontal-Sliding Products:
With these 3 components, you can display singular products redirecting the app user straight to the specific product page. Because this WooCommerce Mobile App Builder plugin also lets you set featured product listings. You can choose among the following options to display the products:
- Best Seller Products
- New Arrivals
- Featured Products
- Special Products
- Products from a category
- Custom Products
4. Recently Accessed Products:
Including this component anywhere on the layout simply creates a horizontal slider for products displaying only the products that an app user has recently viewed. It is ideal to add this component only once in a home-page layout.
5. Countdown-Timer Banner:
The count-down-timer banner has an in-built countdown timer with all the necessary settings to make it your own. You can use it to inform your app users about an offer that is ending in a specified time.
Apart from all the edits, you can make to design your WooCommerce App’s home-page, there is one more useful thing that’s present all the time on your app’s screen. It is the bottom tab bar navigation in shopping apps.
Wrap Up:
By now, you must have understood how user-friendly it is to create, design & edit the home-page layout of a WooCommerce Mobile app using the WooCommerce Mobile App Maker plugin by KnowBand.
From time-to-time, eCommerce apps do have to change their home-page layout to complement different offers, seasonal sales, new arrivals, etc. Hence, to make it feature-rich yet easy for the store owners, our experts at KnowBand have developed this WooCommerce Mobile App Maker plugin. You can even go through the demo of this plugin before you decide to purchase it.
Explore more on detail from below Video & drop us your message on support@knowband.com in case of any query: