[cvs] [Wiki] changed: ThemesHowTo

[Marko Djukic]

mdjukic  Sun, 17 Oct 2004 14:01:48 -0700

Modified page: https://dev.horde.org/horde/wicked/display.php?page=ThemesHowTo
New Revision:  1.6

@@ -1,23 +1,24 @@
-+ ##red|Warning! The way themes are used has recently changed, these instructions are no longer valid.##
-
 + Themes !HowTo
 
-Creating a new theme for Horde is as simple as creating a new PHP file in {{horde/config/themes/}} **not** beginning with {{html-}}.
-This file only needs to contain a single line:
+Creating a new theme for Horde is as simple as creating a new directory under {{horde/themes/}} and adding the files {{info.php}} and {{screen.css}}.
+
+The {{info.php}} contains information regarding the stylesheet. For now this is limited to the name of the theme and an optional line to indicate substitution of icons.
+In its simples form this file only needs to contain a single line:
 
 <code type="php">
+<?php
 $theme_name = _("My Theme Name");
 </code>
 
-This is the theme name as it will appear in the theme list in the users' display options. The internally used theme name that you can use to set a default theme in {{horde/config/prefs.php}} is determined from the file name you use.
+This is the theme name as it will appear in the theme list in the users' display options. The internally used theme name that you can use to set a default theme in {{horde/config/prefs.php}} is determined from the directory name you use.
 
-Let's say you store this code in {{horde/config/themes/mytheme.php}}, then the internal name of this 
-theme would be "mytheme" while the users will see it as "My Theme Name".
+Let's say your new theme is in {{horde/themes/mytheme/}}, then the internal name of this theme would be "mytheme" while the users will see it as "My Theme Name".
 
 If you want to contribute your theme to the Horde Project or make it publically available elsewhere, you should add some comments to the file header to explain where the theme comes from:
 
 <code type="php">
+<?php
 /**
  * This is my personal theme.
  * It is based on the colors of my bike when I was five.
  *
@@ -28,19 +29,20 @@
 </code>
 
 ++ Defining theme colors and styles
 
-This alone doesn't make a theme of course, now you want to create you own set of colors and styles for your theme. These are defined in a PHP array in the file {{html-mytheme.php}}. You can see this file name is simply created by prefixing your internal style name with "html-".
+This alone doesn't make a theme of course, now you want to create you own set of colors and styles for your theme.
 
-The syntax of this file is pretty straight forward. If you know how CSS works and look at some of the existing theme files you should easily find out how to change certain colors, fonts, lines etc. You should //not// start with a copy of the "master" theme file {{horde/config/html.php}} but you should instead only define those CSS rules that you want to overwrite. This way you make sure that your theme doesn't miss any important style if the master theme file gets extended at some point in the future.
+The {{screen.css}} file you can then use to override the default Horde styles. It is a regular static css file, so if you know how CSS works and look at some of the existing theme files you could easily find out how to change certain colors, fonts, lines etc. You should //not// start with a copy of the "master" theme file {{themes/horde/screen.css}} but you should instead only define those CSS rules that you want to overwrite. This way you make sure that your theme doesn't miss any important style if the master theme file gets extended at some point in the future.
 
 ++ Adding icon sets
 
-If you want to add custom icons to your theme you first need to create a folder in the directory {{horde/graphics/themes/}} named after your theme, in our example theme this would be {{horde/graphics/themes/mytheme/}}. Then you need to copy **all** existing icons from {{horde/graphics/}} **including** the subdirectories but **without** the {{themes/}} directory into your theme folder.
+If you want to add custom icons to your theme you first need to create a {{graphics/}} folder in your theme's directory, in our example theme this would be {{themes/mytheme/graphics/}}. Then you need to copy **all** existing icons from {{themes/horde/graphics/}} **including** the subdirectories into your theme folder.
 
 Then extend your theme file with a line so that it looks like:
 
 <code type="php">
+<?php
 /**
  * This is my personal theme.
  * It is based on the colors of my bike when I was five.
  *
@@ -52,9 +54,9 @@
 </code>
 
 Now start replacing the icons in your theme folder with your own ones.
 
-If you want to create custom icons for other applications, simply create folders in the application's {{graphics/themes/}} directory as well. Then add the application name to the {{$theme_icons}} list, for example:
+If you want to create custom icons for other applications, simply create similar folders in the application's {{themes/}} directory as well, for example {{imp/themes/mytheme/graphics/}}. Then add the application name to the {{$theme_icons}} list, for example:
 
 <code type="php">
 $theme_icons = array('horde', 'imp');
 </code>