Hey, WordPress web developer :) Check out WPMU DEV

Skip to Main Content
Docs / / Upfront MarketPress and WooCommerce Integration

10. Upfront MarketPress and WooCommerce Integration

Written by Michelle Shull | Last updated: January 4, 2017

With the most recent Upfront update, we added an oft-requested new feature, support for WooCommerce and our very own MarketPress’ virtual pages. Now you can create beautiful store pages within your favorite Upfront starter theme. Woo! (*ahem*)

10.1 Getting Started with MarketPress and WooCommerce and Upfront

Link to chapter 1

Getting started with WooCommerce and Upfront is super simple.

  1. Ensure you have the latest versions of Upfront, your favorite Upfront starter theme, and the free WooCommerce plugin found on wp.org. If you want to build a WooCommerce Upfront theme from scratch, you’ll also want to install the Upfront Builder plugin.
  2. Activate both the WooCommerce Plugin and your starter theme.
  3. Start building your WooCommerce store pages via your wp-admin dashboard.
  4. Preview your store pages looking shiny in your Upfront theme.

Getting started with MarketPress and Upfront is just as simple.

  1. Ensure you have the latest version of Upfront, your favorite Upfront starter theme and/or the Upfront Builder plugin if you want to build an Upfront theme from scratch, and the most recent version of MarketPress.
  2. Activate MarketPress, and complete the setup wizard if you haven’t already. Add your store content.
  3. Activate your Upfront starter theme of choice or activate the Upfront builder with a new, blank theme.
  4. Preview your MarketPress pages looking just as shiny as the Woo pages from the section above.


10.2 Creating Upfront Store Pages with MarketPress or WooCommerce

Link to chapter 2

Working with your WooCommerce and MarketPress content works just like always. You’ll add your products, product categories, and store pages from your WordPress admin area.

Upfront supports all of MarketPress and WooCommerce’s widgets, so these can be added to your pages via the Upfront editor, and you can continue to make styling decisions on your store pages.


10.3 MarketPress and WooCommerce Store Pages in the Upfront Editor

Link to chapter 3

Since your store content isn’t handled by Upfront, you’ll see placeholders for product text, price, tags, categories, descriptions, and images when you look at a store or product page within the Upfront editor.

You may still edit the regions and backgrounds on your MarketPress and WooCommerce pages, and you can drag in Upfront elements as well.





10.4 Preview of WooCommerce Pages in Upfront Starter Themes

Link to chapter 4

Get an idea of how WooCommerce and Upfront work together with the examples below.

Shop Page


Using Parrot starter theme.

Single Simple Product


Using Luke & Sara

Sale Product


Using Gillie

Product with Variations


Using Spirit

My Account Page


Using Fixer

Related Products


Using Issue



Using Panino



Using Scribe.


10.5 Preview of MarketPress Pages in Upfront Starter Themes

Link to chapter 5

Product Page


Using Issue

Simple Product


Using Luke & Sara

Product with Variations


Using Scribe

Sale Product


Using Spirit

Order Status


Using Gillie



Using Fixer



Using Panino