[Support request] Javascript Added to "wp_head" Hook is Breaking Main Menu

Home Forums Support Javascript Added to "wp_head" Hook is Breaking Main Menu

  • This topic has 3 replies, 2 voices, and was last updated 4 years ago by Tom.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #297021
    Aaron Harms

    Hey Tom,

    First of all, I absolutely LOVE Generate Press! It’s been so easy to work with. Bravo! <3

    I ran into a small problem that I’m hoping you can help me out with….

    I am working on adding Text Resizing buttons to this site I’m working on: http://www.hhsc.org

    To do this, I am using instructions found in this example: http://www.dynamicdrive.com/dynamicindex9/fluidtextresizer.htm

    So I am adding this code to the wp_head hook:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="fluidtextresizer.js"></script>

    When I set everything up, my text-resizing buttons are working properly, but my main navigation breaks. (on mobile, the menu is not clickable (does not drop down), and on desktop the primary navigation item’s hover state will deactivate when hovering over that nav item’s subnav menu)

    If I delete out both of the above lines of code from the wp_head hook, my menu functionality works as it should again.

    I’m guessing that somehow/someway the new JS is conflicting with Generate Press’s current JS, but I don’t know enough about JavaScript to troubleshoot it / solve it.

    Any ideas?

    GeneratePress 1.3.46
    Lead Developer
    Lead Developer

    Hi there,

    Glad you’re enjoying GP!

    Remove this line: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

    GP adds jQuery for you.

    Also, make sure the src of the second line includes your full website URL, not just the file name.

    Hope this helps πŸ™‚

    Aaron Harms

    Hey Tom,

    Thanks for the quick reply! πŸ™‚

    I went ahead and made sure my src path was absolute in my second line of code. ( http://www.hhsc.org/fluidtextresizer.js )

    My text resizing buttons are working as they should. You can test this out at http://www.hhsc.org . Under the entry title of each page, you will see text-resizing buttons (three A’s with borders around them).

    But this causes the functionality of my main menu to break.

    If I then delete the line of code that you told me to delete, my menu still has the same problem, and my text resizing buttons do not work.

    Any other ideas?

    Lead Developer
    Lead Developer

    Right now this line is causing javascript errors on the page, which will break a lot of different things:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

    The currently used jQuery version is 1.12, so as you can see the one they’re telling you to use is very old and not suggested at all.

    I’m not sure I see what the resizing script is doing exactly? It shouldn’t technically be working right now as javascript is broken on the page.

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.