Note: The highlighted part (#eeeeee) is the default background color of tables. You might wanna replace them depending on your customized background color (eg, #fff or transparent, etc..).

Another note: Icons in Reviews usually show how many stars you gave that particular review. By using these codes, you are replacing all those stars. Be it 1, 2, 3, 4, or 5...

Last note: Use an image which dimensions are close to 24 x 24.


Screenshots: (Click for larger view)

 



I'm sure y'all thinking, "Who would wanna do that?"

Well, I just thought I should share this.. lol

Replace the boring or or   or or  icon in your Blog | Music | Video | Calendar | Notes page (table view) with any image you like.

Just add this to the description of your post:

<span class="insertedphoto"><img width="0" src="URL OF YOUR IMAGE"></span>

Replace only the highlighted portion..

Note: Use an image that has proportional width and height, preferrably a small one (so it loads faster). For example an image with a dimension of 50 x 50..

Notice I set the width to zero "0".
That will prevent the image from showing up from the actual post.

Demo: (Click for larger view)..


PS.. I thought I discovered the codes until I came across this. So Luiz deserves the credit for the codes..

The top header icons the letter,house and people icons


are hard coded in HTML even though I can make them disapear
by using this code
li.gnopt a img, li.gnoptsel a img { display: none; }
looks like this


I wanted differnt ones because I didn't want them plain, thing is its a bit tricky to replace them
I did it though

See I replaced them with donuts ..clever huh

A very small image can be placed there but and here is the trick part I didn't actually replace the images at all, the image is a background on the link its self so to get them in the right places I just adjusted the width a little and aligned the image left
li.gnopt, li.gnoptsel {
background: url(http://tinyurl.com/6x9ktg)no-repeat top left;width:75px;}
That is why one or two of them are a little "off" ..should have used a smaller image I think
worked though and a hover image can be used as well
Of course the entire link background could be  an image  but I liked this effect
a small image aligned left with the width adjusted will replace the top header icons

Well the slide show didn't seem to want to load so here
Rss Icons
Quote:
Visual Guidelines

The feed icon should be displayed in its entirety on either a solid light or dark background (avoid mid-tone or strongly colored backgrounds). The feed icon should not be displayed in parts or with other elements superimposed on top of the icon.

The feed icon should be displayed at a size that is both large enough to render it legible to its intended users and compatible with the size of any related text elements.

The feed icon may be displayed using the colors black and white in contexts where color reproduction is not possible. The feed icon may be used with the colors of the icon inverted (e.g., white used instead of orange and vice versa), as long as there is adequate contrast between the background and foreground colors.

When used as an element in a user interface (e.g., as a toolbar button) the feed icon should be displayed in a manner consistent with related UI elements and any applicable user interface standards (e.g., for the underlying operating system and/or window system).

The feed icon should not be displayed in modified forms inconsistent with the above guidelines or in ways that visually compromise the icon. In particular, the icon should not be displayed

* in a different orientation (i.e., rotated or flipped relative to the standard orientation)
* with the rounded square element of the icon replaced by a circle, triangle, or any shape other than that used on the original background
* with the corners of the rounded square element of the icon made sharp rather than rounded.

Note that the above guidelines regarding size and color are not intended to restrict the ways in which the feed icon might be represented by assistive technologies designed for use by people with impaired vision. (Such technologies include software to magnify the contents of the screen and/or change screen colors, contrast, and brightness; alternative stylesheets for web sites; and the like.)

Note also that these guidelines are not intended to discourage other uses of the feed icon that conform to the overall spirit of these guidelines. Such cases include using different colors for the icon where appropriate (e.g., in matching a site theme) or using the icon in combination with other icons of a compatible style and nature (e.g., to identify the type of feed being offered). However in the interests of providing a consistent experience for users we suggest that providers of feed readers and related goods and services make minimum use of such alternative representations of the icon.

Join this one, its a social network of web designers. You get ten tokens per month to spend on icons there. Don't take the first icons the icon masters give you. I will set you up. After you have been here they will give you freebies every month.