Highlight one menu item - Dawn Mobile layout

Store Design
1

Hi,

Using Dawn 4.0 - Mobile layout - dogtreatboutique.co.uk

Trying to put a background colour the second menu item (The “SHOP” button) when using a mobile device.

@GemPages and @dmwwebartisan have kindly provided solutions for how to do this on a desktop layout, but I am still struggling to get it to work on mobile.

Any suggestions gratefully received.

Sam

2

Found this elsewhere on the forums - it works fine with both desktop and mobile layout putting a background on the menu buttons - except it doesn’t work properly on the “SHOP” button because it has a sub-menu. The colour gets applied to the last item in the sub menu (Or maybe to the only item that doesn’t have a sub-menu) - any ideas anyone?

sticky-header .list-menu > li:nth-last-child(2) a,
  sticky-header .list-menu > li:nth-last-child(2) a{
     background: pink;
  }

Screenshot 2023-04-01 at 11.21.49.png
Screenshot 2023-04-01 at 11.21.49.png1332×614 323 KB

3

Hello @Sam_DTB

To change second menu item follow this steps :

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find layout > theme.liquid and paste this at the bottom of the file:

Hope this works well.

1 Like
4

Hay there I am also having issues regarding to the highlighting the menu in my website can you help? as it is not working in mobile views . https://divinecasa.com/ and I want to highlight Exclusive sale