Hustle popups and slide-ins showing up on bottom of page

The slide in from Hustle on the bottom of the page is messed up when the users are logged out. However, it works properly after logged in.

  • Jonjon

    Dear Gregg,

    Thank you for contacting us here at WPMUDEV Support. My name is Jon and I'll have the pleasure of helping you with this ticket.

    I have analyzed your page and you are right. The problem is there. After debugging I found there are actually two problems. One is caused by JavaScript Defer which is trying to execute jQuery code before jQuery is actually loaded and the other one is that css file is not being loaded on the not logged-in page.

    I have managed to fix the issue, at least as a workaround, by adding the css file below to the footer (on Appearance-Customize-Footer Options) of the front-page. I have also fixed the JavaScript Defer by disabling the Load JavaScript Deffered option in WP-Rocket. Both screenshots are below.

    <link rel='stylesheet' id='hustle_front-css'  href='https://yoursite.com/wp-content/plugins/hustle/assets/css/front.min.css?ver=3.0.4.2' type='text/css' media='all' />


    Now the cause of the css not loading is still unknown but we suspect it's a conflict issue and we suggest a conflict test, because I tested our plugin Hustle Pro with identical settings as yours and it worked well on our clean test site.

    Conflict Test: Please make a backup just in case something breaks or to prevent losing important settings. Then please deactivate all plugins and MU-plugins apart from WPMUDEV Dashboard and Hustle Pro. Next, activate a default theme like TwentyXX, clear all caches and check again if the issue is still there. If not, it means that some plugins are conflicting, so start activating the remaining plugins one by one and later the theme, and please check after each step if problem remains. This way you will know what is creating the conflict.

    Another important thing to consider, if this is a live website with traffic, I advice you to create a clone site, meaning a complete and exact copy of this installation in another folder in the same server, using a separate database. The following link might help you. https://getflywheel.com/why-flywheel/staging-sites/

    May I also suggest you use our plugin HummingBird Pro? Because it provides these minify/combine/move to footer/defer options for each enqueued file separately, so you can have better control of which files you want or not defered for example. https://premium.wpmudev.org/project/wp-hummingbird/

    Best Regards and let me know if I can be of further help.
    Jon

  • Gregg

    Hi Jon,

    Thanks for the help. Did you make the CSS load on every page of the site, or just the home page? On the defer issue. I need to defer to get a good PageSpeed and gtmetrix score. My page was loading in 7 seconds before deferring, it got to under 2 seconds with defer and the CDN.

    The WP Rocket Defer option does have that option for a safe mode that puts jquery at the top of the page, did you try that?

    The conflict test was already tried by 2 different support reps from your team while on live chat with me yesterday and the day before. It didn’t help.

    I tried HummingBird Pro. I tested it and WP Rocket both, and WP Rocket cut down load times by double what HummingBird Pro did. The built in CDN support for Flywheel’s CDN helped a lot there. WP Rocket in every configuration I could come up with took at least 2 seconds more off of load times than HummingBird Pro. So I ended up sticking with WP Rocket. I would have preferred using all WPMUDev products, as that just seems easier to maintain. But thats where I ended up.

  • Jonjon

    Dear Gregg,

    Thank you for your feedback.

    I have loaded the css on theme footer, so it should be available in all pages. If you want it only on front-page, since you are using WPBakery Page Builder, I recommend you to remove it from footer and add a Raw Html element to the specific page at the bottom and add the css link there only for that page. Please see Screenshots below.


    Also, you can use only the Asset Optimization from Hummingbird, and disable it in WPRocket. You can do the same for Caching as well, use Hummingbird instead of WPRocket. But please be sure not to use same feature in both plugins, as it will most likely lead to conflicts.

    Also, I did try the safe mode for jQuery and it can be used instead of disabling the defer options as well. And it seems that is the best idea considering what you have mentioned about page speed.

    Thanks for sharing that as well as your results with our plugin HummingBird, we are always working to improve and all feedback is appreciated. :grinning:

    Again, many thanks for sharing your experience with us.

    Have a wonderful day and do let us know if you need further help.

    Best Regards,
    Jon

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.