Sauecommerce for any website

Adding Sauecommerce to website builders and CMS
Adding Sauecommerce to a custom-built website
Adding store extensions to a custom-built website
FAQ

Sauecommerce has plugins (also called “apps” or “extensions”) for the most popular website builders and content management systems (CMS). They allow you to add a store to a website without any coding.

Usually, a plugin works this way: you install it to your website, log in to your Sauecommerce account, save and publish the changes and that’s it! Your store appears on the website.

Below you will find the list of website builders or CMS for which we have plugins. Click on the one you use to see the instructions on how to add your Sauecommerce store there:

• Wordpress
• Wix
• Weebly
• Joomla
• RapidWeaver
• Drupal

There are also a lot of other website builders that help you create a website without any programming knowledge. Most of them also allow adding custom codes. That means that you can add your Sauecomerce store to such websites as well.

We have prepared step-by-step instructions that will help you add the Sauecommerce store to your website if you use:

• Squarespace
• Blogger
• Tumblr
• Flexbe
• and many other website builders. See the list of them here: Sauecommerce for different sites.

In case you haven’t found your website builder in the lists above or you have a custom-built website, you can still add your Sauecommerce store as long as you can add custom codes to the website. That may be an Embed HTML or source tab or a special block or setting where you can add your Sauecommerce store code.

Here is an instruction on how to add an Sauecommerce store to a website:

1. From your Sauecommerce admin, go to Website.
2. Scroll down to the "Add your store to one more website" section and click Pick Platform → Other platforms and sitebuilders.
3. Click Copy code to Clipboard. This is the code of your store.
4. Otherwise, you can copy the integration code right here. Remember to replace 1003 in the example below with your store ID which you can see in the bottom left corner of your control panel:
   
   <div id="my-store-1003"></div>
   <div>
   <script data-cfasync="false" type="text/javascript" src="https://app.sauecommerce.com/script.js?1003&data_platform=code" charset="utf-8"></script><script type="text/javascript"> xProductBrowser("id=my-store-1003");</script>
   </div>
 
5. Go to the editor of your website and open the page where you want the store to display.
6. Paste the code to the source code of the page. That may be HTML or source tab or a separate button to add codes. That varies depending on the website. If you are not sure how to add custom codes to your website, please contact your website developer for more detailed instructions.
7. Save and publish the changes.

After this, your store will appear on the website and customers can start placing orders.

You can add extensions to your website to help customers navigate across your site and find what they are looking for more easily. 
You can add these store extensions to your site:

• Additional shopping bag. It displays how many items are in the bag and helps customers go to the cart page to view the cart contents and complete a purchase.
• Category navigation menu. The menu shows your store categories as a horizontal list with tabs helping customers see what kinds of products you offer and find what they are looking for.
• Product search box. With a search box, customers can search products by name, SKU, options' names, and others and find the specific product they need without browsing all store pages.

To add these extensions to a custom-built website, use the same instructions as for adding a store catalog to a site. If you use a website builder or a CMS where you add Sauecommerce with the help of a plugin, you can usually add the extensions within plugin settings. Please check the instructions for the website builder or CMS you use.

When I click on the cart/search/menu extension, I see it in a popup. How to open it on a page instead of a popup?

Your store catalog may open in a popup if you added only store extensions to your site page (shopping bag icon, search box, store menu or single product cards/Buy buttons), but didn't add the store catalog to that page. Since there is no site page with the store catalog, products show up in a popup when you click on a menu item or click on the cart icon.

To show content on the page instead of popups, you can simply add your store catalog to your site page. Follow the instructions on how to add Sauecommerce to a website builder or a custom website. Or, in case you don't want to add your store catalog to this page, you can redirect customers to another page with your store.

To get rid of popups and redirect customers to another page with your store catalog:

1. Go to your website backend.
2. Add the following code to your website source code and replace PB_URL with the link to the page with your store catalog, e.g. https://www.example.com/store:
   

   <script>var sauecommerce_ProductBrowserURL = "PB_URL";</script>

3. Save and publish the changes in your website.

After that, when a customer clicks on a site menu or clicks the "Browse store" button on the cart page, they will be redirected to the page with your store.