How To Setup Mobishop

1

Step one: Frontend

Install MobiShop extension like you install order third party extensions. After a successful installation, a sub category of block called MobiShop will be created.
Click on the the subcategory name and it will show you all the blocks related to MobiShop.

Drag and drop any shop front you want to use like the fashion shop block,
electronics shop block,
vegetarian shop block,
quickview shop block e.t.c and many other shop block to choose from.

Customize the shop front block you choose from the setting cog. Starting from choosing the number of product you want to sell, after that change the theme color, background color and others.

Then very important select update product id and you will discover that the product ID of each product will be visible, make sure that all the product on the shop has a unique product ID and has no space or special characters. When you are through with setting of product id, select save product id agian from the setting cog and the product id will be invisible but still on the block.

Important: Open the mobirise shop tab and drag and drop the shop cart block to you shop page.

The shop cart block is the main engine that connect the MobiShop front end design with the MobiShop backend application, and without adding this block to your page will result in you not noticing any effect when you click on Add to Cart button. What I am saying in essence is that you must add one shop cart block to you page if you want to connect your shop backend with your front end.

The Shop Cart block is an invisible block when you publish your website, just disable the notification information from the setting cog and you will only be left with the shop image, the reason for the image is that if the image is removed like the text, you wont be able to see the block parameters.

After adding this Shop Cart block to your page, on preview you will notice that the add to cart is now active. But nothing much will happen on the preview mode, because you have not setup the backend of the Mobishop.

Now that you have setup the frontend of Mobishop, let's move to the step two which is the backend.

2

Step Two: Backend

I know that you will be asking, we're is my shop backend and how can i set it up?

To access your shop backend, publish your shop to a PHP enable server for example: if you publish your website to your server, with the domain name www.mydomainname.com you can access your shop backend using www.mydomainname.com /assets/mobishop/

At first access to the above url the extension will launch a configuration wizard that will guide you in setting up of your shop backend such as dashboard login email and password,, theme color of the dashboard, payment gateway configurations : such as PayPal,payfast,paystack e.t.c

For the notification/ipn/webhook handlers url

For Paypal : https://www.yourdomainname.com /mobishop/notify.php?type=paypal

For Payfast : https://www.yourdomainname.com /mobishop/notify.php?type=payfast

For Paystack : https://www.yourdomainname.com /mobishop/notify.php?type=paystack.
Should be added to your webhook on your paystack dashboard.

Note: That if you dont have SSL installed on your server, then change the https:// to http://

3

Step three: Settings tab

I assumed that you have configued your shop backend and have logged in to your dashboard.

Now the first thing to do is to click on the settings and configure how you want your shop to function, if you fail to configure the settings, will result to display of server side code error while trying to add to cart from the frontend.

shop cart configuration:
Set up the currency of your shop, max shipping charges, free shipping e.t.c

Important note: Any amount be it product price, product vat, product shipping cost, free shipping cost and max shipping cost should be in two dicimal point explame: $20 should be 20.00 without currency icon.

Payment Configuration:
Set how you want shop to process payment.

If you choose Automatic processing: The payment processor notification ipn will enabled on PayPal and payfast payment processor which means that the system will be on autopilot in handling payment status update and if your product is a digital products, handling of adding the downloading url to the tracking platform.

Choosing Manual processor will result in you handling the payment status update and if you are selling digital products, you will handle adding downloading url to the tracking platform manually.

Mail Notification Configuration:
Here you configure how you want the shop system to send email notification to you and your customer when an order is made on your shop.

SMS notification configuration.:
You can integrate your Bulk SMS gateway api into the system by configuring the variable name and it values and also the api request url and the encoding type.

That is all on the Settings.

Now let's move to the Manage product.

4

Step four: Manage tab

On the product tab, you see the list of product you have on your shop. By default you have an empty product.

Click on add new product button and fill the form with your product information and click process button to save the product to the database.

Important note: The product id, name and product price must match with what you have in your mobirise shop frontend design.
If your product is a digital product, then add the download url of the file and the system will handle the given out the product url to the buyer after the payment is confirmed and approved.

Note: That is if you chooses Automatic payment processor on the shop setting on the step three.
For the remaining number of product and availability of the product, I added that for future feature that I will be adding to the shop.

5

Step Five: Customers tab

This tab does nothing else than to show records of your unique customers, as this extension progresses in version we can use that to setup another feature for MobiShop extension.

6

Step Six: Sales tab

This tab is also known sales records keeper. Here you find record of all the orders placed on your shop, you can also perform many task such as view invoice, update tracking information, send email to the customers about the purchase and finally update order information.

In future release I plan to add inventory system to this tab, so the shop owners can see how much they have made and track pending purchases. Also i plan to add the ability to delete unpaid order that has passed some days without payment.

How To

How to use MobiShop

Follow below step to Install and Setup Mobishop

1