StyledThemes

Home Page lazy load

Home Forums WordPress Themes – Premium Lavish Pro Home Page lazy load

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #16595
    Ellen
    Participant

    How are you animating the home page in the demo? I understand you are using Revolution Slider with the large image, but what about the remaining content? They look like they are widgets, how are they animated in lazy load?

    A tutorial on how you set up the home page would be nice.

    PS: This is a very different theme for you, and I LOVE the features and the look of it, but lots more direction is needed. At the very least if you are using external plugins for certain features/functionality a simple hint about what it is and where it’s used would be a big help. Thanks for your continued support.

    #21859
    Brian
    Member

    I agree with this post. Where is the response after 2-3 weeks?

    #21860
    Binaya D
    Participant

    Hi Ellen,

    Please use the plugin in wordpress which names are mentioned below:
    bbPress, Breadcrumb NavXT, Contact Form 7, Font Awesome Shortcodes, Jetpack by WordPress.com, Remove Widget Titles, Revolution Slider, UpdraftPlus – Backup/Restore, Widget CSS Classes, Widget Importer & Exporter, WooCommerce, WordPress Importer, WP Google Maps.

    We have to use banner-wide-widget for slider image in home page as well as google map in contact us page. After the slider image we have to use call-to-action- widget.
    Then we have use Top1 to Top4 widget etc.
    OR
    Please follow this link styledthemes.com/lavish-pro-setup

    Thanks

    #21864

    I’ve the same question, but your answer doesn’t help me at all. Can you please provide a step by step user documentation?

    #21865
    Brian
    Member

    Doing some research it seems that the jetpack might be adding that feature. It’s referred to as infinite scroll and it seems that there is a tutorial for this online. I’m going to research it some more and post a link if it’s the right tool for the job. The page builder plugin doesn’t seem to allow for lazy load features using CSS. I tried their support and there is no reference to it.

    #21866

    Thank you. I’m also working with the plugins now and trying to find how they can help. When you’ve found out how it works I’m interested!

    #21867
    Shekhar Bhandari
    Participant

    Hi There,

    Please view the video tutorials here: https://youtu.be/yu2bnKow1yk

    Thanks

    #16596
    Brian
    Member

    The video link is helpful, but incomplete for this application. It shows that the animate.css does work to add animation to the page elements. However, the video shows it using HTML code, not with the Site Origin Page Builder.

    So I messaged with support again and this time was given the solution. The animate.css stylesheet is included with the Lavish Pro template (and maybe the others too). So there is no need to manually download or install it. You just need to go to your page element using Page Builder. In the Attributes section under Widget Styles you need to add code in the Widget Class box. Here is how to do it:

    If you want to fade in an element such as text, or an image, you just need to add the following: “wow animate fadeInDown”. That will cause the element to fade in when the end user reaches it scrolling through the page. The “wow” was explained to me as a rule that is required to activate the CSS command. The “animate” is required to begin animation, and the “fadeInDown” is the type of animation that will take place. There is a list of commands using this link here: https://github.com/daneden/animate.css

    If you scroll down the page you will see a longer list of different animations. Just make sure to couple them with “wow animate (your selected animation)” and you should be fine. It’s very easy once you know the correct code.

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.