fm2018 skinning [FM18][GUIDE] Skinning Guide Part 2 - The Basics

[michaeltmurrayuk]

Football Manager 2018 Skinning Guide Part 2 - The Basics

 

This is a quick update of FM2015 version, though nothing has changed so if you've read that one you already know what to do, I've just cleaned this up for FM18.


Before You Start - Programs You Will Need

Before you start doing any skinning you need to ensure you have a few tools available.

- A fully up-to-date version of Football Manager 2018 (Or the version of FM you are making the skin for, this guide is good for any version from FM15 onwards including Touch Mode Skins).

- A Text Editor - For FM18 I'd recommend Wordpad over Notepad as Notepad doesn't seem to be reading the formatting of FM18's files. However if you are doing a fair bit of skinning I'd recommend using a program such as Notepad++ as it colours the code and includes line numbers which makes it a lot easier to edit the larger or more complicated xml files.

- Graphics Software - You need a program that supports transparent png file, if you already have graphics software you are familiar with and it supports transparent png files then I'd recommend you use that program. If you don't have any graphics software then Paint.net is a free upgraded version of MS Paint that is easy enough to use and should be good enough, a more feature rich alternative is The GIMP which is an open source alternative to Photoshop but not all that user friendly. You can also use Adobe Photoshop which is used by the professionals however it is expensive and not really needed unless you are making fancy graphics, if you do need to use Photoshop you can generally get a free 30 day trial from adobe's site and not sure if it's still available but they made Photoshop CS2 free to download several years ago and that should still have all the features you need.

This and future guides will assume you are using Notepad++ to edit the xml files and where possible paint.net to edit the graphics. If you are using a MAC or Linux then you'll need to source your own programs as I don't use those platforms.

The other thing you should already have done is extracted the default game files, if you haven't already done this then go back and read Part One of the guide.


Creating Your First Skin

In this guide we are going to create a simple skin called 'BBC Skin' for the full mode of FM18 based upon the default Light FM2018 Skin.

First thing you need to do is to have two folder locations open; your 'Working' folder which is where you extracted the game files to and the skins folder located inside your User Data Location (which by default is \Documents\Sports Interactive\Football Manager 2018).

From your 'Working' folder go into the skins subfolder and locate the folder called 'fm light' now copy this folder to the skins folder within your User Data Location.

Now the first bit of skinning we are going to do is to rename the copied over 'fm light' folder to the name of your skin, so in this case we will name it 'bbc_skin'. (NOTE: when naming the skins' folder keep the name simple and avoid caps, spaces and special characters to save any problems later).

Next open the 'bbc_skin' folder and you should have an xml file called 'skin_config'. Open this file in your xml editor and in the middle of that file you will see a block of code that looks like this (the rest of the code in that file you can just ignore but don't delete it).:

<!-- skin details - most of these are intentionally not translated -->
<translation id="name" translation_id="424592" type="use" value="Football Manager Light[COMMENT: skin name]" />
<string id="author" value="Sports Interactive" />
<translation id="description" translation_id="420802" type="use" value="Dark text on a light background[COMMENT: skin description]" />
<string id="version" value="1.0" />
<flags id="parent" value="fm light-widgets" />
<string id="skin_name" value="fm light" />

The first line is a comment line, whenever you see any code in an xml file that is inbetween <!-- and --> it is a comment and isn't read by the game, comment code is mainly used to explain to the user what various bits of code does. Also if you are using Notepad++ comment code will be green so you can easily tell it apart from active code.

<translation id="name" translation_id="424592" type="use" value="Football Manager Light[COMMENT: skin name]" />

This line determines what name shows for your skin on the skin drop down menu in game, note that this name doesn't need to match the name used for the folder, in this case we will be calling our skin 'BBC Skin' so we'd change the value bit to reflect this. The other thing you need to do is reformat that line a little bit to remove the translation stuff otherwise your name won't update in game, so change that line to read:

<string id="name" value="BBC Skin" />

On the next line you can change the author value to the name that you wanted to be credited as as the creator of the skin. The line after that is where you can put a short description of your skin and again you'll need to reformat that to remove the translation text for example this is what I have changed it to read:

<string id="description" value="Light Skin based on the BBC Sport Website and Match of the Day schemes" />

Next up is the version number line, you don't really need to change this but I'd recommend updating it as you release updated versions of your skin as it's an easy way for people to check they have the latest version of your skin.

Next is the parent skin line and as explained in the extracting files guide this value tells the game where to look next for the files it needs, for the most part you shouldn't need to adjust this value as you should base your skin off the default skin that most matches the colouring you want, so if you wanted a dark skin you'd have copied over the fm dark skin instead of changing this value to point to the dark skin.

The final line is the skin_name one and is the most important line as it tells the game where to locate the files for your skin and the text in the value bit needs to exactly match the name of the folder for your skin, so in this example we'd change 'fm light' to read 'bbc_skin';

<string id="skin_name" value="bbc_skin" />

And with that done the starting code should now look like this:

<!-- skin details - most of these are intentionally not translated -->
<string id="name" value="BBC Skin" />
<string id="author" value="michaeltmurrayuk" />
<string id="description" value="Light Skin based on the BBC Sport Website and Match of the Day schemes" />
<string id="version" value="1.0" />
<flags id="parent" value="fm light-widgets" />
<string id="skin_name" value="bbc_skin" />

NOTE: The skin_name value must match the folder name not the name value set in this file.

Now save the file, load up FM18 and go into the Preferences Menu and from the Skin drop-down menu you should now have a new option called 'BBC Skin':



If it doesn't appear in the list then from the Preferences -> Interface menu untick 'Use caching to decrease page loading times' and tick 'Reload skin when confirming changes in Preference'. Now confirm your changes and go back to the Preferences menu and your skin should now be listed.

Now select your skin and click confirm and there you go you have just created your first skin, albeit one that is identical to the default light skin but it's a start

---
Redistribution Terms
You are free to post this content to your website provided:
1. It is not sold or behind a paywall.
2. You don't advertise it as being exclusive to your website.
3. My username and blog address are included: http://michaeltmurrayuk.blogspot.co.uk/