After you’ve installed the BigCommerce for WordPress plugin, you can begin creating category, brand and other product listing pages in WordPress within Pages and Posts. The editors use a shortcode or the Gutenberg editor to reference a single product or a list of products.
Want to learn more about the Gutenberg editor? The WordPress Block Editor Handbook is a detailed guide containing a glossary and tutorials to help you get started building your WordPress site using Gutenberg blocks.
Adding Products
To add products in WordPress, go to Pages in the side navigation menu. Here you can create a new page before adding your products, or edit an existing page.
1. Click on the page you want to edit to open the page editor.
2. Click the plus sign, then select BigCommerce Products.
3. Once the product block is added, click Edit Products in the menu.
4. From here, you can add and edit your BigCommerce catalog by brand, category, featured, on sale, recent, or use the search bar to filter results. Once you’ve found and selected the product or products you want to add, select it and click Embed Product(s).
If you select a single product to embed, the generated shortcode will display a large layout for product details.
Selecting multiple products will display products in a list. This is ideal for things like categories, brands, and featured collections.
Use the Open in BigCommerce link in the post editor or Products list to edit a product directly in your BigCommerce control panel. Use the Re-sync link to initiate a sync for a given product. Otherwise, use the Sync Products link at the top of the list to sync all products.
Gutenberg Support
In addition to the classic editor, the BigCommerce for WordPress plugin also supports Gutenberg, the default editor in version 5.0+ of WordPress.
With Gutenberg, you use the Add Block (+) button to add products and other widgets like the cart, login form, checkout page, and more.
Available BigCommerce Blocks
The table below lists and defines the various blocks that are supported in WordPress for BigCommerce, along with the settings associated with them.
| Block Name | Description | Settings |
| BigCommerce Products |
displays a list of products by brands, categories or individual products, and sets the number of products displayed per page as well as the sort order | Edit Products, Additional CSS Class |
| BigCommerce Cart | displays the items currently in the customer’s cart | Additional CSS Class |
| BigCommerce Registration Form | displays a BigCommerce Registration form | Additional CSS Class |
| BigCommerce Account Profile | displays a customer information update form | Additional CSS Class |
| BigCommerce Address List | displays a list of customer shipping addresses with edit UI | Additional CSS Class |
| BigCommerce Order History | displays a list of the customer’s past orders | Additional CSS Class |
| BigCommerce Login Form | displays a customer login form | Additional CSS Class |
| BigCommerce Gift Certificates | displays the gift certificate UI | Additional CSS Class |
| BigCommerce Gift Certificate Balance | displays the balance of a gift certificate | Additional CSS Class |
| BigCommerce Wish Lists | displays the BigCommerce Wish List form | Product ID, Additional CSS Class |
| BigCommerce Product Reviews | displays product reviews for a product | Product ID, Additional CSS Class |
| BigCommerce Product Components | displays a product’s component(s), such as sku, image, title, description, and add to cart button | Product ID, Product Component, Additional CSS Class |
Shortcodes
Most of the plugin's functionality is exposed on the frontend of the site through shortcodes embedded on automatically created pages. A shortcode is a small snippet of code, indicated with brackets, that performs a specific action on your site. While BigCommerce for WordPress supports several shortcodes for designing and managing your store, the products shortcode is the one most commonly used on pages.
Products Shortcode
[bigcommerce_product]
The product shortcode can be used to include one or more products on other pages or posts on the WordPress site. Type the forward slash symbol (/) in the selected page to select products or build a dynamic query. Dynamic queries are inserted into the shortcode and allow you to customize the set of products you want to display on a page by using specific attributes.
While the shortcode can be built using the button, it can also be created manually. It accepts a number of optional attributes:
id— a comma delimited list of BigCommerce product IDspost_id— a comma delimited list of WordPress product post IDssku— a comma delimited list of BigCommerce product SKUscategory— a comma delimited list of Product Category slugsbrand— a comma delimited list of Brand slugsfeatured— Set to 1 to limit the query to featured products.sale— Set to 1 to limit the query to sale products.recent— Set to 1 to limit the query to products imported in the last 2 days (filter the duration with the bigcommerce/query/recent_days filter).search— a search string to match against product titles, BigCommerce product IDs, or SKUspaged— Set to 0 to disable pagination.per_page— The number of products to show per page. Defaults to the value set in the theme customizer.order— whether to sort products in "ASC" or "DESC" orderorderby— the field to use for sorting. Accepts any field that WP_Query accepts (e.g., title, date).
Other Shortcodes
[bigcommerce_signin_form]— The form for users to log in to the site. If user registration is enabled, it will also give a link to the registration page.[bigcommerce_registration_form]— A form to register a new customer account.[bigcommerce_cart]— The items currently in the customer's cart.[bigcommerce_account_profile]— A form to update the customer's profile.[bigcommerce_order_history]— A list of the customer's past orders.[bigcommerce_shipping_address_list]— A list of the customer's shipping addresses and forms to add, remove, or update addresses.
Listing & Hiding Products
When you connect the plugin to your BigCommerce store, your View Products page will be upgraded to the Multi-Channel Product List, giving you the ability to control which products appear on what channels.
Listing Products
When a product is “listed” on WordPress, its corresponding WordPress post is set to Published and its product detail page is made publicly accessible. Even if it is listed, a product will not necessarily appear on category or other listing pages unless it or one of its attributes (like category or brand) is referenced there from a shortcode or product block.
If you only want to list certain products, go to the BigCommerce Settings tab in your WordPress dashboard and select Product Sync, then set "Automatic Listing" to No. If the default "Yes" is selected, all of the products in the catalog will be assigned to the WordPress channel and they will be listed whenever an import is performed. Once you have updated your automatic listing setting, you will need to manually push products to WordPress from the BigCommerce control panel.
Follow the steps below whenever you want to list certain products. Once the products are pushed, they will need to be added to your WordPress site via shortcode or product block.
1. In your BigCommerce control panel, go to Products › View.
2. Check the box next to the products you want to list on WordPress, then choose the ellipses in the menu that appears above the product list and select Add to channels.
.png)
Once you have listed your chosen products, the Channels drop-down menu will show each channel where they are listed.
.png)
Hiding Products
When a product is "hidden", the product will no longer appear on your WordPress frontend. Its post status in WordPress is set to Draft, so its product detail page is not publicly accessible, and it will no longer appear in any lists where it may be referenced via shortcode.
1. In your WordPress dashboard, go to BigCommerce › Products.
2. Check the box next to the products you want to hide, then change Bulk Actions to Edit and click Apply.
3. Select Draft under the Status drop-down menu, then click Update.
The product page will revert to a draft and will no longer be visible on your WordPress storefront. To make the product visible again, select Published in the status drop-down menu.
FAQ
Is the Product Availability setting (catalog products, pre-order products) compatible with BigCommerce for WordPress?
Yes. BigCommerce for WordPress supports the "pre-order" and non-purchaseable product availability settings. You can control the text for the "Add to Cart" and "Buy Now" buttons under Appearance › Customize in the side navigation of your WordPress dashboard.
