Build & publish your app with AppMySite: A step-by-step guide

AppMySite is a codeless app making solution you can use to create mobile apps for your WordPress & WooCommerce websites.

This guide will go over all the steps involved in building an app on AppMySite, starting from setting up your account to downloading your app and submitting it to the the relevant app store(s).

Getting started

Create an account on AppMySite

The steps below explain how to create an account on AppMySite:

  • Select Start for free on the AppMySite home page.
  • Click on GET STARTED.
  • You’ll now be directed to a new page where you can create your AppMySite account.
  • Start by signing up on AppMySite
    • You can either enter your details or use your Google or Facebook accounts.
  • Upon signing up successfully, you can start building your app
If you already have an account, click on Sign in and login to AppMySIte
Click here for a detailed step-by-step guide on setting your profile.

Start Building an App

You can start by entering the basic details of your mobile application.

  • Fill in the details like your website URL, CMS platform on which the website is set up, the website type, and the name for your mobile application.
  • Select Build App to continue.

Appearance

First, you can design various elements and screens of your mobile app in the Appearance section.

App Icon

  • Start by designing the icon of your mobile app.
  • You can either upload the app icon design or design it yourself in this section
  • The features you get to design your app icon include background & text colors, font size & style, and text content.
REFERENCES
1. App Icon
2. App Icon Design Guide

Launch Screen

After designing the app icon, you can start with the launch screen design. Launch screen, also known as the splash screen, is the first screen that greets your app users whenever they launch your app.

  • You can design your own launch screen with AppMySite or upload a pre-made design for the background and logo.
  • You can use artwork from the AppMySite image library.
  • This section is divided into two main elements, the background design, and the brand logo.
    • Alternatively, you can add simple text on your launch screen instead of a logo.
REFERENCES
1. Launch Screen
2. Launch Screen Design Guide

Login & Sign Up

Next, you can design the login, sign-up, and forgot password screens.

The process can be segmented into three parts: background design, logo design, and the appearance of the fields & buttons.

REFERENCES
1. Login & Sign Up
2. Login & Sign Up Design

Color Theme

The color theme enables you to set the design tone of every screen of your mobile app.

  • You can design two main sections here: the app header that appears on every screen and the button.
  • You can choose from options like header text, color, font, and more to design these elements. Furthermore, you can preview every change on the live screen.
REFERENCES
1. Color Theme
2. Color Theme Design

Home Screen

Next, you can design the home screen of your mobile app. On AppMySite, the sections you can show on your home screen change based on the website type you choose. 

The following sections are visible when you choose ecommerce as your website type:

  • Section Colors
  • Dashboard Header
  • Main Banner
  • Product Categories
  • Sale Products
  • Recently Viewed Products
  • Featured Products
  • Cart
  • New Products
  • Web View
  • Pages

You can customize the home screen by managing the visibility and arrangement of the sections covered earlier. Furthermore, you can also personalize some sections to fit your app’s needs.

REFERENCES
1. Home Screen
2. App Home Screen Design Guide

This completes the app personalization section.

Connectivity

The next step in the process is connecting your website and app. You can do this in the Connectivity section.

  • In the connectivity section, you can connect your website and app. This will enable you to sync website data such as pages, products, categories, blog posts, and menus with your mobile app.
  • This connection will also enable your app to sync any changes made to the website content, categories, menus, products, and more.
  • This section is divided into three main parts:
    • API details
    • Install Plugin
    • Troubleshooting

API Details

  • Generate the REST API keys from your WooCommerce advanced settings and enter the Consumer Key and the Consumer Secret codes.
  • You do not have to generate WooCommerce REST API keys if you choose ‘Blog” as your website type. You can go straight to the Install Plugin section.
Click here for a detailed step-by-step guide on generating the WooCommerce REST API keys.

Install Plugin

  • Once the API details have been entered, the final step is to download and install the AppMySite WordPress plugin on your website.
  • This will connect your website and app.
Click here for a detailed step-by-step guide on connecting your website with the app.

Troubleshooting

There is a possibility that you are unable to establish connection between your website and app. In such a case, you can refer to the Troubleshooting section and discover the issue(s) causing your connection to fail.

By running the troubleshooter, you can discover the exact reason causing your connection to fail. You can then make the changes needed to connect your website and app successfully.

Click here for a detailed step-by-step guide on the troubleshooting.

App Settings

The App Settings section helps you fine-tune the working of your mobile app. It is divided into seven main sections.

General

In this section, you can update the basic information of your mobile app.

  • You can update the URL of your website, website type, and app name.
  • You can also add your Terms and Conditions page URL along with other features.
REFERENCES
1. General Settings
2. Walkthrough

App Menu

You can choose to either import a  website menu to the app or create your own menu on AppMySite.

From your website

You can import any website menu to your app. Within the app, the imported menu will appear as the side menu.

Create your own menu

You can use choose from the following options to create your own menu on AppMySite:

  • Pages: Display CMS pages (about us, privacy policy, contact) on your app menu. You can also select the individual pages you wish to add to your menu.
  • Categories: Add product or blog categories from your website to your app menu.
  • Blogs: Add blog posts to your app menu.

NOTE
You can only choose to add CMS pages to the app menu that are present on your website.

REFERENCES
1. App Menu Settings
2. App Menu Settings Guide

App User Settings

In the App Users section you can configure how your app users login to the app. You can activate guest browsing here along with options to enable social login and more.

REFERENCES
1. User Settings
2. Walkthrough

Product Settings

In this section, you will get to manage the product settings on your mobile app. You can choose to show discount percentage, additional product info, manage product images, enable product search, deliver filter and sort options, and more.

REFERENCES
1. Products Settings
2. Walkthrough

Checkout Settings

In this section, you can manage the options available to your customers during app checkout.

REFERENCES
1. Checkout Settings
2. Walkthrough

Page Settings

In this section, you can enable a web view interface for all your app screens. You can additionally manage web view settings related to hyperlinks and user inputs.

REFERENCES
1. Page Settings
2. Walkthrough

Social

You can simply enter your social media handles in this section. These handles will appear to your users within the app.

REFERENCES
1. Social Settings
2. Walkthrough

App Preview

The App Preview section enables you to preview your mobile app on Android and iOS device emulators.

  • You can test your app’s responsiveness on different cross-platform mobile device emulators on AppMySite.
  • You can also download the AppMySite demo app and preview your app on a real mobile device.
Click here for a detailed step-by-step guide on the app preview section.

Download App

Once you are finished creating your app, it is time to download it. You need to upgrade your subscription plan in order to download an app from AppMySite. Visit the pricing page and choose a plan that suits your needs.

Download Android App

  • Click on the Build App button in the Android section.
  • Click on the Confirm button to initiate the app-building process.
  • Finally, click on Download App to download the Android app.

Android App Build

  • Click on Android App Bundle to generate an AAB build for your Android app.
  • Download the AAB file once the build generation is complete.
REFERENCES
1. Download App
2. Download Android App Guide
3. Upload Android App Guide

Download iOS App

  • Click on the Build App button in the iOS section.
  • Click on the Confirm button to initiate the app-building process.
  • You’ll be asked to submit a few documents generated from your Apple developer account.
  • Finally, click on the Download App to download the iOS app.
REFERENCES
1. Download App
2. Download iOS App Guide
3. Upload iOS App Guide

App Addons

You choose from a range of addon products to get additional services and functionalities for your mobile app.

Click here for a detailed guide on our add-on products.

Submit App to App Stores

You’re at the final step of the process now. Once you’ve downloaded the Android and iOS apps from AppMySite, you’ll have to submit them to the app stores for publication. Both Google Play and App Store have different procedures for app submission. Once you submit the apps, they will be reviewed by the respective app stores.

How to submit an iOS app for publication on the Apple App Store?
How to submit an Android app for publication on the Google Play Store?

NOTE

You'll need an active developer account with Google Play Store and Apple App Store to submit your apps.
Click here for a guide on creating a developer account on Google Play Store
Click here for a guide on creating a developer account on Apple App Store

Account Settings and Profile

The steps below highlight how to update and manage your AppMySite account:

  • Click on your profile icon in the top-right. You’ll see the following options:
    • My Apps
    • My Profile
    • Billing & Payments
    • Log Out

My Apps

  • You can view all the apps you have made with your account on the My Apps page.
  • You can select Create New App to start building a new app with your account.

My Profile

In this section, you can enter and update your profile details and billing details. These details will be used for any correspondence and/or transactions with AppMySite. You can also request to delete your account here.

Change Password

Update or reset your password here. Simply enter your old and new passwords to update the password of your account.

Billing & Payments

In this section, you’ll find details on all the subscriptions and transactions you’ve made under your account on AppMySite.

REFERENCES
1. My Profile
2. Account Settings Guide