openlayers/doc/customization

   1 Customizing OpenLayers
   2 ======================
   3
   4 OpenLayers is designed to fit many needs -- fitting in alongside all kinds of
   5 various applications which are currently in use.
   6
   7 Currently, OpenLayers supports a 'theme' option when creating a map. This
   8 theme option allows you to specify the location of a CSS theme which should
   9 be included.
  10
  11 A default theme is available as an example in the theme/ directory: the setup
  12 is:
  13
  14  * theme/
  15  * theme/default/
  16  * theme/default/style.css
  17  * theme/default/img/
  18
  19 Currently, the OpenLayers code does not support class names, and therefore,
  20 it is not possible to control many aspects of OpenLayers code with CSS
  21 classes. However, with this framework in place, we expect to invest time
  22 to make existing features and new features use the CSS theming framework
  23 where apropriate.
  24
  25
  26 Class Naming
  27 ============
  28 Elements should have class names which are descriptive of the Javascript
  29 class from which they come. For example, the main layer switcher element
  30 in the OpenLayers.Control.LayerSwitcher would be classed:
  31
  32   olControlLayerSwitcher
  33
  34 This would allow users to add to their style.css class in their theme,
  35 changing, for example:
  36
  37 ::
  38
  39   .olControlLayerSwitcher input {
  40     width:10px;
  41   }
  42
  43 Sub elements of a particular control can add to the class name:
  44
  45 ::
  46
  47   .olControlLayerSwitcherBaseLabel {
  48       color: red;
  49   }