Yahoo! Messenger "Pink" Skin .xml file and version 8+

Yahoo! Messenger Skins
At the time of doing this article an awful lot of work needs to be done to make Yahoo's additional skins (Celadon, Bronze, Pink, Gray / Orange) compatible with Yahoo! Messenger v8 and considering v8 was released (in beta) on 21 June 06 and it's now May 07 it doesn't look like the issue will be addressed any time soon... but fingers crossed it will be at some stage :)

There are a lot of quirks with the Yahoo! skins, the range from minor to major, in both time to correct, and how it impacts on the look and feel of Yahoo! Messenger itself. Personally I don't feel it's worth the time, effort and frustration involved to manually correct all the issues yourself but some of the changes are relatively simply to do and will make a big difference.

The Plugin buttons
Perhaps the most noticeable issue with the downloadable skins is the missing Plugins button on the IM window toolbar. If this quirk also annoys you then there is a super quick and easy fix which will correct the issue.
Head to your default Indigo v8 skin
C:\Program Files\Yahoo!\Shared\Graphics\Indigo
copy (not cut) the following .bmp files:
icons_tbar_disabled.bmp
icons_tbar_hot.bmp
icons_tbar_normal.bmp
now head to
C:\Program Files\Yahoo!\Shared\Graphics\Pink
and paste to the directory overwriting the exiting ones. If you already have the Pink skin selected you will need to select another skin from the list, apply, then reselect Pink, then apply for the changes to be visible.

Calling Icon
When you start to look at the other quirks, like the call button, then you might as well throw yourself in the deep end of a rather large coffee pot.

To correct this issue you need to get the missing .bmp file (triangletray.bmp) and also make an addition:
<imgfile src="triangletray.bmp" border="5" width="88" height="44" transcolor="ff00ff">
<img name="voice_triangletray_normal" width="22"/>
<img name="voice_triangletray_hover" xoff="22" width="22"/>
<img name="voice_triangletray_press" xoff="44" width="22"/>
<img name="voice_triangletray_disabled" xoff="66" width="22"/>
</imgfile>
to the pink.xml file (located at C:\Program Files\Yahoo!\Shared\Graphics\Pink\pink.xml).

Grabbie
While you're already editing your .xml file you might consider correcting the "grabbie" issue at the same time. In v6 through v7.5 our grabbie image, which sits at the base of the main IM window (directly below your friends list) was a .bmp file that consisted of 3 dots, this allowed us to mouse over "grabbie", then click and drag to alter the space allocation of our friends list, or tab selection. Grabbie is visible and fully functional in v7.5 (and below), even with the Yahoo! Skins (in this case Pink) applied, but with v8 grabbie changed from a .bmp file, to a .png and the image itself changed also.

grabbie.bmp	grabbie.png

With the default v8 skin (Indigo) you can clearly see grabbie (two centered gray lines) happily in place, but if you apply "Pink" or any of the other Yahoo! downloadable skins things go astray. Grabbie itself is still funtional but you have to apply a bit of guess work when it comes to working out exactly what to grab as the image is not visible.

In the pink.xml file you will notice that grabbie is referenced:
<imgfile src="grabbie" transcolor="ff00ff">
<img name="grabbie" width="36" height="8" />
</imgfile>
and grabbie.bmp is also included as a graphic, along with grabbie.png but to get this working in v8 you need to add the following to your pink.xml file for it show up.
<imgfile src="grabbie.png">
<img name="grabbie" border="0" width="66" height="4"/>
</imgfile>

In the Deep end
At the bottom your friends list you may also notice that there are no clearly defined buttons for your Plugins, the text is there but there is no surrounds for them...

If you are going to venture into the territory required to correct this you might as well throw yourself right into the deep end as you need to do a fair bit of copying and updating of the .xml file which is a pretty thankless task, but if you feel inclined then knock yourself out ;)

Detailed below is the information (in part) from the current available pink.xml file that will help you correct the button problem, and others that haven't been mention, you will also see that the settings for colours, fonts, sizes etc have also been highlighted, just in case you wish to make further changes while you are at it :)

Unless you are looking to discover where it all went wrong and why, my recommendation would be scrapping the text from (and including):
<imgfile src="border_top" width="97" height="28" left="48" right="23" transcolor="ff00ff">
<img name="frame_top" />
<img name="frame_top_d" yoff="28" />
</imgfile>
through to the end of the pink.xml file and then replacing it with the data from indigo.xml, then just copy and paste the missing .bmp and .png files (detailed in the table below) and copying them across to your Pink directory.

If you download and install the current Yahoo! Pink Skin you can locate all the files and graphics at
C:\Program Files\Yahoo!\Shared\Graphics\Pink
your .xml file is at
C:\Program Files\Yahoo!\Shared\Graphics\Pink\pink.xml
you will also need to access (for copying) your default version 8 graphics, you can find these at
C:\Program Files\Yahoo!\Shared\Graphics\Indigo

skinname="Pink"
previewimage="preview_pink.jpg"

<color name="back" value="f5eae5"/>
<color name="frame_h" value="ffffff"/> (white)
<color name="frame_shadow" value="d3a8b7"/>
<color name="text" value="0"/>
<color name="groupbox_border" value="0xb3b6b0"/>
<color name="groupbox" value="f5eae5"/>(off white)
<color name="button_h" value="0x001d71"/>
<color name="button_dh" value="ffffff"/>(white)
<color name="button_ds" value="d3a8b7"/>
<color name="button" value="48585f"/>
<color name="menuitem_b" value="d3a8b7"/>
<color name="menuitem" value="0"/>
<color name="menuitem_h" value="ffffff"/> (white)
<color name="menuitem_d" value="c07e9b"/>
<color name="menuitem_dh" value="d3a8b7"/>
<color name="menubar" value="000000"/>
<color name="menubar_h" value="000000"/>
<color name="menubar_p" value="000000"/>
<color name="statusbar" value="0"/>
<color name="tab" value="48585f"/>
<color name="tab_h" value="0x001d71"/>
<color name="tab_p" value="0x001d71"/>
<color name="toolbar_h" value="0x001d71"/>
<color name="toolbar_ds" value="d3a8b7"/>
<color name="toolbar_dh" value="ffffff"/> (white)
<color name="toolbar" value="48585f"/>
<color name="toolbar_border" value="f5eae5"/> (off white)
<color name="header" value="0"/>
<color name="header_h" value="001d71"/>
<color name="header_ph" value="ffffff"/> (white)
<color name="header_dh" value="ffffff"/> (white)
<color name="header_ds" value="d3a8b7"/>
<color name="control_hb" value="f5eae5"/> (off white)
<color name="control_ht" value="000000"/>
<color name="control_fb" value="b3b6b0"/>
<color name="control_ft" value="ffffff"/> (white)
<color name="control_nb" value="ffffff"/> (white)
<color name="control_nt" value=""/>
<color name="control_db" value="ffffff"/> (white)
<color name="control_dt" value="666666"/>
<font name="caption" face="tahoma" height="8" weight="700" quality="c" textcolor="ffffff"/> (white)
<font name="caption_inactive" face="tahoma" height="8" weight="700" quality="c" textcolor="c07e9b"/>
<font name="caption_s" face="tahoma" height="7" weight="300" textcolor="ffffff"/> (white)
<font name="caption_inactive_s" face="tahoma" height="7" weight="300" textcolor="c07e9b"/>
<font name="caption_t" face="tahoma" height="7" weight="700" textcolor="ffffff"/> (white)
<font name="caption_inactive_t" face="tahoma" height="7" weight="700" textcolor="c07e9b"/>
<font name="groupbox_header" face="tahoma" height="8" weight="300" textcolor="0"/>
<font name="menubar" face="tahoma" height="8" weight="400"/>
<font name="menubar_h" face="tahoma" height="8" weight="400"/>
<font name="menubar_p" face="tahoma" height="8" weight="400"/>
<font name="menuitem" face="tahoma" height="8" weight="400" textcolor="0"/>
<font name="menuitem_d" face="tahoma" height="8" weight="400" textcolor="666666" edgeeffect="disabled" edgecolor="ffffff"/>
<font name="statusbar" face="tahoma" height="8" weight="400"/>

*** NOTE: references showng below are not included in .xml file, following instructions to for v8 compatibility***
directy below <color name="control_dt" value="666666"/>
add the following:
<color name="billing_bkgnd" value="FFFFCC"/>
<color name="dnd_bkgnd" value="FFFFCC"/>
<color name="slot-caption-border" value="9a90cf"/>
<color name="slot-caption-divider" value="b8b1e2"/>
<color name="slot-border-gap" value="ececef"/>
<color name="slot-caption-font-color" value="47368e"/>
<color name="slot-caption-shadow-font-color" value="fbfbf9"/>

*** All the below needs to be added to graphics folder and .xml file to make Yahoo's Pink Skin compatible with Yahoo! Messenger v8 ***

dialbtn_pad.bmp
<imgfile src="dialbtn_pad.bmp" border="5" width="96" height="24" transcolor="ff00ff">
<img name="voice_dialbtn_pad_normal" width="24"/>
<img name="voice_dialbtn_pad_hover" xoff="24" width="24"/>
<img name="voice_dialbtn_pad_press" xoff="48" width="24"/>
<img name="voice_dialbtn_pad_disable" xoff="72" width="24"/>
</imgfile>

donotdisturb.bmp
<imgfile src="donotdisturb" width="16" height="16" transcolor="ff00ff">
<img name="donotdisturb"/>
</imgfile>

headerbg.png
<imgfile src="headerbg.png" border="0" width="5" height="31" >
<img name="slot-border_nw" xoff="0"/>
<img name="slot-border_n" xoff="5"/>
<img name="slot-border_ne" xoff="10"/>
</imgfile>
<imgfile src="headerbg.png" border="0" width="5" height="24" >
<img name="slot-border-btn-bkgnd" xoff="5" yoff="4"/>
</imgfile>

itabs.bmp

<imgfile src="itabs" height="30" width="41">
<img name="itab_first_on" xoff="0" width="50" left="16" right="11"/>
<img name="itab_first_partial" xoff="51" width="50" left="15" right="10"/>
<img name="itab_first_off" xoff="102" width="50" left="15" right="10"/>
<img name="itab_mid_on" xoff="153" left="7" right="11"/>
<img name="itab_mid_partial" xoff="195" left="5" right="11"/>
<img name="itab_mid_off" xoff="237" left="5" right="11"/>
<img name="itab_last_on" xoff="279" left="6" right="11"/>
<img name="itab_last_off" xoff="321" left="5" right="11"/>
<img name="itab_fill" xoff="363" width="8"/>
<img name="itab_single_on" xoff="373" width="50" left="16" right="11"/>
<img name="itab_single_off" xoff="424" width="50" left="16" right="11"/>
</imgfile>

pab_abook_off.bmp
<imgfile src="pab_abook_off.bmp" border="5" width="128" height="27" transcolor="ff00ff">
<img name="clickie_addressbook_normal" width="32" />
<img name="clickie_addressbook_hover" width="32" xoff="32"/>
<img name="clickie_addressbook_pressed" width="32" xoff="64"/>
<img name="clickie_addressbook_disabled" width="32" xoff="96"/>
</imgfile>

pab_abook_on.bmp
<imgfile src="pab_abook_on.bmp" border="5" width="128" height="27" transcolor="ff00ff">
<img name="clickie_addressbook_selected_normal" width="32"/>
<img name="clickie_addressbook_selected_hover" width="32" xoff="32"/>
<img name="clickie_addressbook_selected_pressed" width="32" xoff="64"/>
<img name="clickie_addressbook_selected_disabled" width="32" xoff="96"/>
</imgfile>

pab_add1.bmp
<imgfile src="pab_add1.bmp" border="5" width="172" height="27" transcolor="ff00ff">
<img name="clickie_addcontact_normal" width="43"/>
<img name="clickie_addcontact_hover" width="43" xoff="43"/>
<img name="clickie_addcontact_pressed" width="43" xoff="86"/>
<img name="clickie_addcontact_disabled" width="43" xoff="129"/>
</imgfile>

pab_mlist1_off.bmp
<imgfile src="pab_mlist1_off.bmp" border="5" width="136" height="27" transcolor="ff00ff">
<img name="clickie_friendlist_normal" width="34" />
<img name="clickie_friendlist_hover" width="34" xoff="34"/>
<img name="clickie_friendlist_pressed" width="34" xoff="68"/>
<img name="clickie_friendlist_disabled" width="34" xoff="102"/>
</imgfile>

pab_mlist1_on.bmp
<imgfile src="pab_mlist1_on.bmp" border="5" width="136" height="27" transcolor="ff00ff">
<img name="clickie_friendlist_selected_normal" width="34" />
<img name="clickie_friendlist_selected_hover" width="34" xoff="34"/>
<img name="clickie_friendlist_selected_pressed" width="34" xoff="68"/>
<img name="clickie_friendlist_selected_disabled" width="34" xoff="102"/>
</imgfile>

silver_bg.bmp
<imgfile src="silver_bg" border="5" width="20" height="22">
<img name="silver_bg"/>
</imgfile>

slot_empty_bg.png
<imgfile src="slot_empty_bg.png" border="0" width="7" height="7">
<img name="slot-empty-bg" xoff="0"/>
</imgfile>

slotborder.png
<imgfile src="slotborder.png" border="0" width="5" height="6" transcolor="ff00ff">
<img name="slot-border_sw" xoff="0"/>
<img name="slot-border_s" xoff="5"/>
<img name="slot-border_se" xoff="10"/>
</imgfile>

slotborder_we.png
<imgfile src="slotborder_we.png" border="0" width="5" height="1" transcolor="ff00ff">
<img name="slot-border_w" xoff="0"/>
<img name="slot-border_e" xoff="5"/>
</imgfile>

subhdrbg.png
<imgfile src="subhdrbg.png" border="0" width="20" height="20">
<img name="slot-caption_w" xoff="0"/>
<img name="slot-caption_mid" xoff="20"/>
<img name="slot-caption_e" xoff="40"/>
<img name="slot-caption-detach" xoff="20"/>
<img name="slot-caption-close" xoff="40"/>
</imgfile>

subhdrbg_hover.png
<imgfile src="subhdrbg_hover.png" border="0" width="20" height="20">
<img name="slot-caption_hover_w" xoff="0"/>
<img name="slot-caption_hover_mid" xoff="20"/>
<img name="slot-caption_hover_e" xoff="40"/>
<img name="slot-caption-detach_hover" xoff="20"/>
<img name="slot-caption-close_hover" xoff="40"/>
</imgfile>

subhdrbg_cls.png
<imgfile src="subhdrbg_hover.png" border="0" width="20" height="20">
<img name="slot-caption_hover_w" xoff="0"/>
<img name="slot-caption_hover_mid" xoff="20"/>
<img name="slot-caption_hover_e" xoff="40"/>
<img name="slot-caption-detach_hover" xoff="20"/>
<img name="slot-caption-close_hover" xoff="40"/>
</imgfile>

subhdrbg_cls_hover.png
<imgfile src="subhdrbg_cls_hover.png" border="0" width="20" height="20">
<img name="slot-caption_min_hover_w" xoff="0"/>
<img name="slot-caption_min_hover_mid" xoff="20"/>
<img name="slot-caption_min_hover_e" xoff="40"/>
<img name="slot-caption-detach_min_hover" xoff="20"/>
<img name="slot-caption-close_min_hover" xoff="40"/>
</imgfile>

title.png
<imgfile src="title.png" border="0" width="7" height="21" transcolor="ff00ff">
<img name="title_w" xoff="0"/>
<img name="title_mid" xoff="7"/>
<img name="title_e" xoff="14"/>
</imgfile>

title_down.png
<imgfile src="title_down.png" border="0" width="7" height="21" transcolor="ff00ff">
<img name="title_down_w" xoff="0"/>
<img name="title_down_mid" xoff="7"/>
<img name="title_down_e" xoff="14"/>
</imgfile>

title_hover.png
<imgfile src="title_hover.png" border="0" width="7" height="21" transcolor="ff00ff">
<img name="title_hover_w" xoff="0"/>
<img name="title_hover_mid" xoff="7"/>
<img name="title_hover_e" xoff="14"/>
</imgfile>

title_up.png
<imgfile src="title_up.png" border="0" width="7" height="21" transcolor="ff00ff">
<img name="title_up_w" xoff="0"/>
<img name="title_up_mid" xoff="7"/>
<img name="title_up_e" xoff="14"/>
</imgfile>

triangletray.bmp
<imgfile src="triangletray.bmp" border="5" width="88" height="44" transcolor="ff00ff">
<img name="voice_triangletray_normal" width="22"/>
<img name="voice_triangletray_hover" xoff="22" width="22"/>
<img name="voice_triangletray_press" xoff="44" width="22"/>
<img name="voice_triangletray_disabled" xoff="66" width="22"/>
</imgfile>

typedown.bmp
<imgfile src="typedown.bmp" border="6" width="60" height="30" transcolor="ff00ff">
<img name="typedown_normal_left" width="6"/>
<img name="typedown_normal_middle" xoff="6" width="48"/>
<img name="typedown_normal_right" xoff="54" width="6"/>
<img name="typedown_hover_left" yoff="30" width="6"/>
<img name="typedown_hover_middle" yoff="30" xoff="6" width="48"/>
<img name="typedown_hover_right" yoff="30" xoff="54" width="6"/>
<img name="typedown_focused_left" yoff="60" width="6"/>
<img name="typedown_focused_middle" yoff="60" xoff="6" width="48"/>
<img name="typedown_focused_right" yoff="60" xoff="54" width="6"/>
</imgfile>

voice_tbar_hold.bmp
<imgfile src="voice_tbar_hold.bmp" border="5" width="64" height="44">
<img name="voice_toolbar_hold" />
<img name="voice_toolbar_middle_hold" xoff="16" width="32"/>
<img name="voice_toolbar_left_cap_hold" width="16" />
<img name="voice_toolbar_right_cap_hold" xoff="42" width="22" />
<img name="voice_toolbar_left_cap_call_button_hold" xoff="2" yoff="6" width="32" height="32" />
</imgfile>

voice_dialpad_0.png through to voice_dialpad_11.png
<imgfile src="voice_dialpad_0.png" border="0" width="44" height="32" transcolor="ff00ff">
<img name="normal_voice_dialpad_0"/>
<img name="hover_voice_dialpad_0" xoff="44"/>
<img name="press_voice_dialpad_0" xoff="88"/>
<img name="disabled_voice_dialpad_0" xoff="132"/>
</imgfile>

remove:
<imgfile src="grabbie" transcolor="ff00ff">
<img name="grabbie" width="36" height="8" />
</imgfile>
replace with:
<imgfile src="grabbie.png">
<img name="grabbie" border="0" width="66" height="4"/>
</imgfile>