How it Works?

MageNative Mobile App Documentation

How to Create Your Store App

Introduction

MageNative App converts WooCommerce store/website to mobile shopping app, fully synchronized with WooCommerce platform to provide realtime data with best user experience. MageNative App will boost your revenue exponentially. This manual will explain step by step process to build and configure the app.


App Installation

Once you buy the MageNative app you can download connector module from "My Purchased Extension" tab in customer account section on our site MageNative. There you will see a list of all purchased modules. In order to download modules first you have to create license for your domain. You can create license by clicking on "Generate License For One Domain".

magenative_license
On clicking "Generate License For One Domain" you will see a popup as shown in image below. There you have to enter your domain name.
magenative_licensepop
Once you successfully generate the license you will be able to download your extension. You can get license information and download link on the same screen and also you will receiv an e-mail on registered email id containing license information. The license key you received will be needed in order to activate your module. We will discuss that process later in this documentation.Screen containing license information and download link will look as in image below.
magenative_download
This module will help your WooCommerce shop to integrate with app. Once you install connector plugin and do little setup on plugin. Your app is now ready to receive Api feeds from your WooCommerce shop.

Follow the below steps to install the connector:-

1)Installation Instructions:

    Automatic installation is the easiest option as WordPress handles the file transfers itself and you don’t need to leave your web browser. To do an automatic install of MageNative WooCommece App plugin:

  • Step 1: Log in to your WordPress dashboard.
  • Step 2: Navigate to the Plugins menu.
  • Step 3: and click Add New.
  • Step 4: Click Upload Plugin and choose the downloaded plugin
  • Step 5: Install it by simply clicking “Install Now”.

2)Activating the Plugin:

  • Step 1: Log in to your WordPress dashboard.
  • Step 2: Navigate to the Plugins menu.
  • Step 3: Choose "MageNative WooCommerce APP" and open settings
  • Step 4: Enable "Enable MageNative Woo App"
  • Step 5: In the "Enter API ID" section fill the unique Header Hash Key or any random combination of atleast 10 alphabets and numbers.
  • Step 6: Click "Save changes" and your MageNative WooCommerce APP plugin is activated.

Build your app

You can build your app from "My Apps" tab in customer account section on our site MageNative. Building an app is a 3 step process. We will discuss each step one by one.


Step 1: Design

This step will decide the look and feel of your app. So in this step you need to provide basic information of your shopping app. Please fill in all the fields and click save to move to next step.

App designing screen can be found as below screen.

magenative_appbuild
  • App Name: The name of your WooCommerce App.
  • Domain Name: The domain of the store of which you want to generate app. If you purchased license for more than one domain then it will be select field otherwise the domain appear only as a label.
  • Base URL: The base url of the store of which you want to generate app. You can get your base url from store->configuration->general->web->Base URL from magento 2 admin.
  • Package Name: The name of your app package. It should be unique and follow the syntax "com. Your_Domain_Name.App_Name".
  • Header Hash Key/API ID: This is a autogenerated secret key.Make a note of it. You need it during configuraing module, Without it your app will not receive API feeds.
  • Category Image: This is the image which will be showed on category list page in app.
    Note: The image shows only if category banner is disabled or you didn't create any category banner.
  • Placeholder Image: This is the image which will be showed untill your image does not loads.
  • Login Page Background Image: This is the image which will be showed in background on login page.
  • Logo: The logo of your app which will be displayed on top of the home page. It must be a ".png" file with a dimension of 1024 x 1024(width x height)px.
  • Logo Preview: This will show you the preview of the logo which you had uploaded in previous field for both android and ios app.
  • App Icon: The icon of your app which will be shown in main menu of your phone.It must be a ".png" file with a dimension of 1024 x 1024(width x height)px.
  • Theme Color: This field will let you to decide the background-color of your splash screen. You can easily select any color from color picker.

App Configuration

Once, you are done with building app and plugin installation, you can configure various features of your app in connector. This section will explain you various ways to configure app using connector.


Configure MageNative App for WooCommerce

MageNative app converts your WooCommerce eCommerce website to a WooCommerce mobile app very easily.


Activate Your Plugin

To activate your module you have to enter the License Key which you will find in "My Purchased Extension".

magenative_activate

Enable/Disable MageNative Woo App Plugin

It is a Checkbox field which is used to enable or disable MageNative Woo App plugin.
To enable/disable module please go to your WooCommerce dashboard -> MageNative Woo App. In the General tab enable checkbox for the field "Enable MageNative Woo App".
Enter Header Hash Key that you will get from "Create Your App" section. Copy/Paste the key into "Enter API ID" field and click SAVE.

magenative_enable

Note: If it is not enabled then your app will not receive API feeds from WooCommerce website.

Uploading Banner Images

This feature enables you to upload promotional banner for your app home page. For managing and uploading banner image go to MageNative Woo App -> Home Page.
To upload new banner image go to WooCommerce dashboard -> MageNative Woo App -> Navigate to the Home Page tab -> Click on “Add New” button located on the right side of Banners text.

WooCommerce mobile app add banner
  • Title: The title for your banner image.
  • Enable: To enable or disable the banner.
  • Choose Image: You can upload banner image from your disk by clicking on browse button.
  • Link to: In the Link to the list, select one of the following options:
    Product in-app: To redirect the user to the Products page available in the Front-end view of the app.
    Category in-app: To redirect the user to the Category page available in the Front-end view of the app.
    Website Page: To redirect the user to the specific link provided.
WooCommerce mobile app save banner
Note: Banner will not show on app home page untill you assign it to banner widget.

Manage Notifications

This feature enables you to upload Notifications for your app. For managing and uploading Notifications go to MageNative Woo App -> Notification.
To upload new notification go to WooCommerce dashboard -> MageNative Woo App -> Navigate to the Notification tab -> Click on “Add New” button located on the right side of Notifications text.

magenative_uploadimg
  • Title: The title for your Notification.
  • Message: Enter the message for notification.
  • Enable: Check the box to enable or disable the notification.
  • Choose Image: You can upload notification image from your disk by clicking on browse button.
  • Link to: In the Link to the list, select one of the following options:
    Product in-app: To redirect the user to the Products page available in the Front-end view of the app.
    Category in-app: To redirect the user to the Category page available in the Front-end view of the app.
    Website Page: To redirect the user to the specific link provided.
magenative_uploadimg