Use Cart Drawer for Adding to Cart but Pressing Cart Icon goes to Cart Page

[bryan76]

I want to change the navigation of my site slightly.  I have the cart drawer enabled and like it for when someone adds an item to cart but I want the cart icon in the header when pressed to go to:   www.mysite.com/cart  I am just looking for the area of the code to add an href to that page.

thanks!

[DonD]

Hi Bryan. I attempted to tweak the Refresh theme (header.liquid) to make the header cart icon link to the cart page instead of opening the drawer by modifying the anchor element, but it did not work well. I'm going to try again and will let you know if I have any success. In the meantime, if you have a solution please let me know, thanks.

Don

[bryan76]

thanks.  I feel like if we just find the correct spot we can just add an href .  just can't find the right section to do it.  thanks. lmk if you have any luck

[DonD · Accepted solution]

Well Bryan, it's a bit of a hack, but this seems to be working. 

In cart-drawer.js, you should find this line:

this.setHeaderCartIconAccessibility();

This line is calling a function that:

1. disables the default click behavior of the cart link (event.preventDefault();)

2. opens the cart drawer (this.open(cartLink);)

In other words, the cart drawer code is hijacking the default behavior of the header cart link and instead forcing it to open the drawer.

So I just commented out that line as follows:

// this.setHeaderCartIconAccessibility();

I would like to know if this works for you as well.

Don

[bryan76]

Exactly what I was looking for!  Works great and very simple to implement!

Next I am going to format the Account page a bit and add a link to Cart.  also I want to change the link that says Continue Shopping when the cart is empty.  it goes to collections/all now which I have set to all products.  not sure what I am going to change it to just yet

Thanks again!

[DonD]

Good to hear!

We are on the same schedule it seems. Last night I worked on sending "Continue Shopping" link to the home page (I think Featured Products is a good option too) and today I am working on the Account pages format...just adding custom CSS to get the headers to match our color scheme. I am finding it is a pain to use the theme designer in the Classic Accounts pages because it keeps making me sign in!

[ben0915]

Worked great -- nice find !