Tagged: ,

Viewing 30 posts - 1 through 30 (of 30 total)
  • Author
    Posts
  • July 24, 2014 at 1:59 pm #295416
    McEwans

    Hi support!

    Thank for the awesome help yesterday.

    As i said i have another issue,

    We are trying to replicate this home page in our design, http://anchor.umbrella.al/2demo/

    We don’t need the ajax animations or anything, what we really need for the design that was signed off is a full page slide show behind the 3 content blocks. I managed to set this up in a colour section, but then realised that the colour section only offers one background image and not a slide show. We need the images to change in the background behind the 3 content blocks.

    What would be the best route?

    July 24, 2014 at 5:16 pm #295499
    Yigit

    Hey McEwans!

    You can simply add content sliders under content elements in Advanced Layout Builder into your color section element :)

    Regards,
    Yigit

    July 24, 2014 at 5:22 pm #295504
    McEwans

    Sorry i don think i understand you correctly. Would this create a fullscreen image slide show?

    July 24, 2014 at 5:26 pm #295508
    Yigit

    Hey!

    You already have fullscreen slideshow on your page and i thought you would like to make slideshows into 3 content boxes like example site. Could you please elaborate? I am not sure if i understood you correctly

    Cheers!
    Yigit

    July 24, 2014 at 5:27 pm #295510
    McEwans
    This reply has been marked as private.
    July 24, 2014 at 5:29 pm #295512
    McEwans

    sorry that full screen slide show on the home page we had to code in with some custom hacks using the child theme style.css file. But it effects all the theme colour styling so it is messy. I thought maybe there was an easier more stable way to do this with the them layout options.

    July 24, 2014 at 5:30 pm #295514
    McEwans

    The full screen background slider we are using is also not responsive and the image distorts on lower resolutions.

    July 24, 2014 at 5:32 pm #295515
    Yigit

    Hey!

    Currently there is no easier way i am afraid. You can request such feature or vote if already requested here – https://kriesi.at/support/enfold-feature-requests/
    How does it effect theme styling? Please use Color Section ID and Page ID to customise your page so changes would be applied to the element only on that certain page :)

    Cheers!
    Yigit

    July 24, 2014 at 5:36 pm #295520
    McEwans

    Ok thank you! I think that will help us a lot, we are finished work now here, so i guess if there are more issues i will speak to you tomorrow :) Is it ok if we try this out before we close this ticket?

    July 24, 2014 at 8:37 pm #295642
    Yigit

    Hi!

    Sure, i will keep the thread open and it will be on hold until you reply. So please try and then post the results here :)

    Best regards,
    Yigit

    July 25, 2014 at 9:47 am #295831
    McEwans

    Would it be possible to position one of the theme sliders like you have said to the colour section and use it as the background slider? Would i need to firebug the colour section ID? Or can i add my own ID to it?

    July 28, 2014 at 10:30 am #296633
    Yigit

    Hi!

    Using custom CSS it is possible. Giving color section an unique ID would be better. Please see – http://kriesi.at/documentation/enfold/wp-content/uploads/sites/2/2013/12/color-section-ID.png

    Cheers!
    Yigit

    July 28, 2014 at 11:00 am #296652
    McEwans

    Thanks Yigit, so if we gave the colour section an ID would we need a more advanced developer to set the slider in position or is there a line of code on your side that would work?

    That would finish the ticket off perfectly :)

    July 28, 2014 at 11:07 am #296655
    royaltask

    This conflicts with your menu and links, not chickable in mobile devices.

    July 28, 2014 at 2:36 pm #296771
    Yigit

    Hey!

    Please add slider to top of your test page and add color section element with unique ID right below it so we can take a quick look :)

    Regards,
    Yigit

    July 28, 2014 at 2:48 pm #296773
    McEwans
    This reply has been marked as private.
    July 28, 2014 at 2:55 pm #296778
    Yigit

    Hey!

    Can you also post the link to your test page?

    Best regards,
    Yigit

    July 28, 2014 at 2:55 pm #296779
    McEwans
    This reply has been marked as private.
    July 28, 2014 at 3:02 pm #296786
    Yigit

    Hi!

    Please try adding following code to Quick CSS 

    @media only screen and (min-width: 990px) {
div#bg_slide {
position: relative;
top: -466px;
background: rgba(255,255,255,0.3);
}}

    You may need to adjust the values

    Cheers!
    Yigit

    July 28, 2014 at 4:00 pm #296814
    McEwans

    thanks Yigit! i tried the code, it got us to a similar position we reached when we where trying to style it. I have added content to the columns, have a look, the blocks display well until mobile size, then they drop to a grey content area. But even in desktop browsing their is a red colour coming up from the footer to below the slider. This was the main issue we had that we could not solve…

    July 28, 2014 at 4:03 pm #296817
    Yigit

    Hey!

    Do you mind creating a temporary admin login and posting it here privately so i can look into it?

    Cheers!
    Yigit

    July 28, 2014 at 4:11 pm #296823
    McEwans
    This reply has been marked as private.
    July 28, 2014 at 4:18 pm #296832
    Yigit

    Hi!

    Please review your website now. I have removed the red bar. For mobile, it would be better if you remove slider and only display color section with a background image

    Cheers!
    Yigit

    July 28, 2014 at 4:36 pm #296853
    McEwans

    how did you remove the red bar?? We couldn’t find that!?

    Also the content blocks only show up when i scroll on the page, when i load the test page without scrolling they dont show up :P So sorry for this man, really don’t mean to take up so much of your time!!

    July 28, 2014 at 4:39 pm #296857
    McEwans

    And with the background image on mobile, must i then media query the slider to display none?

    July 28, 2014 at 4:39 pm #296858
    Yigit

    Hey!

    I have changed “top” to “margin-top”. Please try adding following code to Quick CSS and check if that helps 

    div#bg_slide { z-index: 99; }

    EDIT: Yes. You can turn on Custom CSS field for ALB elements ( http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ ) to make it easier to target the element :)

    Regards,
    Yigit

    • This reply was modified 10 years, 4 months ago by Yigit.
    July 28, 2014 at 4:46 pm #296868
    McEwans

    Thank you its working perfectly now! Wow this service you gave today was 10 out of 10

    July 28, 2014 at 4:50 pm #296871
    McEwans

    Where did you input your styling? I dont see it anywhere in the quick css?

    When we update the them will there be any issues?

    July 28, 2014 at 4:58 pm #296876
    Yigit

    Hi!

    You are welcome, glad we could help :)
    I saw that you have added your custom CSS code to Style.css file of your child theme in Appearance > Editor so that is where i have made adjustments. Changes will not be lost when you update your theme

    Regards,
    Yigit

    August 12, 2014 at 4:14 pm #303277
    McEwans

    Thanks for the help on this! Top notch support.

  • Author
    Posts
Viewing 30 posts - 1 through 30 (of 30 total)
  • The topic ‘Full page background slider with content’ is closed to new replies.