WackoWiki : WackoDocDeutsch/Layouts/Entwerfen

Layout entwerfen

http://validator.w3.org/
Seite noch beim Zusammenstellen!
Оглавление документа

Elemente

Einzeln erklärt und beschrieben unter Codefragmente.

Lesezeichen
Anmelden / Abmelden
Suchfeld
Pfad + Seite
Editieren
Revisionen
Besitzer
Berechtigungen
Einstellungen
Umbenennen
Löschen
Beobachten
Drucken

Kommentare
Dateien

Dateien

header.php

header


footer.php

footer


show.php – Dateien, Kommentare

Kommentarleiste ausblenden
<?php
  $this
->config["hide_comments"] = 1;
?>


Dateileiste ausblenden
<?php
  $this
->config["hide_files"] = 1;
?>

nicht in der config und nicht dokumentiert -> selber reinschreiben!


Aktionen einbinden:
<? print $this->Format'{{hits}}' );?>


Ausblenden von Elementen für nicht angemeldete Nutzer:
<?
if ($this->GetUser()){ 
// auszublendender Teil / Elemente
}
?>

Bilder

Bilder einbinden
<input type="image" 
src="<?php echo $this->GetConfigValue("theme_url"?>icons/bild.png" alt="alternativ Text" align="top" />


Bsp. mit Link hier ...

ggf. eigner Ordner /img und dann img/bild.png

HTML

XHTML Struktur

Kontainer

<div class="header"></div>
<!-- Kommentar -->
<div class="pageBefore"></div>
<div class="page"></div>
<div class="filesheader"></div>
<div class="commentsheader"></div>
<!-- Kommentar -->
<div class="footer"></div>


CSS

CSS Struktur

Datei 'wakka.css' des Standard-Themes 'default'



Elemente


HTML Wiki Bemerkung
<strong> ** ** fett
<em> // // kursiv
<u> __ __ unterstrichen
<small> ++ ++ klein
<tt> ## ## monospace
<s> -- -- durchgestrichen
<div style="text-align: center;"> >> << zentriert
<span class="cite"> !! !! Hinweis
<span class="cl-blue"> !!(blue) !! Hinweis blau
<span class="cl-green"> !!(green) !! Hinweis grün
<span class="cl-red"> !!(red) !! Hinweis rot 
<span class="mark"> ??rot ?? hervorgehoben
<textarea class="code"> %% %% eingebetteter Code
<h1> == == Haupt-Überschrift
<h2> === == Grosse Überschrift
<h3> ==== == Mittelgrosse Überschrift
<h4> ===== == Kleinere Überschrift
<h5> ====== == Kleine Überschrift
<h6> ======= == Kleinste Überschrift
<blockquote> <[ ]> Zitat
<dfn title="Def">Bez</dfn> (? Bez == Def ?) Bezeichnung, Definition
<hr noshade="noshade" size="1"> ---- Linie

Vorlage

/***********************************************************************
* Allgemein
***********************************************************************/
 
html * {}
body   {}
 
/* Links */
a:link    {}
a:visited {}
a:hover   {}
a:active  {}
a:focus   {}
 
/* Formular */
form     {}
textarea {}
 
/* Copyright am Ende */
.copyright {}
.copyright a {}
 
/* Gruppierungen (Feldgruppe) */
.fieldset {}
 
/* Seiten-Vorschau (Editieren) */
.preview {}
.preview legend {}
 
/* Seite */
.page {}
 
/* Seitenkopf */
.pageBefore {}
 
/* Seiten-Vorschau */
.pageedit {}
 
/* Header, Footer */
.header {}
.footer {}
 
/* Span: \'Suche:\', Input */
.searchbar {}
 
/* kein Textumbruch */
.nobr {}
 
/* Wiki-Name (header.php) */
.main
 
/***********************************************************************
* Wiki-Formatierungen
***********************************************************************/
 
/* fett, kursiv, unterstrichen, klein, monospace, durchestrichen */
strong {}
em     {}
u      {}
small  {}
tt     {}
s      {}
 
/* Hinweis, blau, grün, rot, hervorgehoben, eingebetteter Code */
.cite     {}
.cl-blue  {}
.cl-green {}
.cl-red   {}
.mark     {}
.code {}
 
/* Messenger Code */
.micq1 {}
.micq2 {}
.micq3 {}
 
/* E-Mail */
.email1 {}
.email2 {}
 
/* Überschriften */
h1 {}
h2 {}
h3 {}
h4 {}
h5 {}
h6 {}
 
/* Definition */
dfn {}
 
/* Zitat */
blockquote {}
 
/* Inhaltsverzeichnis-Ebenen: Divs */
.toc1 {}
.toc2 {}
.toc3 {}
.toc4 {}
.toc5 {}
.toc6 {}
 
/***********************************************************************
* Dateien, Kommentare
***********************************************************************/
 
/* Überschriften: Div, Link */
 
.filesheader, .commentsheader {}
.filesheader a, .commentsheader a {}
 
/* Listen: */
 
.files, .comment { /* Div */ }
 
table.upload td { /* alle Zellen */ }
table.upload td.dt- { /* Zelle Datum */ }
table.upload td.dt- .dt2- { /* Span Datum */ }
table.upload td.remove- { /* Zelle Löschen */ }
table.upload td.remove- a.remove2- { /* Link Löschen */ }
table.upload tdsize- { /* Zelle Größe */ }
table.upload tdsize- size2- { /* Span Größe */ }
table.upload td.file- { /* Zelle Dateiname */ }
table.upload td.file- a { /* Link Dateiname */ }
table.upload td.desc- { /* Zelle Beschreibung */ }
 
.commentinfo { /* Div (Name, Zeit) */ }
.commentinfo a { /* Link Name */ }
 
/* Formulare: */
 
.filesform, .commentform { /* Div */ }
.filesform td, .commentform td { /* Alle Zellen */ }
.filesform input, .commentform input { /* Alle Inputs */ }
 
.commentform form textarea { /* Textarea Kommentare */ }


Noch nicht dabei:

/* basic

*/ P, TD, LI, SELECT, TEXTAREA

label

UL, OL

.time

.print

.error

.revisioninfo

.name

.include

.outerlink

.missingpage

.logBtn

#tooltip

.buttonsspacer

/* Wiki Edit? Toolbar

*/
.toolbar tr
.toolbar .btn-, .toolbar .btn-hover, .toolbar .btn-active, .toolbar .btn-pressed
.toolbar img
.toolbar .btn-hover
.toolbar .btn-active, .toolbar .btn-pressed
.toolbar .btn-pressed
.edname-w, .edname-r, .edname-s
.edname-w
.edname-r
.edname-s

/* Wiki Formatting

*/
STRIKE, S 
STRIKE A:VISITED, S A:LINK
STRIKE A:VISITED, S A:VISITED
STRIKE IMG, S IMG
cite

.add
.del

.center
.indent

.additions
.deletions

.notes

table.usertable
table.usertable tr td
table.dtable
table.dtable tr td

.email-odd
.email-even

p.auto
.pmark
.pmark A:LINK,
.pmark A:VISITED
.pmark A:HOVER,
.pmark A:ACTIVE
.pright
.pright .p-
.pright .pbody-

.pleft
.pleft .p-
.pleft .pbody-

/* Text_Highlighter */
.hl-main
.hl-gutter
.hl-table

.hl-default
.hl-code
.hl-brackets
.hl-comment
.hl-quotes
.hl-string
.hl-identifier
.hl-reserved
.hl-inlinedoc
.hl-var
.hl-url
.hl-special
.hl-number
.hl-inlinetags
.hl-builtin
/* Text_Highlighter Box*/

div.action
div.action-content

Aufgaben