WooFlux

Universal Mobile E-Commerce Flutter App

Initial Configuration JWT
  • Replace WOOCOMM_JWT_USERNAME & WOOCOMM_JWT_USERPASS in consts.dart with your own wordpress username and password
  • Install ->jwt auth plugin https://wordpress.org/plugins/jwt-authentication-for-wp-rest-api/
  • Install ->WooCommerce Multivendor Marketplace – REST API https://wordpress.org/plugins/wcfm-marketplace-rest-api/
  • wp-config.php ->add below line in wp-config.php define(‘JWT_AUTH_SECRET_KEY’, ‘your-top-secret-key’);
Compiler Setup
  • Open project in Android Studio/Xcode
  • Pub get yaml
  •  Open WP WooCommerce 
  • Do change as in Settings and Advance 
  • Copy and integrate it into App Code

Upload Files
  •  Open cPanel and click on the File Manager option.
  • Click public_html -> wp-content -> themes -> “your current theme folder”.
  • Download dashboard_api, categoryProducts_api, productSearch_api and productbyId_api.php files and upload these files in the themes folder. 
  • For dashboard_api, go to WordPress Admin Panel > Pages > Add New. Give this page the title of Dashboard and on the right side of the page, in the Page Attributes -> Template option, select our custom template “dashboard” and click Publish.
  • Now repeat the above step for the rest of the php files.
  • After setting apis .go to page > permalink >URL Slug and set following for above apis 
  • For dashboard Template -> dashboard-api as URL Slug
  • For productbyId Template -> product-by-id as URL Slug
  • For productSearch Template -> product-search-api as URL Slug
  • For categoryProducts Template -> category-products-api as URL Slug
Change Project Name & Icon

For Android:

  • Go to Android drawable folder and replace icons
  • Open Android project and go to manifest and change appname

For IOS:

  • In Xcode, change app name easily
  • To change icon, get icon “AppIcon.appiconset”  folder from any iOS assets software and change accordingly

For App:

  • Go to Wooflux code “/lib/utils/consts.dart” file and change Appname accordingly
  • Go to Wooflux code “/assets/logo.png” and replace logo.png file accordingly

For WCFM Users Only

  • Install Wcfm plugin
  • Install Wcfm restapi plugin
Change Package Id
  • Open project in Android Studio/Xcode 
  • In Xcode, change package name easily
  • For Android, change Id in Gradle file, Manifest, MainActivity and Folders.
  • Clean project
Analytics Setup
  • Open project in Android Studio/Xcode 
  • Setup new project in Firebase
  • Enter your company unique Id for both Android /IOS 
  • Get Google file and paste it into project
  • For further help, check Google Analytics
Login Setup
  • Register app in Firebase
  • Go to Firebase Console > Project Settings > General and add Support email
  • Go to Firebase Console > Authentication  and enable “google,fb,apple” login options
  • Go to https://developers.facebook.com/apps select your app and enable Facebook Login, also fill Basic and Advance settings 
  • Update fb ids in android string.xml file and ios info.plist key”FacebookAppID”

For Android:

  • Go to Firebase Console and get google-services.json file
  • Go to Wooflux code “/android/app” and paste google-services.json file
  • Generate keystore: https://developer.android.com/studio/publish/app-signing
  • Open Android folder in Android Studio , get SHA1 from gradle SigningReport and paste it to Firebase “project/setting/general/android app/SHACertificateFingerprint”

For IOS:

  • Go to Firebase Console and get GoogleService-Info.plist file
  • Go to Xcode project “/ios/Runner” and paste GoogleService-Info.plist file
  • Copy REVERSED_CLIENT_ID from GoogleService-Info.plist and paste it into info.plist
  • Change In info.plist URL types->URL identifier
  • Also change  In info.plist URL types->URL Schemes for both google and fb

Update Apple Login:(excluded) dont attempt

  • Go to Wooflux code “/lib/screens/loginWidget.dart” file then in appleSignIn method change clientId with your app unique id

Update Facebook Login:(excluded) dont attempt

  • For Android, follow instructions at Facebook Login for Android For IOS, follow instructions at Facebook Login for IOS
 
Payment Setup

Paypal:

Follow instruction and change PAYPAL_SERVER  & PAYPAL_AUTH_USER & PAYPAL_AUTH_PASS in flutter project directoryWooCommerceProject->/lib/utils/consts.dart using this 

Tap:

Follow instruction and change TAP_SERVER & TAP_KEY in flutter project directory using this 

Others Setup
  • After setup project open iOS project in Xcode and install pos lib as “https://cocoapods.org/”
  • Make sure your currency inside app and on Braintree developer console must be same as per your woocommerce store .
  • On code currency change open flutter folder project in android studio go to PaymentBraintree.dart class and change “currencyCode” variable
  • On Braintree currency change go to developer console and change currency as your woo commerce currency
Install App Now

App is available for testing on GooglePlay and AppStore

Note

If you don’t want to spend time in integration and save time you can also contact us and we serve as freelancer to integrate your project in short time with everything working .

Extra Docs Help

For help getting started with Flutter, view online documentation(https://flutter.dev/docs) which offers tutorials,samples, guidance on mobile development, and a full API reference.