Get more from Skype and Windows Live™ Messenger with Messenger Plus!

How to hide elements (Forced Hiding & Skin Options)

In this tutorial I'll show you how to hide elements from Messenger. In this example you will learn how to hide the search bar from the contact list, but the same methods can be used to hide most elements.

There are 2 ways of hiding elements: Forced Hiding and using *PlusSkin* Options. This tutorial covers both methods and provides additional information.

NOTE: Skins WILL NOT BE ACCEPTED on the forum or Official Skins Database if they force hide advertisements or have a visible option to hide the adverts from Messenger.

Index

• Creating a New Skin
• Starting to Skin
• Replacing Resources
• Editing Definitions - Forced Hiding
• *PlusSkin* Options Hiding
• Adding Options to the Options Window
• Editing Definitions for *PlusSkin* Options
• Creating a HideElement.reg

Creating a New Skin

• Firstly extract the resources of your current Messenger version, this can be done via Messenger Plus' own skinning section within it's preferences. Navigate to Customize -> Skinning, and press Extract Resources from the Skin Developers bar. This will present the extraction options window, extract to your chosen folder.

  Hint: Selecting Consolidate Windows will arrange all the extracted resources into a more understandable/organised way.

• Create a new folder in the Messenger Plus! Live skins directory (usually C:\Program Files\Messenger Plus! Live\Skins\). This will be where you place all the files related to your new skin. For now create a new folder with a name for your skin (eg. My Skin, Hide The Search Bar etc).

• Create a new file and call it SkinInfo.xml this is the file where you will define everything your skin needs to replace, add or refer to later on.

• Edit SkinInfo.xml to have a header like so:

  <SkinInfo>
    <Information>
      <Name>Hide The Search Bar</Name>
      <Version>1.00</Version>
      <Description>A Skin to hide the Search Bar in Messenger</Description>
      <AboutUrl>http://www.msgpluslive.net</AboutUrl>
      <Screenshot>
        <File>screenshot.png</File>
      </Screenshot>
      <Compatibility>
        <MsgVersion Major="8" Minor="0"/>
        <MsgVersion Major="8" Minor="1"/>
        <MsgVersion Major="8" Minor="5"/>
        <MsgVersion Major="9" Minor="0"/>
      </Compatibility>
    </Information>

  Note: The Compatibility section restricts what version of Messenger your skin will load on, so you can make a skin only for WLM8.5 if you want to, and not allow support and compatibility with WLM8.1, in the long run this helps avoid any issues your skin might pose to other versions of Messenger people may be using.

  If you do not know what version of Messenger you have, you can find out by opening Messenger and on the menu bar (File, Contacts, Actions etc) go to Help -> About Messenger, a window will be displayed that shows the version that you are running. Eg Version 8.1.0178 would translate to <MsgVersion Major="8" Minor="1"/>.

Starting to Skin

• You need to tell SkinInfo.xml what to replace, so after </Information> you will need code similar to the example below:

    <MessengerSkin>
      <ResGroup>
        <Restrictions>
          <MsgVersions>
            <Version Major="8" Minor="5"/>
            <Version Major="9" Minor="0"/>
          </MsgVersions>
        </Restrictions>

  Everything inside the...
  <MessengerSkin> tag is part of what will be skinned
  <ResGroup> tag can be used to separate sections, for instance a resgroup for replacing items only in 8.0 and another for 8.1 and so on.
  <Restrictions> tag can be used to restrict a Resgroup to only alter WLM 8.0 and 8.5, or only 8.5 etc (Essential for compatibility between different WLM Versions).

  This tells the Group what to do basically.

Replacing Resources

• After Restrictions Add <Resources><Replace>:

    <MessengerSkin>
      <ResGroup>
        <Restrictions>
          <MsgVersions>
            <Version Major="8" Minor="5"/>
          </MsgVersions>
        </Restrictions>
        <Resources>
          <Replace>

  Everything inside <Replace> gets (Guess what?) Replaced! :D. So you'll want to add a code like this:

        <Resources>
          <Replace>
            <Windows>
              <Definitions>
                <Definition Id="923"><File>923 Definition.txt</File></Definition>
              </Definitions>
            </Windows>
          </Replace>
        </Resources>

  This is telling plus to replace the Window Definitions of Messenger with modified ones (there are other tags such as <styles> and <strings> but these are not needed for these modifications).

• 923 is the Contact List Window which we will be editing later on. Copy this definition from your earlier extracted resources into your skin directory, if you haven't already, as now it's time to get editing!

  Hint: If you plan on creating a skin that modifies lots of files, you may want to organize them into folders, this may help you to keep things organized.

Editing Definitions - Forced Hiding

• Open up your skin directory's copy of 923 Definition.txt in the editor of your choice.

• Press Ctrl+F to bring up the search box, search for idSearchContainer. It should bring you to some lines that say:

  <Element layoutpos=bottom padding=rect(8,0,8,8) layout=filllayout() 
  ID=Atom(ai217)>
  <element id=atom(idSearchContainer) layout=filllayout() padding=rect(4,0,4,4)>

  Notice that in the line above there is a layoutpos=bottom specified, to hide the Search Bar you want to edit this attribute.

• To force hide the Search Bar change layoutpos=bottom to layoutpos=none. This will hide the Search Bar from the contact list.

  This method is the same for most Elements you may want to force hide. If an element that you want to hide does not have a layoutpos to modify, you can add one, it may work depending on the element. Give it a go.

• Save all files, apply the skin via Plus' Preferences and restart messenger the Search Bar Element should now be gone :).

  Hint: Sometimes Element ID's change between messenger versions, so it's best to check before you edit anything, that you are editing the correct line.

*PlusSkin* Options Hiding

I highly recommend that you use this feature instead of force modifying anything! Using Plus' Advanced Options you can let users decide what features they want or don't want in their messenger.

The options are enabled via the registry so a .reg file could be included with your skin to activate any options that you are otherwise not allowed to display in the options window for your skin.

Putting <!--Comments Tags--> around an option will also not allow it load in your skins Options Window. Unless the tags are removed or the option is enabled via the registry.

The <!-- defines the beginning of a commented section the --> defines it's end, items between will not be loaded.

Comment Tags can also be used for organization purposes, so you can easily distinguish a particular code segment's purpose or for disabling a particular piece of code that you perhaps are still working on and do not want loaded at the moment.

So, on with the show...

Adding Options to the Options Window

Messenger Plus will automatically generate an options box when you define your options in SkinInfo.xml so here's how to add options.

• Open up SkinInfo.xml and between </Information> and <MessengerSkin> add the following:

    </Information>
    <Options>
      <Skin>
        <Properties>
          <BoolVal Name="RemSearchBar">
            <DispLabel>Remove The Seach Bar (Contact list)</DispLabel>
            <Default>false</Default>
          </BoolVal>
        </Properties>
      </Skin>
    </Options>
    <MessengerSkin>

  This will then generate a check box option that will enable/disable the registry setting for RemSearchBar.

  As I'm sure you'll notice, there are attributes in use:
  One defines the "Name" of the option, this will be what registry item is affected by the check box state.
  The other is the description that is displayed alongside the check box in the Options Window.

So now we've told Plus what to modify in registry, we need to actually create the code for RemSearchBar to work.

Editing Definitions for *PlusSkin* Options

• Open up your skin directory's copy of 923 Definition.txt in the editor of your choice.

• Press Ctrl+F to bring up the search box, search for idSearchContainer, it should bring you to some lines that say:

  <Element layoutpos=bottom padding=rect(8,0,8,8) layout=filllayout() 
  ID=Atom(ai217)>
  <element id=atom(idSearchContainer) layout=filllayout() padding=rect(4,0,4,4)>

• To add a *PlusSkin* option to allow you to hide the Search Bar change layoutpos=bottom to <*PlusSkin Conditions(RemSearchBar = false)*>layoutpos=bottom</*PlusSkin*> <*PlusSkin Conditions(RemSearchBar = true)*>layoutpos=none</*PlusSkin*>.

  Here we've defined a true and false statement for the *PlusSkin* option to follow:
  If the option is turned off (false) then layoutpos=bottom.
  If the option is turned on (true) then layoutpos=none.

  So this will hide the Search Bar if the option is true, if not it will leave it alone. RemSearchBar is the name I decided to give this option, notice it matches the same in the SkinInfo.xml, this is so the option in SkinInfo.xml affects the code we just written.

  Hint: You can alter several elements with one option just use the same "Name" this could be useful for having an option to centre align all toolbars at once, or hide multiple elements all at once.

This method is the same for most Elements you may want to hide with the *PlusSkin* command.

And now you're done Editing the Definitions!!!

Note: If you did not <!-- comment out --> the options in SkinInfo.xml then Plus will automatically generate an options window that can be accessed by the preferences->Customize->Skins "Skin Options" button or the plus button on the Contact List -> Messenger Skin - >Skin's Options.

Creating a HideElement.reg

So You've decided to release your skin publicly via these Forums or the Skins Database, GREAT! Your skin has the potential to be used by Millions of Messenger Plus Users! :D

But you want users to be able to hide certain elements that you're restricted on adding an option for have no fear, I can help you do this one too!

We're going to to create a HideElement.reg file:

• In the Skin Directory create a new file call it HideElement.reg.

• Right Click the file and choose Edit it should open in notepad.

• Add this code to the file:

  ; Purpose: Enables a PlusSkin option via the registry.
  ; Created by aNILEator, 2007-12-06.
  [HKEY_CURRENT_USER\Software\Patchou\Messenger Plus! Live\GlobalSettings\Skins
  \Hide The Search Bar\Settings]
  "RemSearchBar"=dword:00000001

  Where Hide The Search Bar is the name of your skin as you set in SkinInfo.xml.

• Save and exit.

• Now if you run/merge HideElement.reg it should enable the RemSearchBar functions you defined as a *PlusSkin* option.

  Hint: You can define more values to be adjust by creating a new line for each item, like so:

  [HKEY_CURRENT_USER\Software\Patchou\Messenger Plus! Live\GlobalSettings
  \Skins\Hide The Search Bar\Settings]
  "RemSearchBar"=dword:00000001
  "RemOtherItem"=dword:00000001
  "RemAnotherItem"=dword:00000001

• Now you can zip up the contents of your skin directory. Rename it from SkinNameHere.zip to SkinNameHere.plsk and submit it to the Skins Database or upload here on the forums!

And that's the end of this How To you should have learnt a lot in an easy to follow format (that's what I hope anyway).

If this has been of particular help to you please take the time to thank me for taking over 6 hours to type it out (and another 3 hours+ editing it all over again) all for free (:O I'm crazy).

Thank You,
Nile