Adding the Shopping Bag to any custom website

The Shopping Bag icon looks like a bag or cart and it shows the number of items added to cart:

The Shopping Bag icon

The Shopping Bag allows your customers to open the checkout page from any page in your store. They click this icon and see the list of the products they added to their order and the Checkout button.

Add the Shopping Bag

The Shopping Bag shows only after your customers add products there. The Shopping Bag is added by default to your Instant Site.

If you have embedded your store to your own website, you can add it as well. Read below how to add the Shopping Bag to different sites.

Adding the Shopping Bag to Wordpress site

If your website is built on WordPress and you have installed your Ecwid store to it with the help of the Ecwid plugin for WordPress, you can enable the Shopping Bag icon in the settings:

  1. Go to your WordPress Dashboard → Appearance → Customize.

Customize appearance Menu

  1. Click Ecwid in the sidebar menu.

Customize Ecwid widgets

  1. Click Shopping Cart Widget.
  2. Select where you want to display the Shopping cart from the drop-down: Show on store pages or Show on all pages.

Shopping Cart display options

  1. Check the option Show when empty, if you want to display the cart icon, when no items have been added to it yet.

Display empty Shopping cart option

To learn how you can change the appearance of the Shopping Bag widget on WordPress, refer to the guide Customizing the Shopping cart design.

Adding the Shopping Bag to Wix site

If you have a site built with Wix, you can add your store there with the help of our application. To add a Shopping cart icon to your Ecwid store on Wix:

  1. Login to your Wix Website Editor and navigate to the Pages menu.
  2. Select the page where your Ecwid online store is installed.
  3. Click on the store area and then – on the Settings button.

Add-ons settings

  1. In the Online store pop-up click Add-ons.

Add-ons settings

  1. Click Add to Page in the Add a Shopping Cart Icon section, if you want to add it to a particular place on the page. Manually drag the widget to the desirable area.

Add fixed Shopping cart

  1. Click Add to Page in the Add a Floating Shopping Cart Icon section, if you want it to float in the page corner.

Add floating Shopping cart

  1. The Shopping cart icon with default appearance will be added to your website.

Shopping cart added to the page

  1. Publish the website to apply the changes.
To learn how you can change the appearance of the Shopping Cart widget on Wix, refer to the guide Customizing the Shopping cart design.

Adding the Shopping Bag to any custom site

To add the Shopping Bag to your store located on your own site, do the following:

  1. Copy the Shopping Bag widget code from your Ecwid Control Panel. It is located in All Sales Channels → Custom website:

Ecwid_Control_Panel_2019-08-12_16-43-27.jpg

    1. Click Add Shopping Bag, the code will be copied.

Alternatively, you can copy the code for the additional shopping cart here (just replace 1003 in the example below with your store ID):

<div class="ec-cart-widget"></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">Ecwid.init();</script>
</div>

  1. Login to your website’s admin area and open the page where you want to display the Shopping Bag in editing mode.
  2. Paste the integration code into the page and save the changes.

Change Shopping Bag design

If you want to change the look and feel of the default Shopping Bag icon, please refer to the guide Customize Shopping Bag design for help.

Related articles

Customizing Shopping Bag design
Adding your store to any website
Adding your Ecwid store to a Wordpress site
Adding your store to a Wix site

Was this article helpful?

Awesome! Thanks for your feedback!

Sorry about that! We are here to assist you by email or chat.

Contact support