ECWID - cart icon customization

RapidWeaver Classic
1

Hi,
I am using Ecwid and it’s nice but I have a problem
the shopping cart is nearly invisible and I can’t figure out where to paste the additional codes to customize it provided
in this page so I get a lot of abandoned carts (people really don’t see it)
Anyone succeded in customizing the cart?

thanks

2

The link you gave above is to the ECWID help area.

Could you give a link to your page that has the cart?

3

here is the link

the problem is the code in the page Ecwid i linked, I can’t figure out where to paste it

4

The help page you are looking for is for the ec-cart-widget. I’m not experienced with ECWID but I think that “widget” is for placing a separate cart on the header of the page.

It looks like you have an HTML stack that you put a my-store- widget in. The cart is at the bottom of that widget. But it’s a different cart than the stand-alone one is.

I think you should consider putting that separate cart widget on the page. Website best practices say that most folks look for the shopping art up in the header (top left). I don’t know if the theme you are using has any way of adding extra content to the header.

If you go to this page on the ECWID site, and scroll down to the instructions for Adding a shopping bag to a custom-built website. Grab that widget and place it near the top of the page.

1 Like
5

thanks
I’m doing the website from scratch as I am switching to Foundry
The problem with the separate shopping bag is that it is still almost invisible and I can’t follow the procedures to make it look like this (as explained in the Ecwid help page) shopping-bag-big-icon-details-subtotal

6

If you have a page with a separate shopping bag on it, we can probably help you make it more visible with some CSS.

1 Like
7

thanks
so this is the separate shoping bag

<div class="ec-cart-widget"></div>
<div>
<script data-cfasync="false" type="text/javascript" src="https://app.ecwid.com/script.js?28334007&data_platform=code&data_date=2020-05-18" charset="utf-8"></script>
<script type="text/javascript">Ecwid.init();</script>
</div>

and this is what I am supposed to “add” to it.
I don’t know what it means

<div data-layout="BIG_ICON_DETAILS_SUBTOTAL" class="ec-cart-widget"></div>
<div><script data-cfasync="false" type="text/javascript"
src="https://app.ecwid.com/script.js?STORE_ID&data_platform=code" 
charset="utf-8"></script><script>Ecwid.init();</script></div>
8

if it’s a stacks page, add an html stack and paste it inside that.

9

yes I used an html frame.
the first code works but when I add the second part it doesnt change anything, it just pops another shopping bag

10

Here is the code with your store stuff in the lBig-icon version:

<div data-layout="BIG_ICON_DETAILS_SUBTOTAL" class="ec-cart-widget"></div>
<div>
    <script data-cfasync="false" type="text/javascript"
    src="https://app.ecwid.com/script.js?28334007&data_platform=code&data_date=2020-05-18" charset="utf-8"></script>
    <script>
        Ecwid.init();
    </script>
</div>
1 Like
11

wow thanks.
there is no way I could have figured this out following Ecwid explanation.

1 Like
12

By the way, if you have just one product and don’t expect a customer to “shop around”, it may make sense to send a customer to the shopping cart page right after they click “Buy”. You can do it by enabling the “Open bag when “Add to bag” is clicked” option in the Ecwid Control Panel. Screenshot: https://d.pr/free/i/igb1Mz .

1 Like
13

that’s a useful option and it makes sense, thanks

14

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.