How to Add a Cart Link on Mobile

By default in the theme, the WooCommerce cart icon shows on desktop but does not show on mobile.

If you would like you can include a Cart link for mobile users that would look like this:

Here is how to do it:

1. Under Appearance > Menus, add a menu item for your Cart page. It will be listed in the Pages list on the left. Check the box and click Add to Menu.

2. On the very top right of the screen, there will be a tab for Screen Options. Click it and ensure that the box is checked for CSS Classes:

3. Scroll down to your newly created menu item and click the arrow on the right to expand it. Add a CSS class- you could use ' hide-desktop ' as shown below.

Note - if you want it to appear with an outline like a button as shown at the top of this article, also add the class ' th-accent ' - so with both, that field would show ' hide-desktop th-accent ' (no quotes). 

4. Click Save Menu. Now go under Appearance > Customize > Additional CSS, and copy/paste this code below:

@media (min-width:768px) {
  li.hide-desktop {display:none !important}
}

Click the blue Publish button at the top.

Now you should have a Cart menu link for mobile users, and the desktop cart icon would continue to work the way it currently does.