How to Create or Install a New Theme

By default, FlightPath will be installed using the "Classic" theme, located at /themes/classic in your FlightPath installation directory.

Eventually, you will probably want to customize your FlightPath experience, to re-theme FP to whatever aligns with your school's branding.

 

How to create a new theme:

You might be tempted to just make changes directly to the "Classic" theme, but this would be a mistake, because as soon as you update FlightPath, all of your changes would be lost.  So, here is the procedure you should take:

  1. Copy a theme (eg: /themes/classic) to your "custom" directory's theme folder, and rename to whatever you like.
        Eg: /custom/themes/classic_my_school
  2. Now, you may make changes to that copy, and even if you update FlightPath, you can preserve your theme by making sure to copy out the "custom" parent directory/
  3. Make sure to edit the theme's .info file (or create a new one if necessary).  It should be the same name as your new directory.  Ex:  classic_my_school.info.
  4. Enable (see below) the theme, and edit the theme's php and css files as you see fit.  Icons and other images are kept in the theme's /images/ directory. 
  5. To change the icons, for example, you may add new icons, or replace existing icons with the same filenames.  Icons should be near 19x19 in size, as FP will scale to that size in HTML.

 

To enable a new theme:

  • These instructions work for your custom themes, as well as themes you may download.
  • Copy the theme's folder to your /custom/themes directory. Eg, custom/themes/my_theme
  • Visit the Admin Console of your site, and go to System settings (admin/config/system-settings)
  • For FlightPath 5: You will see the new theme as an option to select under "Themes".  Make sure the theme has a .info file named the same name as its custom directory.  Ex:  my_theme.info.
  • For FlightPath 4: Set the "Theme location" setting to the directory.  For example:  "custom/themes/my_theme".
       Notice there are no preceeding or trailing slashes!
  • If there is a problem and you suddenly cannot access your site, you can change back to the Classic theme by directly modifying the database
    • In the variables table, set the value of the "theme" variable to exactly this: s:14:"themes/classic";