AppCommerce Setup

AppCommerce is currently in beta and not available to all customers.

Requirements:

  • AppPresser plugin setup and active
  • AppCommerce plugin active
  • WooCommerce 3.5 or later active, with API enabled
  • Cart, shop, and account pages created in your app

Setup at a glance:

  1. Install and activate the AppCommerce plugin
  2. Activate the WooCommerce REST API, and generate a read-only key
  3. Add your key and secret in the app integration settings
  4. Create your cart, shop, and account pages, add them to your menu, and rebuild your app

Video

AppCommerce Plugin Installation

  1. Download AppCommerce from your account page.
  2. Upload the plugin .zip file under Plugins => Add New => Upload. Activate the plugin.
  3. Visit the AppPresser settings => Licenses and add your license key (for automatic updates)
  4. Visit Settings => Permalinks and press save (You don't need to change anything, this just flushes the permalink cache)

WooCommerce REST API Key

Visit your WooCommerce settings page, and click the advanced tab. Click "REST API" in blue. Enable the REST API if it is not already.

Next, click "Add Key."

Give your key a description, and choose your user. Use "Read" for permissions, and click "Generate API Key".

Copy the consumer key and consumer secret to a separate document.

Add your key and secret to app integrations

Visit your myapppresser.com app dashboard, and click your app.

Visit the "Integrations" tab.

Scroll down to "WooCommerce API Key" and add your key and secret, then save.

Add WooCommerce Pages to Your App

The last thing you need to do is add your shop, cart, and account pages to your app.

Note: If you used the AppCommerce app template, you may already have these pages created. If so, you do not need to create them again.

Visit your app customizer, and go to Custom Pages.

Click "Add New Page" and choose "AppCommerce."

Create a shop page like this:

All that is required is the woo-list tag, and "Shop" selected under component. Add this page to your menu.

Note: to customize what products or categories are displayed, you can use the url parameters found in the WooCommerce REST API documentation. For example, you can add "products?type=simple" to show only simple products.

Next, create a cart page:

You are required to have the woo-cart tag somewhere on the page, and "Cart" selected as the component.

Do the same for the account page:

Save this page and add it to your app menu.

The shop, cart, and account page are all that is required, you can now rebuild your app and try it out.

Other pages

Customers can click "Add to list" on a product, which saves to their wishlist. 

To create a wishlist page, create a new custom page and choose AppCommerce. Set the component to "None" and add the following component code:

<woo-list wishlist="true"></woo-list>

API Routes

To customize what products or categories are displayed, you can use the url parameters found in the WooCommerce REST API documentation. For example, you can add "products?type=simple" to show only simple products. Please see this article for information on customization.

Checkout

Checkout happens on your website through the in app browser. We recommend using the  WooCommerce Smart Checkout plugin for the best experience.

Customization

You can customize your WooCommerce pages, and also add other pages such as a wish list or category pages.  Please see this article for information on customization.