- This topic has 3 replies, 2 voices, and was last updated 3 years, 7 months ago by Leo.
Viewing 4 posts - 1 through 4 (of 4 total)
-
AuthorPosts
-
September 17, 2020 at 9:59 am #1447474Jennifer
Hello,
I am building a mega menu and it involves javascript. I have read some your forums and you say to place it in a hook and display after_footer. This is not working at all.
How can we get the block to accept javascript code. I even installed code embed and that did not work either. How do I use this javascript code with hooks?
Please help me :).
LAYOUT CODE
<div class="toggler"> <a href="#" aria-label="">Discovery Bible</a> <span class="toggle-btn"> <i class="fa fa-bars"></i> </span> </div> <ul class="toplevel"> <li class="submenu-holder">Home <div class="submenu"> <ul> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> </ul> <ul> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> </ul> <ul> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> <li><a href="#" aria-label="">sub item</a></li> </ul> </div></li> <li class="submenu-holder">Bible Project <div class="submenu"> <ul> <li><a href="#" aria-label="">sub a</a></li> <li><a href="#" aria-label="">sub a</a></li> <li><a href="#" aria-label="">sub a</a></li> <li><a href="#" aria-label="">sub a</a></li> </ul> <ul> <li><a href="#" aria-label="">sub a</a></li> <li><a href="#" aria-label="">sub a</a></li> <li><a href="#" aria-label="">sub a</a></li> <li><a href="#" aria-label="">sub a</a></li> <li><a href="#" aria-label="">sub a</a></li> </ul> <ul> <li><a href="#" aria-label="">sub a</a></li> <li><a href="#" aria-label="">sub a</a></li> </ul> </div></li> <li class="submenu-holder">Bible App <div class="submenu"> <ul> <li><a href="#" aria-label="">sub b</a></li> <li><a href="#" aria-label="">sub b</a></li> <li><a href="#" aria-label="">sub b</a></li> <li><a href="#" aria-label="">sub b</a></li> </ul> <ul> <li><a href="#" aria-label="">sub b</a></li> <li><a href="#" aria-label="">sub b</a></li> <li><a href="#" aria-label="">sub b</a></li> <li><a href="#" aria-label="">sub b</a></li> </ul> <ul> <li><a href="#" aria-label="">sub b</a></li> <li><a href="#" aria-label="">sub b</a></li> <li><a href="#" aria-label="">sub b</a></li> <li><a href="#" aria-label="">sub b</a></li> </ul> </div></li> </ul> <script> $('.submenu-holder a').click(function(){ $('.submenu-holder').removeClass('.openMenu'); $(this).parent().toggleClass('openMenu'); $('.openMenu .submenu').toggleClass('displayMenu'); }) $('.toggle-btn').click(function(){ $('.submenu-holder').removeClass('.openMenu'); $('.submenu').removeClass('displayMenu'); $('.toplevel').toggle(); }) </script>
September 17, 2020 at 10:16 am #1447508LeoStaffCustomer SupportHi there,
Javascript should go in
wp_footer
typically.Where did you get the code from? Are you sure it’s working?
I would consider using a mega menu plugin for something like this.
September 17, 2020 at 10:48 am #1447550JenniferOkay yes, I got it to work, thank you ๐
September 17, 2020 at 10:50 am #1447553LeoStaffCustomer SupportNo problem ๐
-
AuthorPosts
Viewing 4 posts - 1 through 4 (of 4 total)
- You must be logged in to reply to this topic.