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.

  • 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)
  • Avatar of @ChrisClayton
    @ChrisClayton
    Participant

    @chrisclayton

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

    wouldn’t that only change the background?

    and where should i add that?

    Avatar of @ChrisClayton
    @ChrisClayton
    Participant

    @chrisclayton

    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. http://codex.buddypress.org/theme-development/building-a-buddypress-child-theme/

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

    Please help?

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

    I am sorry for bumping this again.

    Avatar of aces
    aces
    Participant

    @aces

    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…..

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

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

    Avatar of aces
    aces
    Participant

    @aces

    `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’); }
    `

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

    Avatar of aces
    aces
    Participant

    @aces

    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…

    thank you a lot, it worked!
    =w=

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

You must be logged in to reply to this topic.