Disable the large black cross when loading page

Home Forums Product Support Forums Ajax Search Pro for WordPress Support Disable the large black cross when loading page

This topic contains 7 replies, has 2 voices, and was last updated by Ernest Marcinko Ernest Marcinko 3 months, 2 weeks ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #39595
    Fransa
    Fransa
    Participant

    Hi team!

    I’m using your plugin for a long time and it’s working great.

    But in the last monts, i see a problem. Everytime a page loads of the website, i see a large black cross for 2 miniseconds. Then it disapears.

    When I check the header in elementor editor were I pasted the ajax search pro shortcode, i also see a very large cross and a selector. Can I somehow remove this cross and the selector named “generic fields”.

    Please visit the website yourself and check added printscreen.

    Kind regards,

    Frank

    Attachments:
    You must be logged in to view attached files.
    #39598
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi Frank,

    This phenomenon is called FOUC, and is not caused by the search plugin. It happens, when the site stylesheet files are loaded asynchronously instead of during the regular page load – and the yet unstyled items flash until the CSS file is loaded.
    Usually Cache plugins have this feature, but is disabled by default Try checking your cache plugin options for asynchronous CSS loader feature or something similar.

    Some CDN providers may also offer a Stylesheet Lazy Loader, Rocket Loader or similar features – which will result in this issue. These should be used very cautiously, and critical CSS must be validated and generated first, which is not an easy task.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #39601
    Fransa
    Fransa
    Participant

    Hi Ernest,

    I’ve checked it and it seems the problems is indeeed coming from wp-rocket.

    Nomally, I can exclude the css file of a plugin in wp-rocket. In this case, I can’t find the css file aff the ajax searh plugin. Can you inform what the normal link would so that i can exclude this css file?

    Kind regards,

    Frank

    #39602
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi Frank,

    Well, it is dynamically generated, so it may change depending on the features you enable in the plugin settings. In your case this is the current file:

    https://www.abena.nl/wp-content/uploads/asp_upload/style.basic-ho-is-po-no-da-au-ga-se-is.css

    You could try this dynamic file name as well, wp-rocket should recognize it:

    /wp-content/uploads/asp_upload/style.basic-(.*).css

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #39637
    Fransa
    Fransa
    Participant

    Hi Ernest,

    I’ve disabled to cache the CSS file, result: same problem.

    Okay i’ve treid to disable all of the plugins except elementor + ajax search pro. I also disabled all of the optimization tools that elementor offers and disabled the caching, css optimization in ajax searh pro etc.

    Result: the same cross is visible in the front-end while loading + it’s very chaotic in the back-end of elementor because it sows a black cross + strange filter?.

    Please see my edit view in elementor of the header.

    This problem is started about 1 month ago. I think it’s a problem in the plugin OR elementor. Can you have a look at it? Please see printscreen of editing field in elementor (everything set to basis level + all of the plugins disabled)

    • This reply was modified 3 months, 3 weeks ago by Fransa .
    • This reply was modified 3 months, 3 weeks ago by Fransa .
    • This reply was modified 3 months, 3 weeks ago by Fransa .
    • This reply was modified 3 months, 3 weeks ago by Fransa .
    Attachments:
    You must be logged in to view attached files.
    #39643
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    The stylesheets are still moved to the website footer, to the very end for some reason. By default the plugin enqueues them to the header, so something must be moving them. Because these styles in the footer are rendered just before the page is finished loading, the browser needs a bit of time to process them, thus causing the flicker.

    If you want, I can take a look at this directly. Can you please add temporary FTP and back-end access? Thank you!

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #39646
    Fransa
    Fransa
    Participant

    Hi Ernest,

    Thank you for the reply.

    Unfortunately, i’m not allowed to give any credentials.

    Can we fix this somehow with the input that you give me?
    How can i push the system that the CSS rules for the search bar are in the header and loaded a.s.a.p. when the page loads?

    In another website made with both elementor and your plugin I experience the same issue. Isn’t this a problem that has to be fixed?

    #39655
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi,

    You can try maybe changing this option to “file”: https://i.imgur.com/z5FRtwJ.png
    That forces the stylesheets to load in the header for sure. If no luck, then I honestly don’t know, in that case something has to move them from the header to the footer. I doubt it is Elementor, as far as I know they don’t do any maninpulation of the site header contents.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.