Vorlage:Card

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Erstellt Cards in einer Card-Liste.

Wichtig: Immer in {{Cards|...}}-Vorlage einsetzen!

Kopiervorlage mit den häufigen Parametern:

  {{Card|
    link...|                <<- Pflicht, Wikiseite auf die die Card verweist
    titel=...|              <<- Sollte genutzt werden, kann bei Vollbild-Card entfallen
    icon=...|               <<- Optional, Name der Bilddatei für ein Icon (ohne Datei:)
    neu=jjjjmmtt|           <<- Optional, jjjjmmtt=Tag an dem die Card hinzugefügt wurde
    ...                     <<- Inhalt. Ggf. ein 1= voranstellen, wenn ein = Zeichen enthalten ist
  }}

Infos zu Inhalt und Card-Bild siehe unten. Implementierung dieser Dokumentation ist zur Zeit nur im Testwiki!

  • Ein längerer, umbrechender Card-Titel

    Dies ist eine Dummy Card mit Decklink

  • Der richtige Code-Editor
    Webprojekte-edit.svg
  • Transform
    mit CSS
    drehen,
    skalieren, schräg
    stellen und
    verschieben
  • Bilder im Internet
    • Bilder mit CSS formatieren
    • Bilder präsentieren
    • Bildwechsler
    Landscape.svg
  • Schachtelung von Regeln




    CSS Präprozessoren, nehmt euch in Acht!

Parameter für die Card-Vorlage

titel
für die Überschrift
icon
setzt das Bild als Float rechts neben die Kartenüberschrift, mit 35% der Card-Breite.
Anzugeben ist der Name der Bilddatei im Wiki, ohne Datei: davor!
logo
Setzt einen leeren Container als Float rechts neben die Kartenüberschrift. Der Inhalt kann frei gestaltet werden (Beispiel: Card für CSS-Nesting)
link
gibt an, auf welche Wiki-Seite die Card verlinken soll. Der Link überdeckt die ganze Karte! Links im Karteninhalt sind unzulässig.
hintergrund
Setze einen Hintergrund (background-Eigenschaft). Das Setzen eines Hintergrundes aktiviert auch das Setzen der Vordergrundfarbe!
neu
Markiert eine Card als neu. Als Wert kann eine Datumsangabe gesetzt werden (Format bitte JJJJMMTT, kann die Vorlage nicht prüfen), damit man weiß, von wann die Neuigkeit ist. Das Seiten-JS **könnte** "neu" Cards, die nicht mehr neu sind, von der neu Klasse befreien. Man könnte auch automatisch eine Kategorie "Neu-JJJJMMTT" erzeugen und damit auf Altlastenjagd gehen.
zeilen
Anzahl der Zeilen im Grid, die die Card einnehmen soll. Default ist 1
spalten
Anzahl der Spalten im Grid, die die Card einnehmen soll. Default ist 1

Der eigentliche Card-Inhalt wird als Positionsparameter 1 eingetragen. Ein Bild, das die Card-Breite ausfüllen soll, muss zwingend mit der Vorlage {{Card/Bild|...}} eingebunden werden. Diese Vorlage sorgt dafür, dass das Bild keinen Link erzeugt und bietet die Option "vollbild", womit der Titelbereich über das Bild gelegt wird. Mit {{Card/Bild|...|schiebe=2em}} erhält das Bild einen negativen margin-top und wird in den Hintergrund gelegt, womit eine teilweise Überlappung von Inhalt und Bild möglich ist.