Adding an background image behind the header?

Forums » WordPress » Roseta » How To

  • Author
    Posts
  • May 1st, 2020 at 17:44 #102197
    Jan
    Power User

    Hey 🙂

    Can I add an full-width background image behind the header and/or the menu-section in Roseta or Roseta plus?

    I didnt found such an option.

    Thanks!

    May 2nd, 2020 at 13:54 #102233
    Zed
    Cryout Creations mastermind

    The header area is not designed to use a background image (the header image itself, displayed below the menu, performs the task of being the image in the header).

    If you’re looking to apply some kind of texture to the header/menu area, try the following CSS:

    body .site-header-top, body .site-header-bottom > div {
    background-image: url(...);
    /* other positioning attributes: https://www.w3schools.com/cssref/pr_background-image.asp */
}
    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    May 3rd, 2020 at 02:15 #102274
    Jan
    Power User

    Thanks, Zed 🙂

    Yes, a texture-effect is what i’m looking for.

    I decided to apply this only to the “.site-header-top” and not to the menu.

    But now the texture image end at both sides of a wide screen. Maybe the container ends after 1300px width?!

    My code used:

    body .site-header-top > div {
    background-image: url("wood.png");
  background-repeat: repeat; 
  background-size: cover; 
	  height: 220px;
}

    Nether “repeat” nor “cover” was fixing this.

    Website: www.screenpresso.com/=pvHJ

    May 13th, 2020 at 12:56 #102582
    Jan
    Power User

    Can you give me an code-snippet, how to get a texture-background-image on .site-header-top, which is “full screen width“?

    See screenshot and code above.

    May 31st, 2020 at 20:44 #103441
    Zed
    Cryout Creations mastermind

    The screenshot link is no longer available. Is the site publicly accessible?

    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)

The topic ‘Adding an background image behind the header?’ is closed to new replies.