Einsatzleiterwiki

Das elektronische Einsatzleiterhandbuch

Benutzer-Werkzeuge

Webseiten-Werkzeuge


wiki:hilfe:plugins:standard:wrap

Auf dieser Seite sehen Sie die schreibgeschützte und geprüfte Version eines Artikels aus dem Einsatzleiterwiki-Projekt. Wenn Sie einen Artikel bearbeiten bzw. am Projekt aktiv mitarbeiten möchten, so besuchen Sie bitte das bearbeitbare Wiki. Für weitere Informationen zum Projekt allgemein rufen Sie bitte diese Seite auf.

wrap-Plugin: weitergehende Gestaltungsmöglichkeiten

Das Wrap-Plugin bietet weitergehende Gestaltungsmöglichkeiten gegenüber dem Standard-DokuWiki-Editor bzw. dem CKG-Editor. Das wrap-Plugin ist in der Standardinstallation des Einsatzleiterwikis bereits enthalten und kann genutzt werden.

Beachten Sie, dass die auf dieser Seite genannten Kommandos im ckgedit-Editor nicht direkt angezeigt und erst nach dem Speichern sichtbar werden. Daher empfiehlt sich für die Nutzung dieser Kommandos die Nutzung des Standard-DokuWiki-Editors, da hier mit einem Klick auf den Vorschau-Button die Seite bereits so angezeigt werden kann, wie sie nach dem Speichern aussehen wird.

Grundlegender Syntax

Ein großgeschriebenes <WRAP> erzeugt ein sogenanntes div und sollte für große Boxen, komplette Absätze, Listen, Tabellen, etc. genutzt werden.

<WRAP weitere_Optionen Breite>
"größerer" Inhalt
</WRAP>

Ein kleingeschriebenes <wrap> erzeugt ein sogenannten span und sollte für kleine Boxen, einzelne Worte in Absätzen, Listen, Tabellen, etc. genutzt werden.

<wrap weitere_Optionen Breite>"kleinerer" Inhalt</wrap>

:!: Beachten Sie, dass nicht alle unten genannten Funktionen mit kleingeschriebenem wrap funktionieren:

  • Ausrichtungen (links, mittig, rechts)
  • mehrspaltige Layouts
  • und Breitenangaben

wenn das zugehörige wrap nicht ebenfalls umflossen wird.

Klassen und Stile

Spalten und Umfließungen

Sie können Spalten erstellen, indem Sie einfach die Klasse (das Kommando) column und eine Breite angeben:

<WRAP column 30%>...Inhalt...</WRAP>

Dieser Text befindet sich in der ersten Spalte von drei Spalten mit jeweils 30% Breite.

Dieser Text befindet sich in der zweiten Spalte von drei Spalten mit jeweils 30% Breite.

Dieser Text befindet sich in der dritten Spalte von drei Spalten mit jeweils 30% Breite.

<WRAP column 30%>
Dieser Text befindet sich in der **ersten** Spalte von drei Spalten mit jeweils 30% Breite.
</WRAP>

<WRAP column 30%>
Dieser Text befindet sich in der **zweiten** Spalte von drei Spalten mit jeweils 30% Breite.
</WRAP>

<WRAP column 30%>
Dieser Text befindet sich in der **dritten** Spalte von drei Spalten mit jeweils 30% Breite.
</WRAP>

Verschiedene Umfließungen

Normalerweise ist die Angabe column ausreichend, aber für anspruchsvollere Zwecke (nicht nur für Spalten sondern auch für andere Klassen wie Boxen und Notizen) gibt es verschiedene Arten für Umfließungen:

  • column bewirkt das selbe wie left
  • left wird den WRAP-Block auf die linke Seite positionieren und den weiteren Inhalt rechts daneben platzieren
  • right wird den WRAP-Block auf die rechte Seite positionieren und den weiteren Inhalt links daneben platzieren
  • center wird den WRAP-Block horizontal mittig zentrieren

Breiten

Sie können eine beliebige gültige Breitenanangabe nutzen (aber nur bei WRAP). Gültige Breitenangaben können in folgenden Maßeinheiten angegeben werden: %, px, em, ex, pt, pc, cm, mm, in. Die meistgenutzten Abgaben sind:

MaßeinheitWertBeschreibung
%30%passt sich dynamisch an
px420pxdefiniert eine feste Breite
em20empasst sich ebenfalls dynamisch an, allerdings in Abhängigkeit der Schriftgröße

Eine Tabelle innerhalb einer Spalte oder WRAP-Box nimmt immer die volle Breite ein. Somit können mit diesen Breitenangaben indirekt Tabellen ausgerichtet und formatiert werden.</WRAP>

Wenn der Text nach der Benutzung der Umfließungen wieder normal angezeigt werden und nicht mehr das vorher definierte Objekt umfließen soll, dann platzieren Sie ein…

<WRAP clear></WRAP>

nach der letzten Spalte/Box.

Diese Optionen können auch mit mit einem kleinen wrap genutzt werden (mit allen Elementen die umflossen werden können), ggf. macht die Anwendung allerdings nicht viel Sinn. :!: Breitenangaben funktionieren je nach Design üblicherweise nicht.

:!: Achtung: Breitenangaben können Probleme verursachen, werden oftmals unterschiedlich in verschiedenen Browsern aussehen und teilweise sogar das Layout zerstören. Wenn Sie kein Webdesigner sind werden Sie die Gründe für eine fehlerhafte Darstellung durch den Internet-Explorer eventuell nicht verstehen. Testen Sie die Angaben für Ihre Spalten einfach in allen gängigen Browsern und machen Sie die Breitenangaben etwas schmaler als sie eigentlich sein sollen um das Problem versuchen zu umgehen.

Alle diese Optionen funktionieren auch in den Boxen und Notizen (siehe unten).

Mehrspaltigkeit

Alle modernen Browser (Firefox, Chrome, Safari, …) unterstützen Mehrspaltigkeit. Schreiben Sie einfach col2 für 2 Spalten, col3 für 3 Spalten, col4 für 4 Spalten und col5 für 5 Spalten.

:!: Anmerkung: Mehrspaltigkeit macht bei kleingeschriebenen wraps keinen Sinn.

<WRAP col3>
Alle modernen Browser (Firefox, Chrome, Safari, ...) unterstützen Mehrspaltigkeit. Schreiben Sie einfach **''%%col2%%''** für 2 Spalten, **''%%col3%%''** für 3 Spalten, **''%%col4%%''** für 4 Spalten und **''%%col5%%''** für 5 Spalten.

:!: Anmerkung: Mehrspaltigkeit macht bei kleingeschriebenen ''wrap''s keinen Sinn.
</WRAP>

Ausrichtungen

Sie können diese verschiedenen Ausrichtungen nutzen:

  • leftalign → linksbündig
  • rightalign → rechtsbündig
  • centeralign → zentriert
  • justify → Blocksatz

Zentrierter Text…

… rechtsbündiger Text.

<WRAP centeralign>
Zentrierter Text...
</WRAP>

<WRAP rightalign>
... rechtsbündiger Text.
</WRAP>

:!: Ausrichtungen können nicht bei kleinen wraps verwendet werden.

Boxen und Anmerkungen

round box 570px center

  • box erzeugt einen Kasten um das WRAP-Element herum
  • Bei der Nutzung einer der Klassen info, tip, important, alert, help, download, todo erhält der Kasten eine entsprechende Färbung mit einem dazugehörigen Symbol
  • Die Klassen danger, warning, caution, notice, safety erzeugen Kästen mit Signalfarben (ohne entsprechendes Symbol)
  • Zusätzlich kann round hinzugefügt werden, um die Ecken des Kastens abzurunden. Dies funktioniert in allen modernen Browsern (Firefox, Chrome, Safari, …), nicht aber dem Internet Explorer.

Info

<WRAP info></WRAP>

Tip

<WRAP tip></WRAP>

Important

<WRAP important></WRAP>

Alert

<WRAP alert></WRAP>

Help

<WRAP round help></WRAP>

Download

<WRAP download></WRAP>

Todo

<WRAP todo></WRAP>

Kästen mit Signalfarben:

Danger

<WRAP danger></WRAP>

Warning

<WRAP warning></WRAP>

Caution

<WRAP caution></WRAP>

Notice

<WRAP round notice></WRAP>

Safety

<WRAP round safety></WRAP>

Die Hinweisboxen können ebenfalls in einer kleinen Variante im Fließtext eingesetzt werden:

info, help, alert, important, tip, download, todo und round box und danger, warning, caution, notice, safety.

<wrap info>info</wrap>, <wrap help>help</wrap>, ...

Markierungen

Sie können Text als hervorgehoben, weniger wichtig und besonders hervorgehoben markieren.

Sie können Text als <wrap hi>hervorgehoben</wrap>, <wrap lo>weniger wichtig</wrap> und <wrap em>besonders hervorgehoben</wrap> markieren.

Verschiedenes

Einrückungen

Dieser Text wird eingerückt.

<wrap indent>Dieser Text wird eingerückt.</wrap>

Outdent

Dieser Text wird „ausgerückt“.

<wrap outdent>Dieser Text wird "ausgerückt".</wrap>

Vorformatierter Text

Text in diesem Block wird umgebrochen, obwohl alle Worte in einer Reihe stehen.
<WRAP prewrap 250px>
<code>
Text in diesem Block wird umgebrochen, obwohl alle Worte in einer Reihe stehen.
</code>
</WRAP>

Spoiler

Mit der Spoiler-Funktion kann Text versteckt werden, der erst durch Markieren mit der Maus sichtbar wird. Diese Funktion ist für die Nutzung im Einsatzleiterwiki eher nicht angebracht, wird aber der Vollständigkeit halber mit aufgeführt.

Es folgt der Spoiler: Dieser Text wird erst nach Markieren mit der Maus sichtbar.

Es folgt der Spoiler: <wrap spoiler>Dieser Text wird erst nach Markieren mit der Maus sichtbar.</wrap>

Verstecken

Der folgende Text ist versteckt: Dieser Abschnitt muss überarbeitet werden.

Der folgende Text ist versteckt: <wrap hide>Dieser Abschnitt muss überarbeitet werden.</wrap>

:!: Achtung: Der Text ist nur in der direkten Anzeige versteckt. Beim Ansehen des Quelltextes der Seite oder beim Bearbeiten ist dieser trotzdem sichtbar, wird in älteren Browser angezeigt und durch die Suchfunktion gefunden. Verstecken Sie keine sicherheitsrelevanten Inhalte mittels dieser Funktion!

Seitenumbruch

Das folgende Kommando erzeugt einen Seitenumbruch:

Das folgende Kommando erzeugt einen Seitenumbruch: <WRAP pagebreak></WRAP>

Dies hat keine Auswirkung auf die Anzeige auf dem Bildschirm. Lediglich beim Ausdrucken des Artikels wird ein Seitenumbruch erzeugt.

Kein Seitenumbruch

Das folgende Kommando wird versuchen einen Seitenumbruch zu vermeiden:

Ein langer Text, oder z.B. eine Tabelle, die nicht umgebrochen werden soll.

Das folgende Kommando wird versuchen einen Seitenumbruch zu vermeiden: <WRAP nopagebreak>Ein langer Text, oder z.B. eine Tabelle, die nicht umgebrochen werden soll.</WRAP>

Dies hat ebenfalls keine Auswirkung auf die Anzeige auf dem Bildschirm. Lediglich beim Ausdrucken des Artikels wird versucht einen Seitenumbruch zu vermeiden.

Nicht drucken

Dieser Text erscheint auf dem Bildschirm, erscheint aber nicht auf einem Ausdruck.

<wrap noprint>Dieser Text erscheint auf dem Bildschirm, erscheint aber nicht auf einem Ausdruck.</wrap>

Nur drucken

Dieser Text erscheint nicht auf dem Bildschirm, nur auf einem Ausdruck.

<wrap onlyprint>Dieser Text erscheint nicht auf dem Bildschirm, nur auf einem Ausdruck.</wrap>

Kombinieren und Verschachteln

Sie können alle Klassen und Kasten-Arten kombinieren und ineinander verschachteln, z.B.

Äußerer grüner Kasten wird rechts positioniert und links umflossen

Innere, verschachtelter Kasten wird links positioniert und rechts umflossen. Der Text ist teilweise hervorgehoben.

Text im äußeren, rechts positionierten Kasten, aber nach dem inneren, links positionierten Kasten.

Runder „Tip“-Kasten, unter einem clear.

<WRAP box safety 350px right>
//**__Äußerer grüner Kasten wird rechts positioniert und links umflossen__**//

<WRAP 165px left>
Innere, verschachtelter Kasten wird links positioniert und rechts umflossen. Der Text ist teilweise <wrap em hi>hervorgehoben</wrap>.
</WRAP>

Text im äußeren, rechts positionierten Kasten, aber nach dem inneren, links positionierten Kasten.

<WRAP clear></WRAP>

<WRAP round tip>
Runder "Tip"-Kasten, unter einem ''clear''.
</WRAP>

</WRAP>

Quelle

Diese Website verwendet Cookies. Durch die Nutzung der Website stimmen Sie dem Speichern von Cookies auf Ihrem Computer zu. Außerdem bestätigen Sie, dass Sie unsere Datenschutzbestimmungen gelesen und verstanden haben. Wenn Sie nicht einverstanden sind, verlassen Sie die Website.Weitere Information

Diskussion

Geben Sie Ihren Kommentar ein. Wiki-Syntax ist zugelassen:
 
wiki/hilfe/plugins/standard/wrap.txt · Zuletzt geändert: 17.03.2020 21:10 von christoph_ziehr