Viewing 24 posts - 1 through 24 (of 24 total)
  • Author
    Posts
  • #890306

    Dear Sir,
    Please can you help.
    If you look at this page:

    On width 800 (when in responsive) the featured image at the top hides 30px behind the menu bar at the top on all pages – but it displays perfectly when not in responsive and also when it is on a mobile. It just seems within a certain range to be hidden behind the menu bar. I’ve attached a picture too if it helps you to see what I am talking about.
    https://www.dropbox.com/s/hmfqm6kuj1iqeam/featuredimagedisappear.jpg?dl=1
    Can you help fix this?
    Best wishes,
    Chris Skelton.

    #890359

    Hey kelsangchodor,

    Please, can you provide your WP credentials?

    Best regards,
    John Torvik

    #890420

    Hi John,
    Do you need these credentials to work out what’s wrong? I just get a little nervous giving out our admin password :)
    Best wishes

    #890670

    Hi,

    Yes, the request is simply just in case we need to log in a look into the issue further. Please be sure to add it to the private field so it will only be visible to admins.

    Best regards,
    Jordan Shannon

    #890897

    Here they are – thank you!

    #891285

    Hi,

    Add this to quick css:

    @media only screen and (max-width: 996px) and (min-width: 776px)  {
    header.entry-content-header{
    margin-top:45px!important;
    }}

    Best regards,
    Jordan Shannon

    #891416

    Thanks so much Jordan

    Works perfectly! Really appreciate your time!

    Best wishes,

    Chris.

    #891426

    Hi Jordan,
    Can you offer any advice on why the advanced layer slider on my home page – gets “chopped off” short at the top (a bit like the featured images were)?
    The address is:
    http://development.meditationinsarasota.org
    On the second and third slides – the layers get lost underneath the header menu (can you see the layers than transition in?)
    It is set to “responsive mode” with the layer slider itself
    It works perfect on desktop ad 1200 pixels wide.
    Thanks for your help,
    Best wishes,
    Chris Skelton.

    #891519

    Hi Jordan,

    I realized the CSS you suggested above makes other elements lose alignment because they also use this class:

    @media only screen and (max-width: 996px) and (min-width: 776px) {
    header.entry-content-header{
    margin-top:45px!important;
    }}

    For example. on this page below – the icon list uses this class – and therefore you will see it is out of alignment on these resolutions specified above:

    The icon list “free public talk” – moves 45px out of alignment

    Any ideas how this can be fixed – or make sure the CSS code you gave works specifically to the image at top of page,

    Best wishes,
    Chris Skelton.

    #891682

    Hi,

    Is the fix you are looking only to be applied to the one page?

    Best regards,
    Jordan Shannon

    #891684

    Hi Jordan

    No, it’s all the pages that either have a featured image or the layer slider

    Best wishes,
    Chris Skelton

    #891686

    Is seems between these widths : (max-width: 996px) and (min-width: 776px)
    For some reason 30px of the top part of the featured image or layer slider gets hidden behind the top menu bar…and therefore chopped off.
    I use featured images on about 30 of my pages – so when they are viewed on device that has width in the range above the featured or layerslider gets chopped at the top and elements are cut off…

    It displays fine on desktop though and mobile.

    Thanks for any help.

    Chris.

    #891709

    Hi,

    Perhaps adjust the css to the following:

    @media only screen and (max-width: 996px) and (min-width: 776px)  {
    header.entry-content-header img.attachment-.size-.wp-post-image{
    margin-top:45px!important;
    }}

    If this doesn’t work then you would be advised to add a custom class to those sections that we can target.

    Best regards,
    Jordan Shannon

    #891731

    Hi Jordan,
    Unfortunately that didn’t work – can you give me any guidance on adding custom class sections so that the responsive works?
    Best Wishes,
    Chris Skelton.

    #891751

    Hi,

    Please see the following walkthrough on how to do so:

    Best regards,
    Jordan Shannon

    #891757

    Hi Jordan,
    I’ve done this – I can’t understand how you would add custom class field to the advanced layer slider?
    The layslider on the home page is one of the many images that gets chopped by 30px with the range you mentioned above in the CSS
    Best Wishes,
    Chris Skelton.

    #891763

    Hi Jordan,
    I actually think it might only be happening on the layer slider now on the home page….
    So, would it be possible to add custom class field to that so you can work your magic,
    Best Wishes,
    Chris

    #891770

    Hi,

    Yes if you apply a class to just the homepage slide I do it.

    Best regards,
    Jordan Shannon

    #891774

    H Jordan,
    The thing is – you can’t add a custom class to an advanced layer slider content? I can see the option in other avia items – but now advanced layer slider…
    Hmm.

    #891871

    Hi,
    Try going to your slider setting for your slider > appearance > slider classes
    2017-12-23_160450

    Best regards,
    Mike

    #891879

    Great! Ok, Jordan – the custom class field is homepageslider
    Thanks for any help,
    Best Wishes,
    Chris Skelton

    #891882

    Hi,
    I tried to take a look to help, but you seem to have a additional login prompt to view the site that I couldn’t get past. Please advise.

    Best regards,
    Mike

    #891902

    I fixed it! Thanks for your help. Once I got the style class sorted it was OK.
    Thanks for your help.
    Best wishes.
    Chris

    #892321

    Hi,
    Glad to hear, we will close this now. Thank you for using Enfold.

    Best regards,
    Mike

Viewing 24 posts - 1 through 24 (of 24 total)
  • The topic ‘Enfold – Featured image disappearing under header?’ is closed to new replies.