How to put a background-image into right sidebar with 'categories'

  • Maciej

    #7791

    Howdy

    Any help, how to change this (marked with red circle)

    ff5u1i.png

    and instead of black (or whatever other colour) put there image ?

    Prasanna SP

    #39384

    Add this to Custom CSS,

    .sidebar h3 {
    background: url("http://example.com/image.png");
    }

    Replace URL with correct path of your image.

    Maciej

    #39385

    Unlucky its not working πŸ™

    i have tried to resolve it by changing graphene’s style.css

    Quote:
    .sidebar h3 {

    background: url(images/jelly.jpg)

    left bottom repeat-x #3C9CD2;

    background: -moz-linear-gradient(#3C9CD2, #1F6EB6);

    background: -webkit-linear-gradient(#3C9CD2, #1F6EB6);

    background: -o-linear-gradient(#3C9CD2, #1F6EB6);

    -ms-filter: “progid:DXImageTransform.Microsoft.gradient(startColorStr=’#3C9CD2′, EndColorStr=’#1F6EB6′)”;

    background: linear-gradient(#3C9CD2, #1F6EB6);

    border-bottom: 1px solid #195392;

    -moz-border-radius: 5px 5px 0 0;

    -webkit-border-radius: 5px 5px 0 0;

    border-radius: 5px 5px 0 0;

    color: #fff;

    *display: inline;

    font: 18px/20px “Pontano Sans”, arial, sans-serif;

    margin: -15px 0 5px -12px;

    padding: 7px 12px;

    text-shadow: 0 -1px 0 #333;

    width: 100%;

    zoom: 1;

    }

    but still no effect (that link looks like now cuz i’m workin on ‘localhost’ xampp, before i change it it was : background: url(images/bg-sidebar-h3.png) left bottom repeat-x #3C9CD2; )

    so clearly i have changed just link to this image, and put ‘jelly.jpg’ into folder where bg-sidebar-h3.png was

    Admin

    Syahir Hakim

    #39386

    Don’t edit the theme’s files, even the style.css file. Instead, copy and paste the code Prasanna gave you either to the theme’s Custom CSS option or to your own child theme’s style.css file.

    Maciej

    #39387

    its not a solution

    Of course im using child theme, but code which Prasanna gave me dont work. So i wanted to check if the original graphene code edit will handle it

    but still no effect

    Prasanna SP

    #39388

    Try

    .sidebar h3 {
    background: url("http://example.com/image.png") !important;
    }

    Maciej

    #39389

    that works

    thanks πŸ™‚

    Maciej

    #39390

    Ok, one more thing

    I have 2 categories, and all i want is to put different background for each of them. How to do it ?

    now it looks like : http://www.soople.pl

    The same bg for ‘newsy’ and ‘artykuly’. I want different bg for each of them πŸ˜‰

    Prasanna SP

    #39391

    Each widget (div) has an unique ID. For, artykuΓ…β€šy it’s text-8. So, you can change its h3 background like this,

    #text-8 h3 {
    background: url("http://example.com/image.png") !important;
    }

    Use firebug Firefox extension to find widget IDs. There are handful of tutorials about using firebug in the net.

    Maciej

    #39392

    Cheers mate. Yep i’m currently using firebug πŸ™‚

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.