Sign in to follow this  
Followers 0

Skin Import Guide


Description

A highly visual, step by step guide to assist new administrators with their first skin import.
A reasonably common question from new administrators is "How do I import a skin?" so here is a detailed step by step guide to assist with that. :) , I have based this on the CleanCut skin, available from your Client Centre.

1. Having downloaded the .zip / .rar to your desktop, extract it:

[IMG]http://img.photobucket.com/albums/v294/yellow_spider/ipb_tutorials/skin_import_1.png[/IMG]


2. Having extracted the .zip, lets take a look.

Its the skin_files folder we are interested in, but sometimes the actual skin files are just inside the zip. Other items you may find inside the zip are .psd files for creating your own logos and additional images. If there is a readme file included, examine that too as the skin author may have special instructions for the skin import.

[IMG]http://img.photobucket.com/albums/v294/yellow_spider/ipb_tutorials/skin_import_2.png[/IMG]


3. Looking in the skin_files folder, we can see the xml's. Sometimes there are more than two as a replacements file is quite common too. Do not attempt to extract these xml's, leave them as they are.

[IMG]http://img.photobucket.com/albums/v294/yellow_spider/ipb_tutorials/skin_import_3.png[/IMG]


4. Login to your boards admin control panel. Click the Look / Feel tab along the top. This will open the Skin Manager. Now click the 'Import New Skin Set' button:

[IMG]http://img.photobucket.com/albums/v294/yellow_spider/ipb_tutorials/skin_import_4.png[/IMG]


5. There are a few sections on this page. Always start with the top one the 'Import Skin Set' section. Using the browse button near the 'Upload XML(Archive) Skin Set' browse for and upload the skin xml file, in this example you are looking for cleancut.xml.gz

Once you have it selected, ensure the rest of those options match what is shown, especially 'Use Image Set' should be empty and then click 'Import Skin Set'

[IMG]http://img.photobucket.com/albums/v294/yellow_spider/ipb_tutorials/skin_import_5.png[/IMG]


6. All being well, you will be shown a message similar to this:

[IMG]http://img.photobucket.com/albums/v294/yellow_spider/ipb_tutorials/skin_import_6.png[/IMG]


7. Now we have to return and do the images. This is usually the cause of most confusion. Scroll down a bit to the 'Import Image Set' section. Browse for the skin file, in our example this is images-clean.xml.gz. Leave the next two box's empty as per the screenshot.

Important: With the 'Apply To Skin Set' it is vital that you choose the skin you just imported here before clicking to import it. You will be able to easily identify the skin from its name here.

Once you have selected the appropriate skin, click 'Import Image Set'

[IMG]http://img.photobucket.com/albums/v294/yellow_spider/ipb_tutorials/skin_import_7.png[/IMG]


8. You should see a message similar to this, indicating the image import was successful:

[IMG]http://img.photobucket.com/albums/v294/yellow_spider/ipb_tutorials/skin_import_8.png[/IMG]


9. Click the Look / Feel tab again now or click 'Manage Skin Sets & Template's on the left hand side to return to the Skin Manager page. You will see your newly imported skin listed. Click the grey button next to it and choose 'Edit Settings':

[IMG]http://img.photobucket.com/albums/v294/yellow_spider/ipb_tutorials/skin_import_9.png[/IMG]


10. There are a lot of options here, and I shall only explain the essential ones as some are beyond the scope of this article. The most important ones are which groups will see the skin and if you wish to hide it from the skin chooser or not. You can see these in the 'Set Permissions' section:

[IMG]http://img.photobucket.com/albums/v294/yellow_spider/ipb_tutorials/skin_import_10.png[/IMG]


11. For this example, let us set the skin to show in the skin chooser and be available to all groups. Check the 'Select All current and future groups' and the 'Make this the default skin' checkbox's and change the 'Hide this skin from the dropdown list?' to no. You should at this stage have something like this:

[attachment=560:skin_import_11.png]


12. Scroll to the end of the page and click to save the changes. You will see a message similar to this, indicating the skin was recached:

[attachment=561:skin_import_12.png]


13. Congratulations, that's it. :) , view your board to see your new skin:

[attachment=562:skin_import_13.png]



Extra notes: On the Skin Manager page, you can quickly click the blue HTML text to set a particular skin as default. You can also click the small binocular / globe icon to hide / unhide it from the skin chooser too.



0 Comments

There are no comments to display.