Viewing 21 posts - 1 through 21 (of 21 total)
  • Author
    Posts
  • #544253

    Hello

    I would like to know how this site:
    http://careerhearted.com/

    in the section where it says:
    “You Have Passion. We Know Business.
    Let us show you how to take care of your business so it can start taking care of you!
    LET US HELP YOU”

    Is that by putting in a background image?

    thank you

    #544267

    Hey Nathan!

    In the Enfold layout builder, this can be achieved by inserting a text element, a transparent button element and a background image in a color section.

    Note that the background image on that website was blurred before hand.

    Cheers!
    Dake

    #547738

    Thank you.

    For the transparent element, so add all these in a fullwidth section element and to position the button edit the button padding?

    #547777

    Hi!

    Correct however you can reposition the button with the below css:

    #top .avia-button.avia-color-light {
        top: 5px !important;
        left: 0px !important;
    }

    Cheers!
    Dake

    #547778

    I think I’m learning what you are communicating.

    How did this website:
    http://careerhearted.com/

    make the top image the full width of the page and the add the button in the middle?
    Can you please give me a step by step because I’m still learning.

    Thank you Dake

    #547793

    Hey!

    That can actually be performed with the same steps I described earlier.

    Below is the basic set up and layout used:

    Color section (with a custom section background image) > Special Heading > Text Element (set to light transparent button color) > Button > Text Element

    View post on imgur.com

    View post on imgur.com

    Best regards,
    Dake

    #547798

    Thank you for explaining it visually, I learned it right away!

    I see now that we all learn differently, and when I was reading it, it didn’t yet make sense to me.

    Thank you so much, now I can move forward and do this!

    #547802

    Hey!

    Glad you got that short out!
    Please do let us know if you need anything else, we will be more than happy to assist.

    Cheers!
    Basilis

    #547804

    One last question, how is the image spanning the whole width off the page?

    #547807

    Hi!

    The image is spanning the whole width because it is fairly large and is set as a background image in the color section:

    View post on imgur.com

    Regards,
    Dake

    #554110

    This is what showed up on my home page.

    What step am I missing to do?

    Thank you, sorry for so many questions.

    #554118

    bodytalkcare.com

    #554812

    Hi,

    I’m not sure what you meant by your last posts, were you supposed to attach a screenshot? If so I can’t see one?

    Regards,
    Rikard

    #555065

    I hear you, the image is on the main home page for bodytalkcare.com
    The image is far from the header menu and I need the image with the button to take up all the space like the main pages for:
    •https://www.airbnb.com
    I need my image to be like the https://www.airbnb.com home page where the image goes all the way to the sides and top, how do I set the perimeters for that?

    Thank you for your help!

    #557037

    Hey!

    try this code in Quick CSS field:

    .flex_column.av_one_full.av-animated-generic.fade-in.flex_column_div.av-zero-column-padding.first.avia-builder-el-0.avia-builder-el-no-sibling.avia_start_animation.avia_start_delayed_animation {
    width: 112%;
    left: -6%;
    height: 534px !important;
    }
    

    but why not choose fullscreen slider element instead?

    Best regards,
    Andy

    #557201
    #557234

    Hey!

    You can display the airbnb and uber websites header layout by using a color section and setting your header to transparent or transparent glossy.

    View post on imgur.com

    Best regards,
    Dake

    #557271

    Thank you, where is that located?

    #557306

    Hey!

    You’re welcome :)

    It is located on the right side of the edit page screen as shown in this screenshot:

    View post on imgur.com

    Best regards,
    Dake

    #557319

    Thank you.
    Is there a padding I need to set?
    Why is the image so thin and small?
    I’m needing the image to be the full screen size.

    #557442

    Hey!

    it’s small because WordPress is cropping image sizes by default when uploading them. You can control this by using a plugin like: https://de.wordpress.org/plugins/simple-image-sizes/

    Best regards,
    Andy

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