New to the community? Start here

[Hustle Pro] Hide trigger button when popup is not shown

I have a popup made with Hustle Pro that’s set to disappear for 1 day after a visitor sees it or submits the form.

That part works, but even though the popup isn’t showing, the button that triggers it is still present.

I’d like to hide that button. WPMU Support prepared a snippet for me that needs some additional tweaking.

Thu, 25 Apr 2019 6:17:16
More Hustle Pro discussions
Hustle Pro
  • Predrag Dubajic
    • Support

    Hi Brandon,

    We have passed this over to one of our devs that was helping with the snippet so he can double check it and hopefully return with some good news soon :slight_smile:

    Please note that developer response might be slower than usual staff response, so we appreciate your patience on this.

    Best regards,

    Predrag

  • Kostas
    • CTO

    Hey Brandon ,

    I need some extra clarifications as even though this seems “easy” it actually has a lot of variables to take under account so I can help you out.

    Since there is a button I’m a little confused of “when” do you want it to be hidden so let’s take 2 use-cases to see what you want to achieve ( if it’s not one of them please do explain so I can adjust the code also ):

    Case number 1:

    User visits the website, clicks the button and gets the popup.

    Closes the popup. ( the button stays where it is since the user is still on the website ).

    User leaves the site/page.

    User comes back to the site “within” the same day ( he should not be seeing either the popup or the button ).

    Case number 2:

    User visits the website, clicks the button and gets the popup.

    Closes the popup. ( the button vanishes as well since they close the popup ).

    User leaves the site/page.

    User comes back to the site “within” the same day ( he should not be seeing either the popup or the button ).

    So the difference here is “when” do you want that button to be hidden as well, only on the “next” times that the user re-visits the website? Or should it also be hidden instantly after they view the popup for 1 time?

    Regards,

    Konstantinos

  • Brandon
    • WPMU DEV Initiate

    Hi Konstantinos!

    I appreciate the very detailed response. I understand the intricacies of this request. Keeping the popup functionality in mind, Case 1 is the option we want.

    My reasoning:

    User visits the website, clicks the button and gets the popup.

    Closes the popup.

    Clicks the button again in the same visit, the popup trigger is still active, so we want the button to remain visible.

    It is not until the page is refreshed/they come back later that the “After Pop-up is closed — No longer show this message across the site — for 1 day” setting becomes active and the popup is disabled. So that is when we want the button to hide.

    Is there a way to build this functionality (the button visibility) into the “After Pop-up is closed — No longer show this message across the site — for 1 day” setting javascript of the plugin?

    I hope this makes sense!

    Thank you

  • Kostas
    • CTO

    Brandon ,

    I’ve made some changes to the code in the functions.php file.

    The code you’ll find now will be like so:

    add_action(
    
'wp_footer',
    
function() {
    
?>
    
<script>
    
( function( $ ) {
    
function wpmudev_sls_getCookie( cname ) {
    
var name = cname + '=',
    
decodedCookie = decodeURIComponent(document.cookie),
    
ca = decodedCookie.split( ';' );
    

    
for( var i = 0; i < ca.length; i++ ) {
    
var c = ca;
    

    
while ( c.charAt( 0 ) == ' ' ) {
    
c = c.substring( 1 );
    
}
    

    
if ( c.indexOf( name ) == 0 ) {
    
return c.substring( name.length, c.length );
    
}
    
}
    

    
return '';
    
}
    

    
function wpmudev_sls_checkCookie() {
    
var popupCookie = wpmudev_sls_getCookie( 'inc_optin_popup_long_hidden-11' );
    

    
if ( popupCookie != '' ) {
    
$( '.hustle_module_shortcode_trigger.hustle_module_11').css( 'display', 'none' );
    
}
    
}
    

    
wpmudev_sls_checkCookie();
    
} ( jQuery ) )
    
</script>
    
<?php
    
},
    
999
    
);

    Everything is about the popup with id 11, as that’s the one that is triggered by the button. As mentioned above the button will be visible during the 1st visit of the site but on a refresh / re-visit it will be hidden until the timer passes.

    I hope this helps on getting down the usability needed here and please do inform me if you need any further adjustments with this!

    Regards,

    Konstantinos

  • Brandon
    • WPMU DEV Initiate

    You’re awesome! You nailed it spot on. This is exactly what I was wanting to do I just wasn’t sure how to tie into the cookies like you have successfully done.

    I will have to wait till tomorrow to make sure the button becomes visible again properly. But so far it is working perfectly.

    I made a Features & Feedback post about this. It would be awesome if this functionality could be written into the plugin itself so that the script doesn’t have to be set up per module ID. But I understand it would likely be difficult to do.

    Thank you very much!