Need to make clickable area in header larger

Store Design
, ,
1

Hello I currently have a image for one of my menu items, but the clickable area is very small. Only the tractor. I would like to make it the full size of the image.

BB_Tech_0-1678987671833.png

2

on this URL https://biggers-market.myshopify.com/pages/biggers_home it’s on the full image,

if you are working on another theme then share your theme preview link

3

BB_Tech_0-1678990513644.png
BB_Tech_0-1678990513644.png1306×320 310 KB

Hello I am talking about the second smaller image they alternate based on the pages

4

yes got it, add this code to your theme in this section(marked)

Avi_choudhary_0-1678992426191.png
Avi_choudhary_0-1678992426191.png1917×1040 413 KB

a.header__menu-item.header__menu-item.list-menu__item.link.link--text.focus-inset::after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
#shopify-section-header .header__inline-menu ul.list-menu.list-menu--inline li:first-child {
    position: relative;
}

stylesheet

5

I am having some trouble figuring out where to place it, could you be more specific?

6

Hi @BB_Tech ,

This is Victor from PageFly - Landing page builder, I’d like to suggest this idea:

Step 1. Go to Online Store → Theme → Edit code
Step 2. Open your theme.liquid theme file
Step 3. Paste below code before :

Hope my answer will help you.

Best regards,

Victor | PageFly

7

Couldn’t get that to work very robustly, is there a way to reference the first item in the header menu no matter what the current menu handle is