Hide Customizer panel with JS?

  • lveale

    (@lveale)


    4 years, 9 months ago

    Hi there

    I am trying to hide a customizer panel (site identity) using Javascript, is this possible?
    I have a js file that is enqueued in the functions.php file and is currently running a function to hide sections in the customizer and that works.
    But when I try to hide a panel, for example with:

    $( '#accordion-section-title_tagline' ).hide();

    it doesn’t work.

    I wondered if anyone can suggest why this might be? I don’t know if there is some reason why this won’t work, or if it’s just going to be syntax somewhere in my implementation.

    Thanks in advance

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator bcworkz

    (@bcworkz)

    4 years, 9 months ago

    I’m guessing that WP scripts are simply re-showing it again after you’ve hidden it.

    You’d be better off removing it via PHP so there’s nothing for WP scripts to show.
    https://developer.wordpress.org/reference/classes/wp_customize_manager/remove_panel/

    Thread Starter lveale

    (@lveale)

    4 years, 9 months ago

    Hi bcworkz thanks for your reply.

    I can remove it via php but the issue that I have is that I would really like to show/hide panels depending on a radio button selection in the customizer, so I need it to dynamically update when the radio button is changed.
    Am I correct in saying this is not possible using php as the page seems to have to be fully refreshed for it to take effect?

    Moderator bcworkz

    (@bcworkz)

    4 years, 9 months ago

    If you want it back on, yes. I was thinking you wanted it permanently hidden, not realizing you were hiding the site identity panel and one would want it showing at least sometimes.

    How are you invoking the .hide()function? I suspect from the typical $(document).ready(); would be too early. It would need to be tied to some event that happens after the WP scripts display the customizer to start with. And based on user interaction, WP scripts may re-display the panel, so you’d need to re-hide after such events as well.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Hide Customizer panel with JS?’ is closed to new replies.