10. Upfront MarketPress and WooCommerce Integration
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 UpfrontLink to chapter 1
Getting started with WooCommerce and Upfront is super simple.
- 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.
- Activate both the WooCommerce Plugin and your starter theme.
- Start building your WooCommerce store pages via your wp-admin dashboard.
- Preview your store pages looking shiny in your Upfront theme.
Getting started with MarketPress and Upfront is just as simple.
- 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.
- Activate MarketPress, and complete the setup wizard if you haven’t already. Add your store content.
- Activate your Upfront starter theme of choice or activate the Upfront builder with a new, blank theme.
- 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 WooCommerceLink 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 EditorLink 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 ThemesLink to chapter 4
Get an idea of how WooCommerce and Upfront work together with the examples below.
Using Parrot starter theme.
Single Simple Product
Using Luke & Sara
Product with Variations
My Account Page