Skip links

Guide to use

This guide shows you the way to install FluxBuilder and how to use this awesome tool. You can refer and subscribe to the Youtube InspireUI Channel for free instructional videos.

Full document of FluxBuilder is in https://support.inspireui.com

1. Download and Install

Where to download FluxBuilder?

Windows and MacOS: download the latest release here. Then unzip and install it following this video.

2. Guide to use

This FluxBuilder tool is compatible with these websites: WooCommerce, Woocommerce Multi Vendors (with Dokan or WCFM), Shopify, Opencart 3.x, WordPress, Magento 2.x, Prestashop, StrapiListeoMy ListingListingPro. To see how your app looks like and customize your app Design, do these steps:

Step 1

Sign up a new account and Sign In successfully following this video. Please use English keyboard.

Step 2

Integrate with your Website following this video. Please choose the correct framework.

  1. Select “DASHBOARD”, then “Create New App”:
  1. Input your domain/website’s information as image below. Do not input sub-folder domain like this https://yaari.store/pk-en. Please change to subdomain or main domain. FluxStore apps does not support the sub-folder domain because it causes Rest API issue.
  • If you get failed at Analyze Connectivity screen, please check the solution below:
Failed item Solution
  Make sure you do not input sub-folder domain like this https://yaari.store/pk-en. Please change to subdomain or main domain
  Make sure you input https instead of http
Permalink Setting Check your backend to see if it works https://your website/wp-json/wc/v2/products?consumer_key=your ck key&consumer_secret=your cs key
CS & CK Authorization Please input your Consumer Key and Consumer Secret, following this guide.
CS & CK Validation Make sure you have inputted the correct Consumer Key and Consumer Secret
Pages Connectivity Please ignore it. We will remove this item.
WooCommerce Connectivity Your REST APIs are not enabled on your website, please follow this guide
PrestaShop Connectivity It could be missing the PrestaShop plugin on your site. Please follow 6. FluxStore PrestaShop to install this plugin
Magento Connectivity You could install this extension to active the API integrate with the app following this guide 2. FluxStore Pro (Magento)
WCFM Connectivity Missing WCFM Rest API. Please install WCFM Rest API plugin to solve it.
Dokan Connectivity Missing Dokan Rest API. Please install Dokan Rest API plugin to solve it.
Opencart Connectivity You could install this extension to active the API integrate with the app following this guide 3. FluxStore Pro (Opencart)
Listing Connectivity Your REST APIs are not enabled on your website, please follow Step 1: Setup Rest API
  • If your products or its images are not displayed, please setup the Regenerate Image plugin following this guide. After setup, please be sure your site plugin has regenerated thumbnail like this https://tppr.me/ckgYZ
  • If not solved, please double check this guide. If you see the API works, it is okie.
  1. Select a template for your app:
The simulator just shows the app Design, not features. So don’t click to test features on the simulator. To customize the Features of app, please click Features on the left menu.

Step 3

Customize the Design and common Features of your app. Please press & hold in 3-4 seconds then drag & drop.

Video guide:
Edit the TabBar 
Edit the Layout
Edit the Homepage
Edit the Detailed Blog Settings
Edit the Templates, App Info, Left menu (Side menu)
New Left menu (Side menu) 1.3.0
New Templates 1.3.0
New Settings / Profile page 1.3.0
Enable Cart Quantity on Products Horizontal
Edit AppBar
Edit Splash screen

Customize the Features

Step 4

You can export the customized design and feature files to save them into your FluxStore/FluxNews source code following this video.

Click Features on the left menu, then Export Data. (make sure you already activated the license, by inputting your purchase code of FluxStore app)

env.dart file is the customized Features. Click EXPORT to get this file and replace the lib/env.dart file in the source code of FluxStore app.

config_en.json file is the customized Design/UI. Click EXPORT to get this file and replace the lib/config/config_en.json in the source code of FluxStore app. The config_en.json is English language. For other languages, you just need to change the name following this guide (e.g. config_ar.json is Arabic).

Remember to update the lib/env.dart file with your website’s information, example FluxStore Multi Vendors app https://tppr.me/RVJT4

Step 5:

If you purchased the Extended License, select Build on the left menu to automatically build IPA and APK files following this video.

If you purchased the Regular License, follow this guide to install on android studio and build your own app on both iOS and Android.

Check out Flutter apps can use with FluxBuilder tool

Read more information about FluxBuilder

If the product is useful, please feel free to give us 5 ⭐️ Rating. Thank you & happy coding ☺️