Skip to content
Docs

Add a shop

Reign Theme overviewPremiumGet Reign Theme →

Add a shop

Section titled “Add a shop”

You will end up with an online shop that matches the rest of your Reign site: a shop page, product pages, a cart, checkout and a My Account area, plus a cart icon with a live item count in the header. WooCommerce is the free plugin that provides the shop itself. Reign styles it.

Before you start

Section titled “Before you start”
  • You are logged in as an administrator.
  • Reign is active and your menus are assigned.
  • Have a few products ready, with photos and prices.
  • Selling digital downloads? Easy Digital Downloads is also supported. See WooCommerce and Easy Digital Downloads.

Steps

Section titled “Steps”
  1. Go to Plugins > Add New, search for WooCommerce, then select Install Now and Activate.
  2. Follow WooCommerce’s own setup screens to add your store details, payment methods and shipping.
  3. Add products under Products > Add New.
  4. Open Reign Settings > Integrations. WooCommerce should be listed as running on your site. Reign needs no extra setup for the styling.
  5. Check the cart icon. Go to Appearance > Customize > Header > Layout and open Header Icons Options. The Cart icon appears once WooCommerce is active. Drag it to the place you want. For phones, use Header > Mobile Menu > Mobile Header Icons Options. If your cart page is missing, Reign hides the icon rather than send visitors to the homepage.
  6. Open Appearance > Customize > WooCommerce. Reign adds four sections:
    • Shop Page: Show Grid Buttons, Product Layouts (Default or Layout 1 to 4), Product Sort, Product Result Count, Display Filter Button and Product Thumbnail Hover Effect.
    • Single Product Page: Product Layouts (Default, Layout 1 or 2), Product Image Layout, Review Summary Bar and Review Position.
    • Cart Page: Cart Page Layouts.
    • My Account Page: My Account Layouts and My Account Toggle Menu.
  7. Open the WooCommerce Checkout section in the same panel to pick a Checkout Page Layouts option.
  8. To filter products, switch on Display Filter Button under Shop Page, select Publish, reload, then go to Appearance > Widgets and add filter blocks to the Off Canvas Sidebar.
  9. To show widgets beside products, add them to WooCommerce Right Sidebar or WooCommerce Left Sidebar under Appearance > Widgets.
  10. Select Publish.

Check it worked

Section titled “Check it worked”
  1. Open the shop page, a product page, the cart and checkout in a private window.
  2. Add a product to the cart. The header cart count should update without a page reload.
  3. Log in as a customer and open My Account.
  4. Check each page at phone width. See make it look right on phones.

If something looks wrong

Section titled “If something looks wrong”
  • No Cart icon. WooCommerce is not active, or the cart page is missing or unset in WooCommerce’s settings.
  • No WooCommerce panel in the Customizer. It only appears while WooCommerce is active.
  • The grid buttons or sorting are missing. Check Show Grid Buttons and Product Sort are enabled under Shop Page.
  • Header search finds posts, not products. Set the header Layout to v4 and Header Search Style to Product Search.
Section titled “Related”