Skip to:
Content
Pages
Categories
Search
Top
Bottom

Custom CSS Changes

  • Avatar of RockyMtnHi
    RockyMtnHi
    Member

    @rockymtnhi

    I want to change the CSS definitions for h1, h2, h3 and h4 tags in the bp-social theme. It looks like the /bp-social/_inc/css/custom-sample.css is the place to do this, but when I write a definition it doesn’t work. Here is what I put into that file:
    `h1 {
    color: #ff6600;
    size: x-large;
    font-family: Georgia,serif;
    }`

    Is there a way to do this so that bp-social upgrades do not overwrite my custom CSS definitions?

    Thanks in advance…

Viewing 3 replies - 1 through 3 (of 3 total)
  • Avatar of r-a-y
    r-a-y
    Moderator

    @r-a-y

    You’re probably trying to override the default styles so try adding an `!important` declaration in your definition.

    eg.
    `h1 { color:#ff6600 !important; font-size:x-large !important; font-family: Georgia,serif !important; }`

    Avatar of Hugo
    Hugo
    Moderator

    @hnla

    That instruction to add !important :)

    The cascade and specificity should really be observed first and foremost where are you adding your styles and where is the custom css file called from.

    Avatar of Boone Gorges
    Boone Gorges
    Keymaster

    @boonebgorges

    Are you sure that your custom-sample.css file is actually being included? With a file name like ‘custom-sample’, I’m guessing that it might not be. Check out the theme’s main style.css, and see if there’s an @import rule for custom-sample.css (or if there is a rule in any other imported stylesheet).

    I’m not sure how bp-social works (it appears to be a premium theme so I can’t look at the code) but if it is a child of bp-default, then you won’t be able to create a “grandchild” theme so that your changes won’t be overridden – WP doesn’t support that. However, you could fake it by dropping a snippet in your bp-custom.php file that looks something like this:

    `function bbg_custom_style() {
    $myStyleUrl = WP_PLUGIN_URL . ‘/custom.css’;
    $myStyleFile = WP_PLUGIN_DIR . ‘/custom.css’;
    if ( file_exists($myStyleFile) ) {
    wp_register_style(‘myStyleSheet’, $myStyleUrl);
    wp_enqueue_style( ‘myStyleSheet’);
    }
    }
    add_action(‘wp_print_styles’, ‘bbg_custom_style’);`

    (See http://codex.wordpress.org/Function_Reference/wp_enqueue_style for more info on how to enqueue styles)

    Just make sure that you have your custom styles in a file called custom.css in your plugin directory. That should make sure that your styles get loaded, but that they don’t get overwritten by future upgrades to your main theme.

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

You must be logged in to reply to this topic.