How do you make the Titles in the menu clickable?

Store Design
,
1

Hello, and thanks for reading. I was wondering if anyone has worked with a megmenu in Dawn theme. MY question is once the megumenu is implemented how do you make the title of a category clickable as a link?

If anyone has any insight i would love to hear it.

Thanks

2

Hi @darkthrone

Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.

3

www.partscounter-com.myshopify.com

4

Hi @darkthrone

You can try one of two ways below:

  • Way 1: Go to Theme > Edit Code

view-13.png
view-13.png1845×976 236 KB

  • Find the liquid file containing the HTML code of the megmenu, the code will have a structure similar to the following code:

view-14.png
view-14.png513×129 16.6 KB


                    
Fire Suppression
  • Find the file base.css or custom.css or theme.css or global.css, put the following code at the bottom of the file:
.eg-animated-stories-list .title {
   margin-top: 95px;
}
  • Here is the result:

view-15.png

  • Way 2:
  • Please go to Edit Code
  • Go to theme.js or global.js or custom.js file, add the following code:
window.onload = function() {
   document.querySelector('.eg-animated-stories-list').style.padding = '4rem 0';
   function insertAfter(newNode, existingNode) {
      existingNode.parentNode.insertBefore(newNode, existingNode.nextSibling);
   }
   const img = document.querySelectorAll('.eg-animated-stories .eg-animated-stories-list li a .img-fluid');
   const titleLink = document.querySelectorAll('.eg-animated-stories .eg-animated-stories-list li span.title');
   if (img.length && titleLink.length) {
      for (let i = 0; i < img.length; i++) {
         insertAfter(titleLink[i], img[i]);
         titleLink[i].style.marginTop = '95px';
      }
   }
}
  • Here is the result:

view-16.png

I hope that it will work for your site.