Wallpaper Template for Dokuwiki

This template offers a semi transparent body over a background image. Its main feature is a static dropdown menu. The Menu supports up to three menu levels.

The name was inspired by photo wallpapers popular in the seventies

License

This template is published under the GNU General Public Licence (GPL) V2.

Special Thanks

This template uses code from the default template and from Michael Klier’s Arctic template.

The CSS-code used in the dropdown menu was inspired by http://www.lwis.net/free-css-drop-down-menu/

The resizable fake background image was inspired by Chris Coyier (http://css-tricks.com/how-to-resizeable-background-image/)

Menu animation inspired by Brian Huisman (http://www.greywyvern.com/?post=337)

Hamburger menu without javascript inspired by Austin Wulf (http://www.sitepoint.com/pure-css-off-screen-navigation-menu/)

Installation

Unpack the file in the /lib/tpl directory of your Dokuwiki installation. It will create a directory named wallpaper there.

In the configuration plugin chose wallpaper as your template:

Configuration

The basic configuration is done via style.ini. In addition to general dokuwiki style options there are two template specific options (under normal circumstances you will not have to change these):

;wallpaper special variables
;---------------------------------------------------------------------------
; width of menu items
__menuwidth__= "15em"
; text color inactive buttons
__color_disabled__="#ccc"

Here you can set the width of the submenus __menuwidth__ (CSS width units apply). The text color of inactive buttons __color_disabled__ should only be changed if your reconfigure the whole color scheme.

Further configuration can be done via the configuration dialog in the admin functions:

Configuration options

  • clean index: this option will remove the standard dokuwiki namespaces (‚wiki‘ and ‚playground‘) from the menu (default: off).
  • clean index of further namespaces: comma separated list of namespaces to be removed from the index if “clean index” is switched on (default: empty).
  • show backlink button: will show a backlink button in the bottom bar (default: off).
  • show search box if logged in: will show a search box, if you are logged in (default: off).
  • create a submenu for pages in the root namespace: this option will put all pages in the top level namespace into a sub menu instead of listing each in the topmost menu level (default: off).
  • submenu entry for the root namespace: menu entry text for the top level namespace (default: ‚Start‘).
  • the menu is based on a user-supplied file: this option will switch off the automatically generated menu and look for a menu file (the name can be configured in the next option) for the menu. For syntax of this file see below. (default: off).
  • menu file name: configure the file name for the menu file (without .txt extension) (default: menu).
  • fixed background image: fixes the background image in the viewport (default: off).

Prepare a wiki file with a structure of unordered list of links. This structure may be three levels deep. These links will be used to construct the menu. The file must be saved in the root namespace of your wiki.

Example:

=====My menu=====
  * [[first level item]]
  * [[first level item]]
    * [[second level item]]
    * [[second level item]]
      * [[third level item]]
  * [[first level item]]

Non-list lines (like the heading in the example) will be ignored. List lines without wikilinks will be ignored too. Links that do not point to existing files will be eliminated from the menu.

If a linked page is a start page of a namespace it will be always be shown in the menu as if this page has sub-entries in the menu even if that is not the case.

Suggested Dokuwiki Configuration

This template works best with “Hierarchical breadcrumbs” switched on and the corresponding “Number of breadcrumbs” set to “0”.

Suggested Configuration 1

Switching “Use first heading for pagenames” to “Always” or “Navigation” results in a nicer menu.

Suggested Configuration 2

Background Image

The background image can be changed if you drop a JPG-image named bg.jpg into the ‚images‘ directory inside the template directory.

The background image should be at least as wide as the biggest possible window width. The image should have a color gradient fading into black in the bottom.

The background for namespaces and/or individual pages may be changed by uploading JPG images. Picture files have to be named (page name)_bg.jpg or (namespace name)_bg.jpg. Replace (page name) or (namespace name) by the page name or namespace name the way it is converted by Dokuwiki (see the page URL). If you use namespaces background pictures must be uploaded into the corresponding folder for the namespace.

To keep the size of the template small I have included only one example background image. Here you can download a few more example pictures:

Browser compatibility

This template should work well with all current browsers.

Dokuwiki compatibility

Version 0.10 of this template was made for DokuWiki Release 2015-08-10 (Detritus). It also works with Dokuwiki releases from 2013-12-08 up to now.

Version History

0.1
- initial release

0.2
- switched to a resizing pseudo background image

0.3
- compatibility release for Dokuwiki rc2010-10-07

0.3.1
- compatibility release for Dokuwiki 2010-11-07

0.3.2
- Fix for black on black footnote pop-ups

0.4
- compatibility release for Dokuwiki rc2011-04-22

0.4.1
- corrected font size for code segments

0.4.2
- adds the possibility to configure the contents of the menu - redesign of the print layout

0.5
- compatibility release for Dokuwiki rc2011-11-10 - small CSS changes

0.5.1
- bugfix for menu file mode: wikilinks are now interpreted correctly including link title - media manager button can be switched off

0.5.2
- compatibility release for Dokuwiki 2012-01-25

0.5.3
- Menu CSS fix suggested by Gleb Kozyrev (gleb [at] gkoz dot com)

0.5.4
- configurable namespaces may be excluded from the index

0.6
- compatibility release for Dokuwiki rc2012-09-10 and 2012-10-13 (Adora Belle)

0.7
- compatibility release for Dokuwiki rc2013-03-06 and 2013-05-10 (Weatherwax)

0.7.1
- fix for dw2pdf button

0.7.2
- CSS syntax fix

0.8
- compatibility release for Dokuwiki rc2013-11-18 and 2013-12-08 (Binky)

0.8.1
- Move to HTML5 and CSS3 - Removes transparent background graphics in favor of CSS3 background transparency

0.8.2
- Menu animation with CSS3 transitions

0.8.3
- Bugfix for default page name

0.8.4
- Fix a regression introduced with the last revision

0.8.5
- Adds the option of a fixed background image - introduces a max width of the content

0.8.6
- sync of github and download code

0.8.7
- fixes a grave bug in the detail picture view

0.9
- offers configurable background images per page and namespace - introduces responsiveness - a few minor fixes

0.9.1
- replaces the javascript hamburger menu with a CSS solution

0.10
- compatibility release for Dokuwiki 2015-08-10 (Detritus)

0.10.1
- a few minor fixes

0.10.3
- fixes a grave bug that made configurable background images per page and namespace impossible

0.10.4
- fixes a grave bug that disabled the creation of the menu in certain circumstances

0.10.5
- honors the order of items in the menu file

0.10.6
- CSS footnotes fix

Download

wallpaper-0.10.6.tar.gz 162.500 Bytes (for Dokuwiki releases from 2013-12-08 upwards)

The source code is also available from a GitHub repository https://github.com/kvormweg/wallpaper

Notice

This template is no longer developed. I will happily keep it running on future Dokuwiki versions if possible or necessary. In the future I will not change the functionality or the look of this template.

Last modified: 11.07.2020 14:07