Tagged: ,

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • September 1, 2025 at 12:16 am #341076
    catwingz
    Participant

    Hi. If you look at  https://aligningwithsoul.com

    you will see that instead of a photo or video, the background of the header has been replaced by solid color. This is currently in the form of an image because I have been unable to find the CSS to just change the background color.

    1. How can I change the background color of just the area of the header banner?
    2. Is it possible for me to have more control over the height? I have noticed that cropping an image so it is shorter doesn’t appear to make any difference.

    Thank you

    September 1, 2025 at 1:19 am #341082
    minal
    Keymaster

    Hello @catwingz:

    Unfortunately, the theme does not provide built-in options to change the background color or header height directly. However, you can achieve this by adding custom CSS.

    Below is a CSS snippet you can use to change the background color of the header banner:

    .custom-header:after {
     background: rgba(0, 0, 0, 0.1);
}

    To add CSS , Go to Dashboard > Appearance > Customizer > Additional CSS.

    You can modify the rgba value to your preferred color. The last value (0.1) controls the transparency — increasing it will make the background darker, while decreasing it will make it more transparent.

    Regarding the header height, it is dynamically generated to ensure that the header image fits the window height. As a result, parts of the image may appear cropped.

    Sincerely,
    Minal

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.