Merge Cart into the Main Menu

Hi all,

I would like to build a main menu for my website that enclosed the cart. The idea is to keep my site as minimalist as possible so I don’t want to add multiple icons on the UI.

I already tricked the standard cart icon to be merged with my menu icon. The result is pretty clean.

Capture d’écran 2020-05-12 à 12.19.31

Now I would like the main menu to have an area dedicated to the cart with a button to proceed the checkout. This area should take place between the “blog” link and the “Instagram” link

I don’t know if I can do that, if I can use pre-built blocks from a standard cart and add it onto my menu.
What are your thoughts ? Is that even possible ?


Can you share your read only link please?

I don’t have started yet. But there is a pic of what I need to archive:

Menu without cart element:

Merged Menu:

The cart component has a cart wrapper inside that you can copy and paste it in your navigation bar although the native navigation bar won’t accept it so you’d need to create your own.

I’ve tried but when I copy past the cart wrapper, it past another cart item.
I need to have access to the content of the cart itself, not the whole component.

The other issue is the cart wrapper have a visibility condition and an animation that only occur when the cart is clicked. There is no way (apparently) to have this content visible all the time.

The easiest way would be to have access to the cart CMS collection that is created on the back office but not available to be chosen from the CMS list

The Webflow support team said there is no way to work with cart element as for now.

There offered 2 potential backup solutions:

  • use the cart menu as the main menu by adding navigation link to it.
  • use custom code to work with pre-made cart items

I’ll try the first solution since I am not a developer…