Header Image does not appear in the Homepage Template

  • Author
    Posts
  • #157979
    lyneborg2012
    Member

    No matter what I do in Customize> Header Image nothing happens on my front page “Velkommen”. Therefore, as an emergency solution, I have placed a header image directly in the Homepage Template. Of course I have also tried without picture in the page template – with the same negative result.
    Perhaps some data has stuck somewhere in the system. I hope you can help here since I love working with the Collective theme.

    The blog I need help with is: (visible only to logged in users)

    #157993
    itsdavidmorgan
    Theme Author

    Hello,

    The Header Image only displays on the blog and archive pages using the Collective Theme.

    If you wish to add an image to the top of the Home Page template, you will need to add a Featured Image to the page that you have selected as the “Home Featured Page” within the Customizer Theme Options.

    Screen Shot

    For instance, in the screenshot above, adding a Featured Image to the “About” page that has been set as the “Home Featured Page” will display an image at the top of the page.

    I hope this helps. Thanks!

    #158000
    lyneborg2012
    Member
    Original poster

    Thanks. But why can’t I get the Customize> Header Image to work?

    #158018
    itsdavidmorgan
    Theme Author

    Hello,

    As previously mentioned, the Header Image only displays on the blog.

    Do you have a blog page on your site?

    By blog, I mean the page you have selected as the “Posts Page” under Customize > Homepage Settings. The blog is the only location where the Header Image will display on your site. Otherwise, you can use Featured Images for pages.

    Thanks!

    #158031
    lyneborg2012
    Member
    Original poster

    Yes, I have chosen a blog site. However, your well-meaning advice does not change the problem with the header image on the front page “Velkommen”. And featured Images for pages is not a solution for two reasons:
    1) The image does not appear correctly on the front page,
    2) The image is displayed very differently on different screens, the computer and an iPad.

    On the Support site I red a post about a related issue: “cannot get featured image to appear on posts page”. Unfortunately, the dialogue did not reveal how the user resolved the issue. But today, his site looks great.
    Thanks.

    #158049
    emilysuesrq
    Theme Author

    Hello,

    The only way to display an image at the top of the homepage (as seen in both the demo and this site) is by using the Featured Image function on your homepage, as described in David’s previous instruction. Can you please clarify what you mean when you say “The image does not appear correctly on the front page”? When viewing your site, the homepage Featured Image appears as normal:

    Screen Shot

    Also, please provide a screenshot of the issue you’re having on different devices. Again, when viewing your homepage, the image appears as it should. The image does scale to fit the different browser sizes in other devices, as it is supposed to.

    Thanks in advance for clarifying.

    Kind Regards,

    Emily

    #158053
    lyneborg2012
    Member
    Original poster

    Hi Emely.

    Thanks for stepping in here. I have posted two pictures which show the situation HERE.

    #158150
    itsdavidmorgan
    Theme Author

    Hello,

    Try adding the following style to resolve your display issues with the featured image:

    .home .featured-page-section {
      background-attachment: scroll;
    }
    

    Please note, this style can be added under Design > Customize > Additional CSS within the WordPress Customizer.

    I hope this helps. Thanks!

    #158158
    lyneborg2012
    Member
    Original poster

    Yes, that code solved the mystery – not 100 percent but well enough to live with. On my iPad, the image is still cropped – however, without destroying the motif as it did before.

    On the other hand, it still surprises that you can not simply insert the image directly from “Header image” in the Customizer. That seems to me more logical.

    Thanks for the help.
    Kind Regards,
    Jørgen.

    #158212
    itsdavidmorgan
    Theme Author

    Hello,

    There will likely always be a little cropping of the image on different screen sizes, since that’s the nature of background images. However, you could adjust this somewhat for iPads by adding the following style:

    @media screen and (max-width: 1024px) {
      .featured-page-section .featured-page {
        padding: 80px 0;
      }
    }

    You can adjust the 80px value as needed. This style should only effect screen sizes of an iPad and smaller.

    I hope this helps. Thanks!

    #158219
    lyneborg2012
    Member
    Original poster

    It’s getting better and better!
    Thanks.

  • The topic ‘Header Image does not appear in the Homepage Template’ is closed to new replies.