• Resolved ashiquzzaman

    (@ashiquzzaman)


    How I hide the Head Text which is “Magna Aliquam” when “Hide Head Text” checkbox is checked and show when the checkbox is unchecked.

    Below is my code, but I’m lost. Any help would be appreciated

    wp.customize( ‘hide_head_text’, function( value ) {
    value.bind( function( to ) {
    if($(“hide_head_text”).is(‘:checked’))
    $(“.welcome-text h2”).hide(); // checked
    else
    $(“.welcome-text h2”).show(); // unchecked
    } )( jQuery );

    Here’s the image – https://i.stack.imgur.com/MN0HE.jpg

Viewing 14 replies - 1 through 14 (of 14 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Don’t you just want to toggle a class so that you can use CSS to hide it instead?

    Thread Starter ashiquzzaman

    (@ashiquzzaman)

    Yes, Toggle also can do the trick. IMO,css is unnecessary in this case. All I am looking for is a working example and I can figure out the rest. I suck at JavaScript *sigh*

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    So none of that JS works?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Is there an error coming up in your console saying $ is undefined?

    Thread Starter ashiquzzaman

    (@ashiquzzaman)

    Yes, I am not doing things the right way. WordPress has this functionality enabled in its “Site Identity” I am looking for that specific file so that I can take a look of how WordPress doing it.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Thread Starter ashiquzzaman

    (@ashiquzzaman)

    Yes, enqueue is all good.

    I am getting this error
    “Use of getPreventDefault() is deprecated. Use defaultPrevented instead” which I am getting continuously,didn’t resolve it as everything worked fine.

    A new error showed up this time – “SyntaxError: missing } after function body” and I am working on it as I type

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Are these PHP or JS errors?

    Thread Starter ashiquzzaman

    (@ashiquzzaman)

    From reading Stackoverflow answers, these are JavaScript errors

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Do the errors disappear if you remove this bit of your code:

    if($("hide_head_text").is(':checked'))
    $(".welcome-text h2").hide(); // checked
    else
    $(".welcome-text h2").show(); // unchecked

    So you just end up with:

    wp.customize( 'hide_head_text', function( value ) {
    value.bind( function( to ) {
    
    } )( jQuery );

    Thread Starter ashiquzzaman

    (@ashiquzzaman)

    Nope, Tried, error is still shows
    ‘wp.customize( ‘hide_head_text’, function( value ) {
    value.bind( function( to ) {

    } )( jQuery );’

    adding }) at the end of the file solved the synteax error

    Anyway,I appreciate your help ??

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Looks like you’re missing a few characters with this:

    wp.customize( 'hide_head_text', function( value ) {
    value.bind( function( to ) {
    
    } )( jQuery );

    Try this:

    wp.customize( 'hide_head_text', function( value ) {
        value.bind( function( to ) {
    
        })( jQuery );
    });

    Thread Starter ashiquzzaman

    (@ashiquzzaman)

    Yes, adding “})” at the end solved the error

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    So you want to see if the checkbox is ticked when the page reloads? And do you want to see if the checkbox is ticked when dynamically tick it in the customiser section?

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘Hide Text when check box option is ticked in customizer?’ is closed to new replies.