Ecwid for any website
With Ecwid, you can add your entire store, categories, single product cards, or Buy buttons to any existing website or blog in minutes. You can connect Ecwid store to your site on WordPress, Wix, Weebly, Joomla, and many more.
You can also add the store to other website builders or to custom-built websites. You’ll just need to paste the store code to your page and customers will be able to start purchasing right on your website.
Adding Ecwid to website builders and CMS
Ecwid 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 Ecwid 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 Ecwid store there:
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 Ecwid store to such websites as well.
We have prepared step-by-step instructions that will help you add the Ecwid store to your website if you use:
- Squarespace
- Blogger
- Tumblr
- Flexbe
- and many other website builders. See the list of them here: Ecwid for different sites.
Adding Ecwid to a custom-built website
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 Ecwid 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 Ecwid store code.
Check out quick videos on how to add your Ecwid store to a custom-built site:
Here is an instruction on how to add an Ecwid store to a website:
- From your Ecwid admin, go to Website.
- Scroll down to the "Add your store to one more website" section and click Pick Platform → Other platforms and sitebuilders.
- Click Copy code to Clipboard. This is the code of your store.
- 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.ecwid.com/script.js?1003&data_platform=code" charset="utf-8"></script><script type="text/javascript"> xProductBrowser("id=my-store-1003");</script>
</div> - Go to the editor of your website and open the page where you want the store to display.
- 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.
- Save and publish the changes.
After this, your store will appear on the website and customers can start placing orders.
Adding store extensions to a custom-built website
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 Ecwid 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.
FAQ
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 Ecwid 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:
- Go to your website backend.
- 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 ecwid_ProductBrowserURL = "PB_URL";</script>
- 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.