Skip to:
Content
Pages
Categories
Search
Top
Bottom

[Resolved] Help with changing the header image of my site via css with the buddypress default theme.

  • @nilssvz

    Member

    So, how can I change the header using css, so it’s like “built-into the theme”?
    I need to do that because I want to make theme switching for users possible without the header staying the same all the time.
    Can you tell me where the code to change is located, and where I should enter the url to my header?

Viewing 13 replies - 1 through 13 (of 13 total)
  • @chrisclayton

    Participant

    div#header {
    background-image:url(‘This-is-the-path-to-an-image-file.gif’);
    }

    @nilssvz

    Member

    wouldn’t that only change the background?

    and where should i add that?

    @chrisclayton

    Participant

    That will change the background of the header. Was their something else you wanted to change via CSS?

    Everything else is practically the same concept, for example removing the header logo, you will want to ad “div#header h1 { display:none; }” ect. ect.

    What exactly do you want to change? (you will need to be clear as their are alot of divs and other elements that make up the header)

    See the codex on Child Theme’s and Stylesheets regarding where to add it. You will want to implement it into your child theme’s stylesheet. https://codex.buddypress.org/theme-development/building-a-buddypress-child-theme/

    @nilssvz

    Member

    i don’t want to build a child theme, i simply want to use another header image without using wordpress’ built in header feature.

    @nilssvz

    Member

    Please help?

    @nilssvz

    Member

    bump.
    Help, I really need to get this done soon.

    @nilssvz

    Member

    I am sorry for bumping this again.

    @aces

    Participant

    The best way to deal with it is in a child theme! This is the way that buddypress is designed to work so that when buddypress / bp default get upgraded you won’t lose your edits…

    Create a subdirectory under themes and create a simple text file called style.css inside the directory. Then add something like the following at the top of style.css:

    `/*
    Theme Name: nilssvz
    Theme URI: http://example.org/themes/nilssvz/
    Description: nilssvz theme for BuddyPress.
    Version: 1.0
    Author: nilssvz
    Author URI: http://example.org/
    Template: bp-default
    Tags: buddypress, two-column, grey, dark
    */`

    Then put what Chris Clayton suggested immediately below:

    `
    div#header h1 { display:none; }
    `

    and see what happens when you preview or activate your new child theme…..

    @nilssvz

    Member

    it removed the header and the background.
    how can i add them again?

    I’m sorry, I really don’t know anything about css.

    @aces

    Participant

    `display:none;` does what it says….

    Just remove that line and it will come back again…. nothing else will have changed….

    Actually going back to re-read your original message, it’s not clear what you want to do and how you expect to do it?

    Chris Clayton also suggested an alternative line for your style.css file:
    `
    div#header { background-image:url(‘This-is-the-path-to-an-image-file.gif’); }
    `

    @nilssvz

    Member

    yay, that works.
    thank you.
    now i only need to figure out how to fix the widgets, but that should be no problem.

    @aces

    Participant

    To find out what css to change, you can examine your web pages with firebug (download) in firefox or developer tools in internet explorer 8 or 9 and google chrome – it’s built in so just press F12. There are similar features in other browsers…

    @nilssvz

    Member

    thank you a lot, it worked!
    =w=

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘[Resolved] Help with changing the header image of my site via css with the buddypress default theme.’ is closed to new replies.
Skip to toolbar