Home Forums Pro Themes Blog Pro Change Menu Header Image

Tagged: , ,

This topic contains 12 replies, has 2 voices, and was last updated by  wensolutions 2 months, 2 weeks ago.

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #98792

    Ginger Vazquez
    Participant

    How do I change the header background image that is currently black where the menu is to a different image in the Blog Pro?

    #98809

    wensolutions
    Keymaster

    Hello,

    The option to change the banner image is available in the theme itself.

    For this go to Admin Panel > Appearance > Customize > Banner Image for Inner pages and change the image as per your requirement.

    Hope this helps.

    let us know if you have any confusion further.

    Thank you.

    #98829

    Ginger Vazquez
    Participant

    I do have a graphic in this area but it does not change the actual banner image of the menu.

    #98868

    wensolutions
    Keymaster

    Hello,

    Can you please provide the screenshot of the section so that we can inspect further and help you?

    Thank you.

    #99427

    Ginger Vazquez
    Participant
    #99445

    wensolutions
    Keymaster

    Hello

    The feature is not given by the theme itself to change the background image of the navigation menu.

    However, as a work around, please add the below given CSS by going to Admin Panel > Appearance > Customize > Additional CSS

    header#masthead.secondary-header {
    background-image: URL("https://wfnos.org/wp-content/uploads/2019/05/shutterstock_1125408311-1.jpg");
    background-position: -147px 1049px;
    }

    Hope this helps.

    For any further query/confusion, feel free to write back to us.

    Regards!

    #99489

    Ginger Vazquez
    Participant

    Hi, I tried this and it didnt change the graphic. Please see the screenshot here:

    #99498

    Ginger Vazquez
    Participant

    src=”http://https://wfnos.org/wp-content/uploads/2019/06/WFNO-Screenshot-with-CSS.png” alt=”Screenshot” />

    #99598

    wensolutions
    Keymaster

    Hello,

    Have you replaced the image URL with your image URL?

    You have to place your image UL here. The URL can be found in the media section.

    Screenshot:

    https://prnt.sc/nzru0d

    Also, you can send the screenshot by using the tools like lightshot.

    Hoping to hear from you soon.

    Thank you.

    #99614

    Ginger Vazquez
    Participant

    Yes, I did.. please find what was inserted below (it was also in the previous screenshot I sent):

    header#masthead.secondary-header {
    background-image: URL(“https://wfnos.org/wp-content/uploads/2019/05/Wide-image-showing-flags-of-nations.jpg”);
    background-position: -147px 1049px;
    }

    #99654

    wensolutions
    Keymaster

    Hello

    First of all, we apologize for the inconvenience.

    Please add the below given CSS in the additional CSS section.

    header#masthead {
        background-color: none;
        background-image : URL("https://wfnos.org/wp-content/uploads/2019/05/Wide-image-showing-flags-of- 
        nations.jpg") !important;
        background-position: center
    }

    Also, since the flags image are with multiple colors, the text color is getting affected.

    Screenshot : https://prnt.sc/o0902i

    Please once verify the CSS and report us back if you want the changes in the existing font color.

    For any further query/confusion, feel free to write back to us.

    Best Regards!

    #99685

    Ginger Vazquez
    Participant

    What size should the graphic be? We can resize it so that the image shows correctly?

    #99740

    wensolutions
    Keymaster

    Hello,

    The area that is covered by the menu in the header is “1350X70 px“. So you can almost upload the image of the size as mentioned above.

    Hope this helps.

    Thank you.

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

You must be logged in to reply to this topic.