NOTE: this no longer applies to the current design!
I don’t find the menus in Wakka particularly practical. For example, when I go to a page, I often want to know what page-changes were made, so I have to scroll to the bottom to get what I need. Some people also have problems with double-clicking the page to edit it (I’ve added an edit button), and search at the bottom isn’t really practical. Therefore, I’ve modified the layout to make most links always available wherever you are on the Wiki page:
Warning: This is using CSS for layout that works best in Browsers that have implemented CSS standards properly. That includes Mozilla-based browsers & Opera. IE/win displays the pages, but has been hacked (see here) to have the cool ‘always-there’ menu bar - IE also has buggy .PNG support which is why the edit button has been removed in IE (although see here). I know there are more IE users out there, but I personally don’t want to spend lots of time trying to cater for IEs myriad display bugs(the current hacks will suffice), I just hope MS will finally be able to code a capable rendering engine (as they did for IE/mac already…)
Here are the header.php, footer.php and 2 external CSS files (one for good browsers and one to fix IE). The CSS files are expected to reside in a subdirectory of the wiki root called style. A 50x50 pixel site logo called wiki.png is also expected there:
HEADER.PHP:
<?php
$message = $this->GetMessage();
$user = $this->GetUser();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title><?php echo $this->GetWakkaName().":".$this->GetPageTag(); ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="keywords" content="<?php echo $this->GetConfigValue("meta_keywords") ?>" />
<meta name="description" content="<?php echo $this->GetConfigValue("meta_description") ?>" />
<meta name="MSSmartTagsPreventParsing" content="true" />
<link rel="stylesheet" href="<?php echo $this->GetConfigValue("base_url") ?>style/wiki.css" type="text/css" />
<!--[if IE 6]>
<link rel="stylesheet" href="<?php echo $this->GetConfigValue("base_url") ?>style/wikiie.css" type="text/css" />
<![endif]-->
<script type="text/javascript">
function fKeyDown()
{
if (event.keyCode == 9)
{
event.returnValue= false;
document.selection.createRange().text = String.fromCharCode(9);
}
}
</script>
</head>
<body
<?php echo (!$user || ($user["doubleclickedit"] == Y)) && ($this->GetMethod() == "show") ? "ondblclick=\"document.location='".$this->href("edit")."';\" " : "" ?>
<?php echo $message ? "onLoad=\"alert('".$message."');\" " : "" ?>
>
<div class="editbutton">
<?php echo ($this->HasAccess("write") ? "<a href=\"".$this->href("edit")."\" title=\"Click to edit this page.\"><img src=\"http://yoursite.org/wiki.png\" /></a>" : ""); ?>
</div>
<div class="header">
<h2><?php echo $this->config["wakka_name"] ?> : <a href="<?php echo $this->config["base_url"] ?>TextSearch?phrase=<?php echo urlencode($this->GetPageTag()); ?>"><?php echo $this->GetPageTag(); ?></a></h2>
<?php echo $this->Link($this->config["root_page"]); ?> ::
<?php echo $this->config["navigation_links"] ? $this->Format($this->config["navigation_links"])." :: " : "" ?>
You are <?php echo $this->Format($this->UserName()) ?>
<div class="headermenu">
<?php echo $this->FormOpen("", "TextSearch", "get"); ?>
<?php echo $this->GetPageTime() ? "<a href=\"".$this->href("revisions")."\" title=\"Click to view recent page revisions.\">Revisions</a> ::\n" : "" ?>
<?php
// if this page exists
if ($this->page)
{
// if owner is current user
if ($this->UserIsOwner())
{
print("Yours :: <a href=\"".$this->href("acls")."\">ACLs</a> ::");
}
else
{
if ($owner = $this->GetPageOwner())
{
print(" ".$this->Format($owner));
}
else
{
print("Nobody".($this->GetUser() ? " (<a href=\"".$this->href("claim")."\">Own-It</a>)" : ""));
}
print(" :: ");
}
}
?>
<a href="<?php echo $this->href("referrers") ?>" title="Click to view a list of URLs referring to this page.">Referrers</a> ::
<input name="phrase" size="10" style="border: 1px dotted #CCCCAA; height: 12px; padding: 0; margin: 0; background-color: #FFFFEE" />
</div>
<?php echo $this->FormClose(); ?>
</div>
FOOTER.PHP:
<?php echo $this->FormOpen("", "TextSearch", "get"); ?>
<div class="footer">
<?php
echo $this->HasAccess("write") ? "<a href=\"".$this->href("edit")."\" title=\"Click to edit this page.\">Edit this page</a> ::\n" : "";
echo $this->GetPageTime() ? "<a href=\"".$this->href("revisions")."\" title=\"Click to view recent page revisions.\">".$this->GetPageTime()."</a> <a href=\"".$this->href("revisions.xml")."\" title=\"Click to view recent page revisions in XML format.\"><img src=\"".$this->href("", "xml/xml.gif")."\" width=\"36\" height=\"14\" align=\"middle\" style=\"border : 0px;\" alt=\"XML\" /></a> ::\n" : "";
// if this page exists
if ($this->page)
{
// if owner is current user
if ($this->UserIsOwner())
{
print("The page is yours :: <a href=\"".$this->href("acls")."\">Edit ACLs</a> ::");
}
else
{
if ($owner = $this->GetPageOwner())
{
print("Owner: ".$this->Format($owner));
}
else
{
print("Nobody".($this->GetUser() ? " (<a href=\"".$this->href("claim")."\">Take Ownership</a>)" : ""));
}
print(" :: ");
}
}
?>
<a href="<?php echo $this->href("referrers") ?>" title="Click to view a list of URLs referring to this page.">Referrers</a> ::
Search: <input name="phrase" size="15" style="border: 1px dotted #CCCCAA; padding: 0; margin: 0; background-color: #FFFFF8" />
</div>
<?php echo $this->FormClose(); ?>
<div class="copyright">
<?php echo $this->Link("http://validator.w3.org/check/referer", "", "Valid XHTML 1.0 Transitional") ?> :: <?php echo $this->Link("http://jigsaw.w3.org/css-validator/check/referer", "", "Valid CSS") ?> :: Powered by <?php echo $this->Link("WakkaWiki:WakkaWiki", "", "Wakka ".$this->GetWakkaVersion()) ?>
</div>
<?php
if ($this->GetConfigValue("debug"))
{
print("<span style=\"font-size: 11px; color: #888888\"><strong>Query log:</strong><br />\n");
foreach ($this->queryLog as $query)
{
print($query["query"]." (".$query["time"].")<br />\n");
}
print("</span>");
}
?>
</body>
</html>
WIKI.CSS:
@media print {
body { font: 14px/16px "Trebuchet MS", Verdana, sans-serif; background: white; color: black; padding:0; margin:0;}
ul, ol { list-style-type: square; margin: 1em 0 1em 2em; padding: 0; text-indent: 0;}
ol.num {list-style-type: decimal;}
ol.lowerroman {list-style-type: lower-roman;}
ol.upperroman {list-style-type: upper-roman;}
ol.loweralpha {list-style-type: lower-alpha;}
ol.upperalpha {list-style-type: upper-alpha;}
li, p {margin: 0; padding: 0.5em 0;}
.highlight {color: red; background: #FFC;}
.strikethrough {color: #888; text-decoration: line-through;}
.notes {color: red; background: #FFC;}
.centre {text-align: center;}
.code {border: 1px solid black ; font: 10px "Courier New", monospace; width: 90%; margin: 2em auto; overflow: auto; padding: 3px;}
.page {margin: 1%;font: 12px/17px Verdana, Helvetica, Arial, sans-serif;text-align: justify;}
.comment { background-color: #EEE; padding: 5px; border: 2px dashed; margin: 10px;}
.header {display: none;}
.footer {display: none;}
.editbutton img {display: none;}
.commentform {display:none;}
.commentsheader {display:none;}
.copyright {display:none;}
}
body {font: 14px/16px "Trebuchet MS", Verdana, sans-serif; background: #e4ddcc; color: #000; padding:0; margin:0;}
textarea, input, td, li, a {font-size: 1em;}
a {color: #933; text-decoration: underline;}
a:hover {color: #F00}
a.button {font: normal 12px/24px sans-serif;
text-decoration: none;
background: Menu !important;
color: MenuText !important;
padding: 0px 3px 1px;
border: outset 2px Menu;}
a.button:hover {color: #900 !important;}
ul, ol {list-style-type: square; margin: 1em 0 1em 2em; padding: 0; text-indent: 0;}
ol.num {list-style-type: decimal;}
ol.lowerroman {list-style-type: lower-roman;}
ol.upperroman {list-style-type: upper-roman;}
ol.loweralpha {list-style-type: lower-alpha;}
ol.upperalpha {list-style-type: upper-alpha;}
li, p {margin: 0; padding: 0.5em 0;}
form {margin: 0; padding: 0; }
h1, h2, h3, h4, h5 {margin: 0; padding: 0;}
img {border: 0px;}
hr {margin: 5px 0; padding: 0; height: 3px; background: black;}
pre {padding: 0; margin: 0;}
.highlight {color: red; background: #FFC;}
.strikethrough {color: #888; text-decoration: line-through;}
.notes {color: red; background: #FFC;}
.centre {text-align: center;}
.email1 {color: #D00;}
.email2 {color: #00D;}
.header { z-index: 5;
position: absolute;
font-size: 0.9em;
margin: 0;
top: 0;
left: 0;
width: 98%;
height: 3.5em;
overflow: hidden;
border: 0;
border-bottom: 3px solid;
padding: 0 1% 0 1%;
background: #e4ddcc; }
html>body .header {position:fixed;}
.header h2 {padding: 1px 0 5px 0;}
.headermenu { font: 9px/9px Verdana, sans-serif;
text-align: center;
z-index: 10;
position: absolute;
color: #555;
background: #d4ccbb;
vertical-align: middle;
width: 190px;
height: auto;
top: 1px;
right: 55px;
margin: 0;
padding: 0;
border: 1px solid #BA9;}
.page { margin: 3.4em 8px 0 8px;
background-color: #FFF;
padding: 10px 15px 10px 15px;
border: 2px inset;
border-bottom: none;
font: 13px/18px Verdana, Helvetica, Arial, sans-serif;
text-align: justify;
z-index: 1;}
.page h1 {font: 900 2.5em "Trebuchet MS", Verdana, Helvetica, sans-serif;}
.page h2 {font: 900 2.1em "Trebuchet MS", Verdana, Helvetica, sans-serif;}
.page h3 {font: 900 1.6em "Trebuchet MS", Verdana, Helvetica, sans-serif;}
.page h4 {font: 900 1.3em "Trebuchet MS", Verdana, Helvetica, sans-serif;}
.page h5 {font: 900 1.1em "Trebuchet MS", Verdana, Helvetica, sans-serif;}
.footer { margin: 0 8px;
background-color: #DDD;
padding: 5px;
border: 2px inset;
border-top: 1px solid #CCC;
text-align: left;}
.editbutton {position: absolute;
display: none;
top: 2px;
right: 8px;
width: 50px;
height: 50px;
z-index: 20;
background: transparent;}
html>body .editbutton {position: fixed; display: block;}
.editbutton a, .editbutton a:hover {background: transparent; border: 0px;}
.commentsheader {margin: 0 8px; background-color: #DDD; padding: 0 10px; border: 2px inset; border-bottom: none; border-top: 1px solid #CCC }
.comment {margin: 0 8px; background-color: #EEE; padding: 10px; border: 2px inset; border-bottom: none; border-top: 1px solid #CCC; }
.commentinfo {color: #AAA; }
.commentform {margin: 0 8px;background-color: #EEE; padding: 10px; border: 2px inset; border-bottom: none; border-top: 1px solid #CCC }
.code {color: black; background: #FFF; border: 1px solid #888 ; font: 11px "Courier New", monospace; width: 90%; margin:auto; overflow: auto; padding: 3px; }
.revisioninfo {color: #AAA; padding-bottom: 20px;}
.additions {color: #008;}
.deletions {color: #876; text-decoration: line-through;}
.error {color: #3C3; font-weight: bold;}
.indent {margin-left: 2em;}
.copyright {font-size: 0.8em; color: #777; text-align: right;}
.copyright a {color: #987;}
WIKIIE.CSS - Hacked CSS to give IE fixed menus.
html {overflow: hidden;}
body {height: 100%; overflow: auto; margin-right: 0px;}
.header {width: 96%; margin-right: 16px;}
perfect design thanks
218.249.83.87 (2008-09-09 23:53:14)
It's serious
218.249.83.87 (2008-09-09 23:53:21)
eracellizele
208.79.14.20 (2008-12-08 04:29:17)
If we create a system in which equitable access to national resources is guaranteed regardless of any form of affiliation, then people will no longer feel the need to fall back on these affiliations either defensively or offensively and political leaders who then seek to exploit our differences for their own ends will find themselves without followers. ,
88.162.175.38 (2009-10-22 18:34:00)
Hi! rpztam
91.214.45.46 (2010-01-14 16:51:08)
According to my exploration, thousands of people on our planet get the home loans from different creditors. So, there's good chances to receive a college loan in every country.
91.212.226.143 (2011-10-05 18:37:41)
I can't hear anyhting over the sound of how awesome this article is.
109.230.216.225 (2012-01-02 04:42:32)
rWZBqj I envy you. The content and design of your blog is much better than mine. Who made a design for you?!....
193.105.210.170 (2012-02-10 23:12:04)
Tl2EW2? Yeah !... life is like riding a bicycle. You will not fall unless you stop pedaling!!....
193.105.210.170 (2012-02-12 04:12:33)
1
82.145.210.73 (2012-07-22 12:09:53)
There is noticeably a bundle to learn about this. I assume you created confident excellent points in attributes also.
lv bags https://skydrive.live.com/redir?resid=A0348642D1ADFBA7!115&authkey=!AI6TvoOQNvs0Wm8
120.33.245.79 (2012-11-07 03:08:30)
I’m wondering how I might be notified when a new post has been made. I have subscribed to your RSS feed which must do the trick! Have a nice day.
218.20.123.15 (2013-01-03 08:52:24)
You certainly have some agreeable opinions and views
110.85.75.239 (2013-05-02 05:59:34)
I have to admit, I am not too fond of the "All Seeing Eye". It's kind of creepy, and really doesn't communicate the intended message "Edit this page." (Although, I do admit, there is an element of humor to it...<G>).
oproxy3.rockwellcollins.com (2003-08-08 03:18:25)