Perl Mongers :: deutschsprachig - German.pm

A wiki for German-speaking Perl & Raku programming language(s) user groups.

Änderungen, Hilfe

Treffen, Veranstaltungen

Leute, Gruppen, Ziele

PerlLernen

Best of Perl Books
Die Besten Bücher

ErfolgsStories

Links, FAQ, Forum

Mailing List

Impressum


Liebe(r) Perl Monger(in),

diese Site ist bereits seit langem ein Ziel von Spamrobotern. Neu ist, dass ich das Aufräumen leid bin. Darum schreibe mir eine Mail mit Deinem Usernamen und einem Crypt Passwort, damit Du einen passwortgeschtzten Zugang zu dieser Site von mir erhältst. Eines baldigen Tages wirst Du den brauchen, um hier weiterhin Seiten verändern zu können.

Vielen Dank, Sören


Amazon-Angebote... (Einkauf über diesen Link sponsort den Unterhalt von perlmongers.de)

  1. Tipps und Tricks v0.17 & v0.18
    1. Das Aussehen des Kwikis ändern
    2. Wie bekommt man eine Art von "Navigation" auf der linken Seite hin
    3. Links farblich hervorheben, wenn man mit der Maus drüber ist
  2. Tipps und Tricks v0.18
    1. Wie kann man die Navigation auf der Linken Seite farblich gegenüber dem Rest abheben
    2. Wie kann ich verschiedene css-Layouts anbieten, zwischen denen der User wählen kann
    3. Wie kann ich eine Druckvorschau einbauen
    4. Wie bekomme ich kwiki unter WinXP installiert

Tipps und Tricks v0.17 & v0.18

Das Aussehen des Kwikis ändern

  • Die CSS-Files in /srv/www/cgi-bin/hp-kwiki/css
  • Die Templatefiles in /srv/www/cgi-bin/hp-kwiki/local/template (das original-Template-Verzeichnis dahin kopieren und dort ändern)
  • Die Datei /srv/www/cgi-bin/hp-kwiki/config.yaml - hier ein Auszug aus meiner (v0.18):
top_page:      StartSeite
changes_page:  Änderungen
preferences_page:  Einstellungen
slogan:        H+P internal Kwiki
title_prefix:  H+P Kwiki
stylesheet:    Kwiki.css
kwiki_image:   hp_logo.gif
  • Das Logo habe ich (wie man sieht) über die config.yaml eingestellt, die dort angegebene Datei liegt direkt im Kwiki-Hauptverzeichnis.
  • Kleiner unvollständiger Überblick über die Template-Dateien, so weit ich mich dort eingewühlt habe (generell zum Herausfinden: einfach fett eine eindeutige H1-Überschrift eintragen und schauen, wann sie wo auftritt):
display_header.html Kopf der normalen Ansicht
display_body.html Mittelteil der normalen Ansicht
display_footer.html Fußteil der normalen Ansicht
basic_footer.html Kommt (auch?) als Fuß beim Editieren zum Einsatz (v0.18)

Wie bekommt man eine Art von "Navigation" auf der linken Seite hin?

Ich habe dazu in der Datei display_header.html folgende Eintragungen am Ende von <div id="banner"> eingefügt:

<span>HP-Kwiki</span>
 
<div style="font-size:10pt">
<hr />
 
<a href="[% script %]?[% top_page %]" accesskey="1">[% loc_top_page %]</a>
<br />
<a href="[% script %]?[% changes_page %]">[% loc_changes_page %]</a>
<br />
<a href="[% script %]?action=prefs">[% loc_preferences_page %]</a>
 
<br /> <hr />
 
<a href="[% script %]?WikiBewohner">Wiki-Bewohner</a>
<br />
<a href="[% script %]?AktuelleProjekte">Aktuelle Projekte</a>
 
<br /> <hr />
 
<a href="[% script %]?KWikiFormatierungen">Formatierungen</a>
 
</div>

Links farblich hervorheben, wenn man mit der Maus drüber ist

a:hoover {
    text-decoration:underline;
    background:#DE8;
}
a:active {
    text-decoration:underline;
    background:#DE8;
}
#banner a:hoover {
    text-decoration:underline;
    background:#BC6;
}
#banner a:active {
    text-decoration:underline;
    background:#BC6;
}

Tipps und Tricks v0.18

Per Default ist der Editieren-Button ganz am Ende des linken Bereiches. Das ist insbesondere bei kurzen Seiten blöd, weil er sich dann nämlich mit den Einträgen auf der linken Seite überschneidet. Deshalb habe ich es so gemacht, dass er immer oben unter der Navigation platziert wird. Dazu habe ich den entsprechenden Eintrag in display_body.html auskommentiert und statt dessen in display_header.html (am Ende von <div id="banner">) eingefügt. Der Abschnitt, um den es geht, lautet:

[% IF is_editable %]
<hr />
<form class="edit">
<input type="submit" name="button-edit" value="{{EDIT}}">
[% ELSE %]
<form action="admin.cgi" class="admin">
<input type="submit" name="button-login" value="{{LOGIN}}">
[% END %]
<input type="hidden" name="action" value="edit">
<input type="hidden" name="page_id" value="[% page_id %]">
</form>

Wie kann man die Navigation auf der Linken Seite farblich gegenüber dem Rest abheben?

Ich habe dazu in css/Kwiki.css folgende Farbeintragungen für den Hintergrund vorgenommen: (Inzwischen habe ich css und Templates stark abgeändert, aber obiges ist ein guter Anfang. (Jetzt heißen die Bereiche aber teilweise anders.))

body #EF9
banner #CD7
content #EF9
blogbody #EF9

Wie kann ich verschiedene css-Layouts anbieten, zwischen denen der User wählen kann?

Diese Option war ursprünglich nicht in Kwiki 0.18, ich habe sie eingebaut. Dazu muss man allerdings mehrere Änderungen vornehmen. Ich werde diese in der umgekehrten Reihenfolge vorstellen, in der ich sie selbst entwickelt habe, weil es dann von außen vielleicht etwas klarer wird (?):

Zunächst muss im Standardlayout als letzte CSS-Datei zusätzlich die Datei geladen werden, die für das Layout zuständig ist. Dazu habe ich im Kopfbereich von display_header.html folgende Zeile eingetragen:

<link rel="stylesheet" type="text/css" href="local/css/[% wiki_layout %].css" />

(unter die anderen beiden Zeilen die Stylesheets laden).

Dann muss die Enistellungsseite um eine Auswhlbox für das Layout ergänzt werden. Dazu fügt man in die Seite prefs_body.html an geeigneter Stelle (ich hab es rechts neben den Benutzernamen plaziert) das folgende ein:

  Kwiki-Layout:  
<select size="1" name="wiki_layout">
    [% option(Oase) %]
    [% option(Ozean) %]
    [% option(Bayrisch) %]
</select>

Wie man schon sieht (falls man sich etwas auskennt), wird nun eine interne Methode option() in Template.pm erwartet.

Um nun die Dialogbox vernünftig anzuzeigen (und das gewählte Layout als selected anzuzeigen), muss man Template.pm folgendermaßen überarbeiten:

In der Methode can_call fügen wir ein:

or $function eq 'option';

Damit ist auch die Methode option() aufrufbar. Diese müssen wir jetzt natürlich noch schreiben:

sub option {
    my ($self, $optname) = @_;
    my $prefs = $self->driver->cookie->prefs;
    my $selected = $prefs->{wiki_layout} eq $optname ? ' selected' : '';
    return qq{<option$selected>$optname</option>\n};
}

Nun benötigt man Prefs.pm in der Methode pref_fields den Eintrag

wiki_layout

in das Array ein. Damit wird unter diesem Namen zusätzlich etwas in den Cookies gespeichert (natürlich wird dort unser Layout abgelegt). Das wars auch schon in deiser Datei, wenn ich nichts vergessen habe. Nur als Tipp um zu sehen, was da so vor sich geht, kann man in process die Zeile

Data::Dumper::Dumper($self->all).

vor die Ausgabe des Footers in den Return-String einbauen. Dann sieht man, was alles gespeichert ist. (Natürlich sollte man dann irgendwo in diesem Modul noch use Data::Dumper; hinschreiben.)

Damit wird nun unsere Auswahl im Cookie gespeichert.

Nun muss man natürlich noch die entsprechenden css-Dateien in local/css anlegen. In diesen sollten nur die Farben geändert werden, alle anderen Einstellungen sollte man zentral in Kwiki.css belassen. Ich zeige hier mal meine local/css/Bayrisch.css:

body {
    background:#FFF;
    color:#000;
}

a         {text-decoration: none}
a:link    {color:#00F}
a:visited {color:#009}
a:hover   {background:#DDF;}
a:active  {background:#DDF;}
a.empty   {color:gray}
a.private {color:black}

#hauptl a:hover, #hauptl a:active {
    background:#BBF;
}

h1, h2, h3, h4, h5, h6 {
    color:#00F;
}

#seitenkopf {
    background:#AAF;
    color:#000;
}

#hauptl {
    background:#DDF;
    color:#000;
}
#hauptr {
    background:#FFF;
    color:#000;
}


.blogbody {
    background:#FFF;
}

div textarea {
    background:#00F;
    color:#000;
}
input, select {
    background:#00F;
    color:#000;
}
blockquote pre {
    background:#00F;
    color:#000;
}

Wenn man hier nicht alles wiedererkennt, liegt das daran, dass ich das Grundlayout ziemlich abgeändert habe. Das Prinzip sollte aber klar sein. Wer Interesse an meinem Layout hat, dem kann ich es gern zuschicken. --Christian Dühl 2004-10-24

Wie kann ich eine Druckvorschau einbauen?

Ich habe heute in mein Wiki eine Druckvorschau eingebaut durch Einbau von einem Link der Form

<a href="[% script %]?page_id=[% page_id %]&printpreview=1">Druckansicht</a>

in display_header.html (im linken Menüfeld). Dann hab ich noch mehrere

[% IF printpreview %]
[% ELSE %]
...
[% END %]

Strukturen eingebaut. Insbesondere im Headbereich:

[% IF printpreview %]
<link rel="stylesheet" type="text/css" href="local/css/Print.css" />
[% ELSE %]
<link rel="stylesheet" type="text/css" href="local/css/[% wiki_layout %].css" />
[% END %]

und schließlich eine Datei Print.css angelegt, die die Hintergründe auf weiß, die Schriften und Linkfarben auf schwarz und die Schriftdekoration der Links auf unterstrichen setzt. -- Christian Dühl 16.02.2005

Wie bekomme ich kwiki unter Win XP installiert?

Ich versuche mich derzeit geraden an einer kwiki0.33 Installation unter wxp (man möge es mir verzeihen), aber leider bekomme ich bei dem versuch kwiki -new cgi-bin/kwiki aufzurufen eine Fehlermeldung, dass er den Befehl kwiki nicht findet oder fehlerhaft ist. --Mario Schröder


Siehe Hilfe, Kwiki Fragen Und Antworten, Kwiki Diskussion

Username: