How to embed an Ecwid "shopping bag" button within a Nav. Bar Pro (shopping cart) icon?

[Yann]

Hi everybody,

I hope you’re all doing well!

Is there a way to embed an Ecwid “shopping bag” button within a Nav. Bar Pro (shopping cart) icon, please?

See here “Adding a shopping bag to a custom-built website” on Ecwid’s website —> Adding a shopping bag to a website – Ecwid Help Center

And the website I’d like to add it to (next to the social icons, in the Nav. Bar Pro, using a Nav. Bar Pro’s shopping cart icon, so the “shopping bag” button looks exactly like the two social ones) —> https://www.lafinebouchee.com

With many thanks in advance!

Kind regards,

Yann

[Panans]

Hi Yann,

do you mean something like this?

In NavBar Pro you can add icons in a ‘zone’. One of the possible icons is a shopping bag. You can then set a link to a page or a URL. Styling of the icons has to be done in the settings:

Hope this helps,

Hans

PS: il est très beau, ton site. Fien fait!

[Yann]

Hi @Panans,

Thank you for your answer.

This is exactly what I’m trying to achieve.

However, the issue I’m facing is that Ecwid’s “shopping bag” button is not a link.

Ecwid dashboard gives me this bit of code :

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

Therefore, I don’t know how to link it (or “embed” it into) a NavBar Pro icon.

Kind regards,

Yann

PS : merci, je suis ravi que le site te plaise !

[Panans]

Bonjour Yann,

I see what you mean. I assume you want to show your clients a shopping bag where they can see what delicious food they already ordered? More like a list that opens when they click on the shopping button you want to add?
I did a few webshops with Paysnap and experimented with Cartloom. I have no experience with Ecwid. In Paysnap and even in the extremely extended Cartloom you only see your orders when you add an item, or at checkout.
I’m afraid you will need some coding to do that. I’m sorry I can’t help you with that.

Hope someone of the other users can come up with a solution.

Bon succès, et si jamais on peut commander à partir de Marseille chez vous, je veut bien le savoir

Hans

[Yann]

Hi @Panans,

Thank you so much for you swift answer.

Yes, this is what I’m trying to achieve, as somme customer have let me know that they were confused and searching for the shopping cart icon but not finding it. Indeed, by default, Ecwid shopping cart icon only appears when an item has been added to the cart, and it appears on the bottom right corner of the page.

Therefore, I’d like to add a permanent cart icon, within the NavBar Pro. But what is stopping me is that I don’t know how to open the content of Ecwid shopping cart when a visitor clicks on the NavBar Pro shopping cart icon.

As a picture is worth a thousand words, I’m adding one, hopping it’ll help clarify the issue.

Merci beaucoup pour ton aide Hans

Yann

[elixirgraphics]

Probably best to contact the developer of your shopping cart addon and n this case.

[Panans]

Cher Yann,

maybe you should ask this question also in te RW forum. (https://forums.realmacsoftware.com)
There are a lot of css geniuses there.

Hans

[Rob]

It’s also worth having a chat with Ricardo who made the Ecwid stacks set - Axyn Technology | Ecwid Stacks for Rapidweaver

His set of stacks include a Cart stack which lets you “Set a shopping bag, cart or basket anywhere or floating on a page, and how it looks.”

[Yann]

Hi,

As I got an answer on the RW forum, I thought I’ll share it here in case it can help anyone else.

So Ricardo Ruggiero let me know that I just had to set the following link to the NavBar Pro Shopping Cart icon: ./#!/~/cart

Kind regards,

Yann