Jason Pell edited this page Jun 21, 2013 · 1 revision

Table of Contents

What is a theme?

The theme/ directory is where all the themes are actually stored. Each directory underneath theme/ contains a separate theme. The name of the theme directory is also the name of the theme itself.

The theme/$_OPENDB_THEME/ directory has the following structure:

  • theme.php
  • style.css, *.css - primary css and page / section specific css.
  • images/*.gif,*.jpg,*.png
  • images/$_OPENDB_LANGUAGE/*.gif,*.jpg,*.png
The existence of an theme.php is the only thing required to indicate to OpenDb that the theme is valid.

The theme.php has several functions which can be called from outside the theme itself:

  • theme_index()
  • theme_header($title)
  • theme_footer()
  • theme_image_src($src)
  • theme_image($src, $title, $type)
If any of these functions is not defined, the default functionality will be used instead.

Cascading Style Sheets

The css constitutes a majority of the configurable styling and layout for themes.


The stats.css is parsed to ascertain the correct graph style.

In 1.5 the available options have been significantly reduced as part of the rewrite of the chart code to allow pluggable implementations. Subsequent releases of opendb will introduce additional controls.

	background: transparent;
	width: 550;
	height: 275;


_theme_image functionality

When this function is called from main scripts it goes looking in particular directories for the $src image.

These are the steps it uses to work out which image to display:

  1. Checks if 'theme_image' function is defined. This function should return a fully formed or a textual equivalent.
    If the theme specific 'theme_image' returns FALSE, this indicates that the local function is not taking responsibility for displaying the image in this case. We should continue as though the theme specific 'theme_image' function did not exist.

  2. Check if theme_image_src($src) function is defined, in which case will use image from the location returned by this function in theme_image. Useful for themes, where there is only layout changes, and the images are the same as for example the default theme.

  3. Checks for $src in the following directories:
    • theme/$_OPENDB_THEME/images/$_OPENDB_LANGUAGE/
    • theme/$_OPENDB_THEME/images/
    • theme/$_OPENDB_THEME/
    • theme/default/images/$_OPENDB_LANGUAGE/
    • theme/default/images/
    • theme/default/
    • images/$_OPENDB_LANGUAGE/
    • images/

  4. If $type == "action"<br>&nbsp&#59;&nbsp&#59;&nbsp&#59;&nbsp&#59;return FALSE&#59;
    If the $type is "action", and the specific theme did not handle it, then we have to let the caller (listings.php, item_input.php, item_display.php, etc) handle it in a default way. This is a special case, because the default functionality lists all the actions in text, with a '/' separator between each one. We cannot achieve this in theme's as we do normally, because the _theme_image is only passed one thing at a time. If _theme_image(...) returns FALSE, the caller will know to proceed as normal.

  5. If $alt is not null, the $alt text will be returned instead of tag. This is even if the $alt=="" (empty string).

  6. Otherwise return the $src, without extension, in initcap format.

As you will notice from the above steps, the theme specific 'theme_image' function will be called first if it exists. If this function does exist, and it returns _anything_ than FALSE, the processing in '_theme_image' is considered complete. If the theme function does _not_ exist or returns FALSE, step 2 takes over.

For 'text' based themes, you would implement 'theme_image' with step 3 only and return FALSE otherwise. (See section 4.1 in this document for an example)

Displaying text in place of images

All the 'default' theme are in the $OPENDB/images directory, so new themes can be created without resupplying the images again. In order to override this functionality, you will need to add a 'theme_image' function to your theme index.php.

The following is an example of just such a theme_image function. Please note that you must specify the function spec, exactly as illustrated, for your theme as well (Obviously the content can be different though!).

You will notice that this particular theme_image function, will only return the $alt text if it is _not_ NULL. Any calls to _theme_image will specify NULL for $alt text if there is no text alternative to the image being displayed. This gives you the option of returning FALSE from your custom function in these cases, so that the main process can take over and display the image.

Using own theme based images only in certain circumstances

If you want to get the global _theme_image(...) functionality to produce the image in certain circumstances, and your own theme based theme_image() in others, you can do the following:

If you 'return FALSE' from your theme_image function, the core functionality will take over producing the image; any other return and it will assume you have handled it.

For example, I want to display text for all images, except for 'dvd.gif':

if($src &#61&#59;&#61&#59; &quot&#59;dvd.gif&quot&#59;)
	return FALSE&#59&#59;
else ...

"Action" images

To support using images for actions, you must supply the following images. Note that all action images have a 'action_' prefix, to avoid name clashes.


  • action_edit.gif
  • action_delete.gif
  • action_refresh.gif


  • action_reserve_item.gif
  • action_check_in_item.gif
  • action_check_out_item.gif
  • action_cancel_reserve.gif
  • action_item_history.gif
  • action_add_reserve_basket.gif
  • action_delete_reserve_basket.gif
  • action_quick_check_out.gif
User Admininstration:
  • action_activate_user.gif
  • actiuon_edit_user.gif
  • action_delete_user.gif
  • action_deactivate_user.gif
  • action_change_password.gif

OpenDb Help integration

TODO for 1.0

Other Howtos

1.02 CSS Theme - By Novice For Novice

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.