Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #892720

    Hello,

    Recently I found this website: https://www.iaxchem.com/about-us/
    Can I use the enfold theme to achieve timeline effect?

    Best Regards,
    Arvin

    #892727

    Hey Arvin,

    Yes, you can achieve that using Enfold, you will first need to enable Custom Css Classes, first go to Enfold > Layout Builder > Show element options for developers > then check “If checked this will display developer options like custom CSS classes or IDs”
    On the page, in every row add 2 1/2 columns, 1 with content and the other with none, after doing this, please provide the link to the page, so we can give instructions on what to do next.

    Best regards,
    Nikko

    #892753
    This reply has been marked as private.
    #893160

    Hi Arvin,

    Thanks, edit the columns and Custom Css Class to each:

    • for the left columns with content, assign this css class name: col-left-content
    • for the right columns with content, assign this css class name: col-right-content
    • for empty columns, assign this css class name: col-empty

    Then go to Enfold > General Styling > Quick CSS, and add this css code:

    .page-id-535 #main .entry-content-wrapper {
        background: url('image_url') center top no-repeat;
    }
    
    .col-left-content {
        padding-right: 50px;
    }
    
    .col-right-content {
        padding-left: 50px;
    }

    Just replace image_url with the image of those arrows, the link you gave uses this image: https://www.iaxchem.com/wp-content/uploads/2015/07/%E8%BD%B41.png

    Hope this helps :)

    Best regards,
    Nikko

    #893534

    wow, it’s really cool. thank you so much, Nikko.

    #893601

    Hi,

    Great, glad we could help. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

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

You must be logged in to reply to this topic.