Back to Top

Opencart Hybrid Mobile App

Updated 19 November 2021

Introduction

After dealing with multiple successful Mobile App, Mobikul has now come up with a new Hybrid app. The Opencart Hybrid Mobile App is meant to convert your website on default Opencart to an app.

The app is more advanced as it uses the functionality of a Web app over a native container.

It uses the theme of the website and could be downloaded from Google Play Store and iTunes store. The app provides the customer view of the website.

The app will allow the customer to shop for the products from an app which will operate on the smart devices in their hand. Thus, aiding the store owner to generated more profit.

Searching for an experienced
Opencart Company ?
Find out More

Check the overview – 

AFqsXS5Nsws

Check the configuration –  

YQ2gw4Hdp3o

Feature

  • Quick creation of the apps which are much efficient.
  • A consistent theme of the website and mobile app which enables easy navigation.
  • Supports social login (Facebook, Twitter, Google, and LinkedIn)
  • Push notifications are supported.
  • OTP (One-Time-Password) verification available (*Add-on)(For OTP feature in-app it needs to be enabled on the web-end).
  • Opencart storefront customizations & features are also available in the app
  • Fully responsive and supports various mobile devices and tablets
  • Real-time synchronization with the web store – products, categories, orders, customers, etc.
  • Multi-lingual compatible including Arabic RTL
  • Mobile app source code is available (Purchased Separately)
  • Opencart Hybrid Mobile App is fully customizable as per your requirements

*All Add-ons comes underpaid customization features.

Note-

  • For a responsive theme, your website theme should also be responsive.
  • The pages here are as per your default Opencart store which changes as per website.

Publish On Google Play & Apple App Store

After receiving the prerequisite information, your e-commerce hybrid mobile apps will be instantly developed and will be published on Google Play Store and Apple App Store.

You can publish your mobile apps either from your own account or choose Webkul’s Google Play and Apple App Store account. So, you can get the APK and IPA files once the apps are developed completely.

Play_store

Now, let us walk through the Opencart Hybrid Mobile App and see all the features and functionalities it has.

Installation

Installation Process –

Customers will get a zip folder for installing the module. They will unzip this folder on their system and choose the version according to the Opencart version that you want to install.

So, to install this module version, first, you need to transfer the admin & catalog folders into the Opencart root folder on the server.
installation

After transferring the folders, use extension installer for uploading the XML files- hybrid-app.ocmod.xml which you will find in ocmod folder.

BT2

After that in Admin panel go to System -> Users -> Usergroup and edit ‘Administrator’ and choose select all for both Access and Modify Permission and save it.

Opencart Marketplace Multi vendor Module

Thus, after that Under Extension > Module, the Hybrid Application By Webkul will be present.
 
extension_module_app
 

Admin Configuration

The admin can click on the Edit button to set the configure the module for the hybrid app.

Hybrid Store- The admin can select the name of the store will have the app.

General Settings –

general_admin_configuration

  • Status- The admin can set this field as ‘Enable’ to use the app.
  • Store Logo- The admin can add the logo of the store. The admin needs to mention the logo if the application logo is different from that of the website.
  • Exclude Modules From Website- The admin can select here those apps which are part of the app but must not be a part of the website.

Likewise, if there is a module for WhatsApp chat then it can be part of the mobile app but it has no relevance in the website.

  • Modules For Application-The admin can check on those which module that is present in the app irrespective of the website.

Social Login-

This section will have the details which will allow social login via various social media login platforms-

webkul_opencart_hybrid_mobile_app_social_login

Facebook –

  • The admin will set the status Enable to make the Facebook social login live.
  • The admin needs to enter the Application Id and Secret key for enabling the Facebook login in the app.

Twitter-

  • The admin can Enable the Twitter Login from this section.
  • The admin even needs to enter the consumer key and secret key.

Google-

  • The admin will set the status Enable to make the Google login live.
  • The admin even needs to enter the Client Id and secret key.

LinkedIn-

  • The admin will set the status Enable to allow login via LinkedIn.
  • The admin even needs to enter the consumer key and secret key.

Thus, allowing a facility to the customer for fast login functionality. This will remove the requirement of remembering any extra login details.

NOTE: Facebook, Twitter, Google, and LinkedIn social logins are free with the Opencart Hybrid Mobile App. For the integration of login using the other social media website it will be a paid service.

Push Notifications-

General-

Push_notification_general

  • Server Key- The Firebase server key needs to be entered here, for sharing of push notifications.
  • Order Notification Title- In case of Order the customer will receive a notification for which the admin will mention the title here.
  • Order Notification Message- The admin will mention here the message for the placed order.

Push Notification Topics-

Push_notification_topic

  • All- The admin will mention here the notification topics that will be sent to all the customer on the store.
  • Customer Group-The admin will mention here the notification topic as per the customer group.
  • Guest customer- The admin will mention the notification topics which will be sent to the Guest Customer.

However, here the customer can share the notification by clicking on- Send Message.

The admin can fill in the Push Notification details to create a notification which could be shared with the customer.

Push_notification

  • Previous Message– This will allow the admin to share the same message as in some previous message.
  • Notification Language– The language in which the admin wishes to share the notification. This will increase the interest of the customer.
  • Topics– The admin can select the customer with whom the notification could be shared.
  • Title– The complete title of the notification concern to the notification.
  • Message– The complete detail of the notification in the form of the message.
  • Banner– The banner that is having the information about the notification.

Finally, the admin can click on send to share the notification with the customer. Thus, the admin can enter these configure the app to make the store usable.

The Mobile app owner can configure the module from the admin panel. So, to know about it- Opencart Hybrid Mobile App Admin Configuration.

Homepage

Post installation of application the customer opens up the app. The app opens up with an introductory splash screen followed by an informative Homepage.

homepage

This homepage contains multiple functionalities with which customer can engage themselves with to remain connected with the app. Therefore, it mainly comprises of-

  • List of Featured Product
  • Categories
  • Banner
  • Contact Us
  • Register/Login
  • Wishlist
  • Cart
  • Checkout
  • Search
  • Multiple Currency
  • Language Change

This section contains a list of exclusive products which admin or store owner wishes to showcase on the homepage. This will act as a showcase to the customer. Thus encouraging them the purchase of more products.

featuredproducts

Categories

This section is meant to list in the set of the category, that the customer can use to navigate to view the site. These categories are linked to Sub-category(ies), then it can be re-directed towards the Collection page.

Now the customer can select a product to view the product detail page.

categories

Collection List and Products

The customer gets redirected towards the collection page on clicking a particular category. The customer can click on a particular product to visit the product detail page.

Here on collection page, the customer can sort the product list and set the number of items that will be visible on the page.

However, on the moving to the product page, the customer can view detail of the product like the description and features of the product. Accessing the products the customer can easily add the products to the cart by clicking on ‘Add to Cart’ by stating the quantity of the product.

The customer can write a review of the product from here post usage.

collection_pagecollection_page_options
product_pageproduct_page_details

The banner can be used by admin to showcase various store related information like Sale, offer, new arrivals, etc. This can be done on Default Opencart by following the navigation, Design>Banner.

banner_admin

So, the Banner can appear in the form of a slide that customer can glide through.

banner

Contact Us

The Contact us page can be used by the customer to view the Contact details of the admin. It mainly comprises of Address, Telephone number and contact form.

contact_uscontact_us_2

Register/Login

A customer can easily Register in the application by filling in the registration details like First and Last Name, Email address, Telephone number, and Password. The customer can even subscribe to the newsletter and accept the Privacy Policy.

Then the customer can login the application by entering the E-mail address and Password.

registerregister_2
login

Account

The section contains the personal detail of Account holder. The customer can navigate through- My Account>Edit Account. This section comprises of multiple details like-

  • First Name
  • Last Name
  • E-mail
  • Telephone.
account_personal_details

Password

The customer can update there password by navigating to Account>Password section. The customer now can update the password of there account anytime easily.

Password_update

Address Book

The customer can save detail address which can be used at the time of checkout. The customer can follow the navigation as- Account>Address Book>Add Address.

address_book
add_addressadd_address_2

Orders

This section is meant to display the list of the order placed by the customer. So, the customer can view the orders and verify the status of the order.

orders

Wishlist

The customer can add the product to wishlist and buy it later. Multiple products can be added to the wishlist and can be shared with friends as well.

wishlist

Cart

The customer can easily place the product in the shopping cart and view them later on to purchase the product. There is an icon of the cart on the top right corner. On clicking the icon the customer can view the list of products.

cartcheckout_option

Checkout

The customer can then click on checkout button in the cart page to redirect to checkout section. Here in the checkout page the customer can re-check or re-enter the billing address as well as the shipping address.

checkoutcheckout_2

Then the customer can select the desired shipping method as per choice.

Note – All the shipping methods that are available on the Opencart web store will be visible on the mobile app as well. Hence avoiding the requirement of separate module/integration work.

After which the customer can select the desired Payment Method.

Note – All the payment methods that are available on the Opencart web store will be visible on the mobile app as well. Hence avoiding the requirement of separate module/integration work.

checkout_3checkout_4

Finally, the customer can review the order and place the order as per wish. The customer will see a success message once the order is placed.

confirm_orderorder_success

For quickly finding the products from the catalog, the customer can use the search box and type a name or, word or phrase that describes the product. The results will start appearing that matches the search query.

searchsearch_product

Currency and Language

The app supports multilingual feature where the customer can set the app as per the desired language. This is one of the major components to attract the local customer.

multi_lingual

The customer can select the desired currency as per choice among the choices provided by app admin.

currency

Both the method localizes the application to the desired choice which could help in the attraction of maximum customer.

Support

That’s all for the Opencart Hybrid Mobile App, still have any issue feel free to add a ticket here – webkul.uvdesk.com and let us know your views to make the module better.

 
 

Current Product Version - 1.0.1

Supported Framework Version - Opencart- 2.0.x.x, 2.1.x.x, 2.2.x.x, 2.3.x.x, 3.x.x.x

. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


Be the first to comment.

Back to Top

Message Sent!

If you have more details or questions, you can reply to the received confirmation email.

Back to Home

Table of Content