This topic contains 11 replies, has 2 voices, and was last updated by  Glen Pavelich 2 weeks, 4 days ago.

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #177519

    Glen Pavelich
    Participant

    What is the optimal size for the header image. I have used the 1920 to create the image but then it needs cropping, and after that, even though it looks ok in customize mode, when published it enlarges on the front end.

    How is this prevented?

    http://test.hoffmannholderinsurance.ca/

    #177553

    Skandha
    Keymaster

    @fireflywebs: Hello Glen,
    The recommended size for Header Image is 1920*1080.
    Can you check how the image looks if you skip cropping?

    Let me know if this solves the issue.
    Kind Regards,
    Skandha

    #177803

    Glen Pavelich
    Participant

    I did the skip cropping, but it still enlarges and doesn’t show the full image. I don’t want it as tall as 1080 and I would like the background color on the left so the media text block shows up.

    #177945

    Skandha
    Keymaster

    @fireflywebs: Hello Glen,
    Can you try the image with dimension 1920 × 822?

    Let me know if this works out!
    Kind Regards,
    Skandha

    #178023

    Glen Pavelich
    Participant

    It helped. I tried that size with no cropping and the right border was still hidden. I had to crop a bit on the left border for the next try to make it appear correctly. The Media Text Box is now centered.
    Thanks

    #178032

    Glen Pavelich
    Participant

    One more thing.
    Changing the width of the media text box changes the size of the header image.
    IE
    .custom-header-content .entry-container-wrap {
    max-width: 300px;
    }
    (This code above is not presently applied, but you can try it to see what I mean).

    Are they tied together somehow? Is there a way to isolate the CSS for just the media text box?

    #178073

    Skandha
    Keymaster

    @fireflywebs: Hello Glen,
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    .custom-header-content {
        display: inline-block !important;
    }

    Let me know if this is what you want!
    Kind Regards,
    Skandha

    #178096

    Glen Pavelich
    Participant

    Nice. Yes that did it perfectly.

    Thanks

    #178217

    Skandha
    Keymaster

    @fireflywebs: Hello Glen, I hope I was able to resolve your issue. If it’s not too much trouble, I have a quick request: could you please leave an honest review?
    https://wordpress.org/support/theme/clean-blocks/reviews/#new-post
    Your review will help others know what to expect when they’re looking for the support I offer. Even a sentence or two would be hugely appreciated. Thanks, and if there’s anything else at all that I can do to help, don’t hesitate to let me know. Have a good day! 🙂

    Kind Regards,
    Skandha

    #178267

    Glen Pavelich
    Participant

    One more item:
    Thanks for helping with this. Looks good except for in responsive mode. Can you take a look at the header image with different screen sizes.

    Glen

    #178336

    Skandha
    Keymaster

    @fireflywebs: Hello Glen,
    I checked your site and it looks very good in a desktop screen. It looks okay when the screen size is decreased but the text container overlaps with the image. Don’t you like the full header image with the text container in the default position?

    Kind Regards,
    Skandha

    #178360

    Glen Pavelich
    Participant

    The text container position is fine yes, but when I look at the header image in various screen sizes, ie on my ipad, the image is cut off on the right (doesn’t decrease). Are you not seeing it that way? Definitely still a glitch for that aspect on my end.

    See: http://test.hoffmannholderinsurance.ca/wp-content/uploads/2019/07/screensize-1024.jpg

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

You must be logged in to reply to this topic.