Wiki Breadcrumbs

THL Toolbox > Developers' Zone > Web Development > Wiki Breadcrumbs

Wiki Breadcrumbs

Contributor(s): Mark Ferrara, Than Grove

In general, wiki pages included within a THL frame through AJAX do not display their breadcrumbs. This is because there is a CSS style that suppresses them. They can however be displayed for a specific portion of the site by adding specific CSS styles for that portion off the site. This can be either a portal section of the site or a specific page. Examples of areas in THL where the wiki breadcrumbs have been “turned on ” are:

Turning on Wiki Breadcrumbs for a Section of the THL Site

To display the wiki breadcrumbs in every page of a certain section of the THL site, one must add two CSS instructions to the CSS file that is used by every page of the site. Using the THL Toolbox as an example, the file in question is external link: http://www.thlib.org/tools/css/tools.css As a general rule, the generic CSS file is found in a ///css/// folder of that section in a file with the same name as the section but with the /.css extension. Thus, here, “tools.css”. At the top of this file, insert the following CSS instructions:

/* -----------Allow Breadcrumbs in Tools -------------------*/ 
.wiki h3.heading-h6 {width: 730px; margin:3px 0 0 -5px; text-indent:0px;}
.wiki #content h3.heading-h1 { margin-top:28px;}

The first line of this is a comment describing what the following two CSS instructions do. The second line (or first CSS instruction) actually displays the wiki breadcrumbs by overriding the CSS to hide them. The third line (or second CSS instruction) moves the first H1 header of the wiki down so that if the breadcrumbs wrap lines (which they often do) there will be enough space for them to display without overlapping the first header of the wiki. Note: This solution is not ideal in that if the breadcrumbs do not wrap there is extra space, but no other solution has yet been found.

Turning on Wiki Breadcrumbs For individual pages

The same processes can be employed for an individual page in THL, though it has, as of this writing, yet to be done. This would be through using the $add_header variable in the PHP page in question. If there is not already an add_header variable in the document it must be added. If there is, the code can be added at the end of its value before the closing double quote. Here is an example of the code used to turn on the wiki breadcrumbs in a page that has a call to another CSS file. This example would be used if one wanted to turn on breadcrumbs only for a certain page within the site and not for others:

<? $droot = $_SERVER['DOCUMENT_ROOT'];  ?>

<?
 $add_header=' <link rel="stylesheet" type="text/css" href="/aportal/css/aportal.css" media="all" />
          <style>
            /* -----------Allow Breadcrumbs for this page only in Aportal -------------------*/ 
            .wiki h3.heading-h6 {width: 730px; margin:3px 0 0 -5px; text-indent:0px;}
            .wiki #content h3.heading-h1 { margin-top:28px;}
          </style>';
 include_once  "$droot/global/php/header.php" ; ?>

This causes the PHP to insert the CSS instructions directly into the PHP-constructed HTML for the page in question and thus allows the wiki breadcrumbs to appear in this page only.

Provided for unrestricted use by the external link: Tibetan and Himalayan Library