These instructions currently apply to the master branch only; this one will become CAT 1.2 at a later point in time.


A number of federations wanted to customise the eduroam CAT appearance so that it matches their local NRO look&feel. Typically, this was done by using the CAT APIs on a local webpage.

This approach creates some usability problems

The result of the on-list dicussions was a feature request: "support multiple skins" - so that the UI at could be made to look like it is a local page to the NRO.


end-user point of view

The end-user UI entry points consist of three files:

/index.php - main frontpage with selection of IdP etc.
/basic.php - similar to index.php but for devices with small screens or other handicaps (dumb browser...)
/accountstatus.php - Status and Pick-Up page for eduroam-as-a-Service user accounts

Coding your own

Skins can be created directly in the GitHub source of CAT (please send pull requests). Create a directory


with YOURSKIN being an identifier of your choice. Inside that directory, you need at least the three files referenced above. Before calling your skinned pages, the CAT loader automatically loads the configuration, a skin handler, and depending on the page being called an array with extra information about the incoming request for your ease of coding. You find these as pre-defined constants and variables:

               "tokenstatus" => $tokenStatus,

               "OS" => $operatingSystem,

               "profile" => $profile,

               "idp" => $idp,

               "fed" => $fed ];

The skin pages are loaded with a cross-directory include() from the skin loader. Your skin should never assume to know its relative path on the server. It should rather construct all paths with $skinObject->findResourceUrl("IMAGES") (or "CSS" or "EXTERNAL" or "BASE") if you want to reference a image resource from the "global" stock of images (our stock is contained in the web/resources/ directory) , and a $skinObject->findResourceUrl("IMAGES", true) if you want an image that is only relevant for and confined in your skins/YOURSKIN/ directory. Your directory structure MUST mimick the one in web/resources/ for things to work.

Need inspiration?

Take a look at web/skins/example/. And of course for full functionality take a look at web/skins/classic/.

Activating the skin

The default skin is the "classic" skin. Add a new skin to the global config (CONFIG['APPEARANCE']['skins'] array). As soon as the skin is in the config, the usual way to change it is via fed admin UI; add the new option "Preferred Skin for User Area" and type the string that matches YOURSKIN.

This has the limitation that the skin will only show once the system knows which federation the user belongs to; i.e. they will get the classic UI until they have selected their IdP, and will then get the new skin for the actual download page.

To make all pages appear in the desired skin, it is possible to hard-code the desired skin in the POST or GET leading to the CAT page. Append a

&skin=YOURSKIN (or POST equivalent)

to the link and the UI will show with the desired skin immediately.

Famous last words?

Happy coding!