How do you do this?, Profile 2.0 Custom Links...i.e. Send Msg, etc. Options

[G30M3TRY]

I want my contact buttons to look exactly like this guy's.

[aQuafly]

you can try this, I'm just not sure that it's going to work

CODE

li.message { background-image:url('url_here');}
li.addToFriends { background-image:url('url_here');}
li.comment { background-image:url('url_here');}

Just fill in the 'url_here' with the direct link to the image you'd like each to be, I think from the labels you can see what part of the code changes what.

[Mickey]

You need to design an image with both the original images and the hover images on it like this. You also need to design an image to replace the title with like this. Then place this code in your CSS section:

CODE

div.basicInfoModule span.urlLink { position: relative; width: auto; margin: 26px 8px 0 -40px; }
div.basicInfoModule span.urlLink a
{display: block; text-indent: -10000em; background: url("URL") no-repeat -135px -1px; width: 30px; height: 31px; padding: 0; line-height: 1; text-align: left; }
div.basicInfoModule span.urlLink a:hover { background-position: -135px -31px; }
ul.contactLinks { background: url("URL") no-repeat; width: 174px; height: 43px; margin: -15px 0 17px; padding: 41px 0 0; }
ul.contactLinks li { float: left; }
ul.contactLinks li a { display: block; width: 40px; height: 30px; text-indent: -10000em; padding: 0; text-align: left; background: url(http://i41.tinypic.com/kyhwn.png) no-repeat; }
ul.contactLinks li.message { margin-left: 10px; }
ul.contactLinks li.addToFriends { margin-left: 0px; }
ul.contactLinks li.comment { margin-left: 0px; }
ul.contactLinks li.message a { background-position: 1px 0; }
ul.contactLinks li.addToFriends a { background-position: -37px -1px; }
ul.contactLinks li.comment a { background-position: -82px -1px; }
ul.contactLinks li.message a:hover { background-position: 1px -30px; }
ul.contactLinks li.addToFriends a:hover { background-position: -38px -31px; }
ul.contactLinks li.comment a:hover { background-position: -82px -31px; }

Replace the first "URL" with the url of the image for the contact icons. Replace the second "URL" with the url of the image for the title. If your image isn't positioned quite like the one that user is using, you need to play around with the positioning of the background so you can choose which section of that background you want to show. It should be easy enough to understand once you experiment with the different values of the link and hover properties of each contact button.

[Jghelfi]

the way it is generated is almost like this one..
[http://www.createblog.com/layouts/code.php?id=32845]

which is very creative..

[G30M3TRY]

Wow, thanks a lot guys. I did it. :)

[Mickey]

Cool. Topic closed & moved.