WordPress.org

Ready to get started?Download WordPress

Forums

Responsive WordPress Slider - Soliloquy Lite
[resolved] Use Loading Icon? (3 posts)

  1. nwisg
    Member
    Posted 1 year ago #

    Outputs a loading icon while your slider loads to prevent content shifting.

    This feature is selected but I not working for me in Twenty Eleven. The slider is using shortcode on client's front page. Look here and see the content shift http://tenersautoclinic.net

    Nice slider, simple and I like that.
    Might have to buy this one for my developers toolbox.

    http://wordpress.org/extend/plugins/soliloquy-lite/

  2. Thomas Griffin
    Member
    Plugin Author

    Posted 1 year ago #

    You've got a ton of JS errors on your page due to improper embedding of Google Maps, which is likely causing the issue with rendering the slider properly. I would see about getting that checked out, and once those errors are resolved, Soliloquy should work just fine. :-)

  3. nwisg
    Member
    Posted 1 year ago #

    I see nothing wrong with the Google map code, I did find that the Sharethis js was not validating in HTML 5, they are aware of this and are supposedly working on it. Here nor there I removed the Sharethis code and placed the slider on the Hello World page with some content (No Map). This is running on Twenty Twelve no mode as of yet and there is still content shift.

    You see briefly the loading animation and then slides load fine, which is normal, but if there is any delay in loading up there is a content shift down. There needs to be a placeholder keeping the height during page load so there is no content shift. If this is what should happen it's not.

    Here you can also see what the W3C says:

    Error Line 83, Column 1056: Element style not allowed as child of element div in this context. (Suppressing further errors from this subtree.)

    …/ul></div></div><style type="text/css">.soliloquy-container.soliloquy-preloade…

    Contexts in which element style may be used:
    If the scoped attribute is absent: where metadata content is expected.
    If the scoped attribute is absent: in a noscript element that is a child of a head element.
    If the scoped attribute is present: where flow content is expected, but before any other flow content other than inter-element whitespace, and not as the child of an element whose content model is transparent.
    Content model for element div:
    Flow content.

    I can work around the page shift with css that's no problem. But your code is not validating with W3C right now and may be why there is content shift at least in HTML 5 I have not tested this in XHTML strict.

    I really like this plugin though especially for the WP challenged client, very easy to use and works well with one, well two exceptions. The W3C is the big one for me.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.