How to Add E-Commerce to Mobile App?

E-Commerce module is a module that allows you to sell products online within your app. You can prepare a specially designed mobile app to increase your sales by using the E-Commerce module. You can easily get online payments and get billing information.
E-Commerce

The steps in the E-Commerce module are as follows, you can click to go to the section you need or you can continue reading.

  1. Settings
    a. Definitions
    -Currency Unit
    -Delivery Conditions
    -Refund and Cancellation Policy
    -Distance Sales Contract
    -Notification Emails
    b. Payment Settings
    -Cash on Delivery
    -Transfer/EFT
    -Payment Provider (iyzico)
    -Paypal
    c. Shipping Settings
    -Fixed-price
    -Free Shipping Threshold
  2. Products
    -Product Information (Information that will appear in the app)
    -Product Information
    -Product Images
  3. Orders

In order to use the E-Commerce module, you must have any Premium account from MobiRoller. If you have a free package, the information provided after this step can not be used in your account.

The E-Commerce module is not currently up to date within the MobiRoller Preview application. You should generate APK for the test.

How to Add E-Commerce Module?

Regarding adding the E-Commerce module to your app, you should click the Content tab on the left menu of your panel and find the E-Commerce module from the list of active modules and click the Add to App button.E-Commerce

You will be asked to fill out two sections on the screen that comes up. These sections are:

Title: Your e-commerce module will appear with this name in the app.

Short Description: This section will appear just below the app title. It is an area where you can provide brief information about your sales or products.

After filling out in these fields, save them by clicking the Save button in the upper right.E-Commerce

After this stage, you need to make settings for the module. Click the Settings tab in the E-Commerce section of the left menu.E-Commerce

Settings

Some sections need to be completed on the settings screen:

  1. Definitions
  2. Payment Settings
  3. Shipping Settings
E-Commerce
1.Definitions

The fields in the Definitions tab are as follows:

  • Currency Unit
  • Delivery Conditions
  • Refund and Cancellation Policy
  • Distance Sales Contract
  • Notification Emails

Currency Unit: You can choose which currency the products you sell in the app will be sold.

Delivery Conditions: In this section; you should give your users detailed information about the delivery of the products you offer for sale within the app. This section is a special screen prepared for you to make various designs. You can add videos, photos, or write code (Software language should be HTML) and create a screen as you would like.E-Commerce

Refund and Cancellation Policy: In this area; you need to provide your users with detailed information about the products you offer for sale in the app, in which cases they can be canceled or returned. This section is a special screen prepared for you to make various designs. You can add videos, photos, or write code (Software language should be HTML) and create a screen as you would like.

Distance Sales Contract: This field is used to add distance sales contracts. However, you should not enter the contract directly in this field. The prepared contract should be transferred to the web or uploaded to Google Drive and the link of the contract should be entered in this field.

Notification Emails: You should enter the email address in which you will receive the orders sent to you simultaneously.

 

If your application has more than one language option to apply in the terms of Delivery conditions, Cancellation Terms, and Distance Sales Agreement, you will also need to fill in these languages. For instance; If there is an Español option, Español equivalents must be entered in the section marked ES.

After filling out these fields, click the Save button at the top. After that, click on the Payment Settings tab.E-Commerce

2.Payment Settings

You can set the payment types from this tab that your users can use in the app.

There are three different payment options that you can offer to your users in this area;

  • Cash on Delivery
  • Transfer/EFT
  • Payment Provider (iyzico)
  • Paypal

Cash on Delivery: This is an option that you can activate for your users who want to pay at the door. You can add the situations you want to specify in the description section.

Transfer/EFT: The Money Transfer / EFT option, another payment method, provides your bank information to your users and allows you to receive payments via Transfer or EFT. When you click the Add Account button, you need to fill out the Bank Account Information section completely. It is possible to enter more than one bank information.E-Commerce

Payment Provider (iyzico): By activating this field, you can receive payments by credit card online.

We use iyzico as a virtual pos to receive online payments. You can have virtual mail without starting fees, monthly fees, or fixed fees with iyzico. It charges you on the amount you sell. Click for detailed information about iyzico Virtual Pos.

You need to open an account on iyzico and enter the apiKey and secretKey information in this field for the virtual pos to be defined for you. Paypal: By activating this field, you can receive payments by Paypal account.

You can inform your users about the payment via Paypal from the Description section. You must enter your Paypal access token to the Access Token section.

E-Commerce

To get PayPal AccessToken, go to https://developer.paypal.com/ and log in with your PayPal account.

Then click your name in the upper right corner and click the My Account button from the window that opens.

E-Commerce

PayPal images: Ex Ordo

Then click the My Apps & Credentials button from the panel on the left of the screen that opens.

E-Commerce

PayPal images: Ex Ordo

Click and link your email address under Live Account. After linking, click on this email.

PayPal images: Ex Ordo

You will see AccessToken in the window that opens. Click on it and copy it.

PayPal images: Ex Ordo

Paste the AccessToken you copied into Mobiroller panel, so your PayPal connection will be provided.

You do not have to activate all payment options. You can activate one or more of your choice. However, there must be at least one payment option.

After filling these fields, click the Save button at the top. After that, click on the Shipping Settings tab.

3.Shipping Settings

You can set the shipping settings of your users in the app from this tab.

There are two settings you can make in this area;

  • Fixed-price
  • Free Shipping ThresholdE-Commerce

Fixed-price: From this section, you can set a fixed shipping rate for all products ordered by your users. If you wish, you can set a separate shipping fee for each product. If you want to learn to determine the shipping costs for each product, you should continue reading our article.E-Commerce

Free Shipping Threshold: You can set a cargo threshold for all the products ordered by your users by using this field. When your users reach the price threshold you set, they can take advantage of the free shipping opportunity. (Ex: Free shipping for purchases of 11$ and above.)

E-Commerce

After filling these fields, click the Save button.

Products

After the settings, you can add your products for sale.

Click the Products button on the E-Commerce tab in the left menu. You will see a blank product add page.

Click the Add New Product button on the top right.E-Commerce

There are some sections to be completed on the Add New Product screen:

  1. Product Information (Information that will appear in the app)
  2. Product Information
  3. Product Images

You should enter product information in the add new product section.

Product Name: Type the name of your product that will appear in the app by using this field.

Description: It is the part where you can explain your product and explain its features. In this field, you need to create a detailed and eye-catching content for your sales.

The description field is designed as a special screen to create a description area as you wish. You can design and install as you wish. You can add photos, videos, or source codes.

In this field, if there is more than one language option in your app, you must fill this field in those languages as well. For instance; If there is an Español option, Español equivalents must be entered in the section marked ES.

The second part is the area containing product stock and price information.

Stock Code: You should enter a stock code for your product. There is no rule for this code, but you can enter any style as you want.

Product Price: You can enter the price of your product in this field. The price you enter must be the price that includes taxes.

Discounted Price: If the product is sold at a discounted price, you can enter the discounted price to show it. The old price and the discount price will appear as a discount on the app.

Free Shipping: If you activate the Free Shipping button, the free shipping phrase is automatically added to your app for the product you are adding.

Shipping Price: If you have set a fixed price for all products in the Settings section, you can click the Fixed Price button. If you want to set a special shipping fee for the product, you need to activate the Custom button and write the price.

Number Of Stock: Enter the number of products in stock in this field.

Maximum Sales: You can determine the maximum number of times your users can buy this product at once.

Status: Three options are presented in this field; Passive, Active, and Planned. If you choose the passive option, the product will not appear in the app. If you choose the active option, an active shale will appear in the app or continue if it is already on sale. If you choose, planned option, the product will be actively offered on the date you specify.

Product Images: You need to add pictures to this section. Users with Eco Package can upload up to 1 image, Pro package 3 images, and Business package users up to 10 images. After completing these steps, click the Save button.

After adding your products, if you want to change the orders of the products in the app, click on the numbers in the Order Number section of your products listed on the Products tab.

You can change the order of the product you choose from the window that comes up.

If you want to make any changes after adding your products; you can edit by clicking on the pencil icon on the far right of your products listed on the Products tab, you can delete the product you added by clicking the trash can icon.

Orders

You can manage your incoming orders after adding your products. The Orders section is the screen where you can see the orders you receive from the app in detail.

Click the Orders button on the E-Commerce tab in the left menu. The Orders screen consists of two parts:

Filtering: If you have any order and activate the filtering button, you can organize your orders with filtering you set. Filtering is temporary, it only allows you to organize your order list and only you can see it privately. It can help you to find an order you are looking for easily from your long list. You can even use the filtering feature when listing your products.

Orders: From this section, you can see all your orders in bulk. If you click on the window icon on the right side of any order, you can access the detailed information of your order and make changes in its status. Orders that have not yet been reviewed will appear in orange on your list.

The first section on the detailed order screen is about payment information. You can check the payment type selected with payment status, order date, fee, and order number in this field.

In the second part, there is the receiver information. From this section, you can access Name Surname, E-Mail, and Telephone information about the recipient.

From the third part, you can reach the information of the products ordered, delivery, and billing addresses.

Order operations are important for informing the customer. In this field, you can inform your customers about the changes you make. You can change the order status, add notes, or enter the tracking number and company if it is a product to ship. In the notification area, if the box is checked, you can inform your customer with this information when you click the Save button.

You can see the changes made on the order and movements in the timeline in the order transactions section.E-Commerce

You Added E-Commerce Module

This is how the e-commerce module is used. You can send an e-mail to support@mobiroller.com if you have any questions to ask or get an error even though you complete all steps correctly.