WordPress.org

Ready to get started?Download WordPress

Forums

Customizr
[resolved] Adding Custom Javascript to Child Theme (how to format the code) (3 posts)

  1. optymizer
    Member
    Posted 7 months ago #

    Hello,

    I have added a custom menu to the sidebar on one of my pages, but due to the amount of pages, it is too long. http://kinglocksmiths.com/washington-dc-locksmith/

    I found this code to help me make the menu collapsible

    http://mysitemyway.com/docs/index.php/Collapsible_sidebar_menus

    jQuery(document).ready(function(){
         jQuery('.menu .dropdown a').click(function(e){
              e.preventDefault();
              if (jQuery(this).parent().children('.sub-menu:first').is(':visible')) {
                   jQuery(this).parent().children('.sub-menu:first').hide();
              } else {
                   jQuery(this).parent().children('.sub-menu:first').show();
              }
         });
    });

    But when I put this in the function.php file of the child theme, I get an error. I am not familiar with javascript, and don't know if I need to change this code or format it differently.

    Can you help me?

    Thank you,
    Sarah

  2. ElectricFeet
    Member
    Posted 7 months ago #

    You seem to have fixed it now; your menus are collapsed.

  3. optymizer
    Member
    Posted 7 months ago #

    It took me a while (and a lot of trial and error), but I found this plugin:

    Custom JavaScript Editor

    And after creating the menus and placing the CSS as stated here I placed inside the Custom JavaScript Editor this code:

    /*global document */
    jQuery(document).ready(function () {
        "use strict";
        jQuery('.menu .dropdown a').click(function (e) {
            e.preventDefault();
            if (jQuery(this).parent().children('.sub-menu:first').is(':visible')) {
                jQuery(this).parent().children('.sub-menu:first').hide();
            } else {
                jQuery(this).parent().children('.sub-menu:first').show();
            }
        });
    });

    and checked the box to "Load also: JQuery" on the right.

    It makes the menu item dropdown when you click the link (instead of going to the linked page) http://kinglocksmiths.com/washington-dc-locksmith/

    Hope this helps someone... :)

Reply

You must log in to post.

About this Theme

About this Topic