Ever wanted to add a small image to the left of your Module Header Titles, like Latest Activity, Blogs, Forums, Groups, Members, etc...?

Here's an example of a partial screen shot, below. See Michael Jackson's photo to the left of each Module Header Title (Latest Activity, Members, and Chat). Keep in mind, this can be too much. It adds the same image to all module headers. Be sure to choose a subtle image. Typically the best sizes are 26 by 26 pixels, and not larger than 32 by 32 pixels. You can upload your image via a Blog on your Ning Network. Use that image path for the CSS code below.


EXAMPLE OF SMALL IMAGE TO LEFT OF MODULE HEADER TITLES:

ADD IMAGE TO LEFT OF MODULE HEADER TITLE:

1. Upload your selected image via a blog, or know the path where your image is hosted.
2. Make sure your image is no larger than 32 by 32.
   
3. Copy/paste the image URL/path to the CSS line below. Replace "yourfull_image_path_goes_here", with your image path.
4. You may need to remove the line-height code.
5. Adjust your padding on the left to suit your image size.
6. Copy/paste the CSS to Advanced CSS via Manage/Appearance/Advanced CSS.
7. Save.
   

CSS CODE:

/* Add small image to left of your xg_module Header */
.xg_module_head {background-image:url(yourfull_image_path_goes_here);
    background-repeat:no-repeat;
    line-height:1em;
    margin-bottom:5px;
    padding-left:32px;
}
/* End Add small image to left of xg_module Header */

---

ADD FAVICON TO LEFT OF MODULE HEADER TITLE:

Here's a really nice trick if you already have a favicon. You can use the favicon as your image. Just change the favicon path to your Ning Network path.

1. Change the "your_network.ning.com" to your Ning Network name.
2. Adjust your padding on the left to suit your needs.
3. Copy/paste the CSS to Advanced CSS via Manage/Appearance/Advanced CSS.
4. Save.

CSS CODE:

.xg_module_head {background-image:url(http://your_network.ning.com/favicon.ico);
    background-repeat:no-repeat;
    line-height:1em;
    margin-bottom:5px;
    padding-left:18px; }

/* You may need to pull the title text up a small amount, with a tiny favicon */
.xg_module_head h2 {margin-top:-5px!important;}

Enjoy!
Jen