Welcome to a quick introduction to the world of skin development.

This tutorial will teach you how to make changes to an existing jAlbum skin, but you will also learn how to:

• install and use a sample skin in the jAlbum application
• understand the basics of a jAlbum skin
• open the jAlbum skin editor in the jAlbum application
• edit a skin with HTML and Cascading Style Sheets (CSS)

Install the sample skin

Installing the "SampleOne" skin in the jAlbum application

To get started you will need to install the sample skin (called "SampleOne") necessary for this tutorial. Click this link to download the skin and choose to open the file (do not choose to "Save on computer"). This will launch the jAlbum application on your computer. jAlbum will notify you that it will install the skin.

Try it out

Create a new jAlbum album project by dragging a couple of files to the big empty area of the jAlbum application. Select the "SampleOne" skin in the skin picker and then click "Make jAlbum" to create an album. If you preview your newly made album you should get something like this:

Album built with the "SampleOne" skin

Launch the jAlbum Skin editor

Launching the jAlbum Skin editor from the "Tools" menu

Now it is time to see what's under the hood. The files in a skin are editable text files formatted with HTML and CSS. The main files are called index.htt and slide.htt. These are template files for the index and slide pages of an album.

To open up the template files for editing make sure that the "SampleOne" skin is slected in the jAlbum application skin picker, then from the menu select "Tools", "Skin developer" and "Edit skin". This will open up the jAlbum skin editor with the files index.htt and slide.htt ready to be edited.