tibi-docs/api/collections/fields/content.yml

113 lines
4.4 KiB
YAML

# Der Name des Feldes ist natürlich beliebig wählbar.
name: content
# "string" als Datentyp ist zwingend.
type: string
meta:
label:
de: Inhalt
en: content
# Die Bezeichnung des ContentBuilder-Widgets ist "contentbuilder".
widget: contentbuilder
# Die Anzeige des ContentBuilder im tibi-admin geschieht innerhalb
# eines iframes. Das ist notwendig, da der ContentBuilder eigene
# Styles mitbringet, die sich nicht mit den Styles des tibi-admin
# vermischen sollten.
# Via "baseHref" wird der <base>-Tag im iframe gesetzt.
# somit können alle relativen Pfade im ContentBuilder (z.B. Bilder)
# aufgelöst werden.
# Wie man hier sieht, ist die Angabe via "eval" mittels möglich.
# Der Kontext ist auf Feldebene, wie bei "dependsOn" und "defaultValue".
# Alternativ kann die Angabe auch direkt als String erfolgend.
# Dann natürlich ohne die Evaluierung der Variable "$projectBase", wie hier.
baseHref:
eval: $projectBase
# Sollen weitere CSS-Datei in das iframe geladen werden, können diese
# hier aufgelistet werden.
# Die Angabe kann direkt als Array erfolgen oder via "eval", dessen
# Code das Array der Strings mit den Dateipfaden zurückgibt.
# Auch zu beachten ist hier die relative Angabe. Da "baseHref" gesetzt
# ist, wird der Pfad relativ zu dieser Projekt-Basis innerhalb des
# tibi-server aufgelöst.
# Die Auslieferung der CSS-Dateien direkt über den tibi-server kann
# nur funktionieren, wenn "_dist_" in der "assets" Konfiguration der
# "config.yml" definiert ist.
cssHref:
- _/assets/_dist_/index.css
# Um eine Kollektion stellvertretend als Mediathek anzubinden, sind die
# Angaben unter "imageSelect", "fileSelect" und "videoSelect" zu tätigen.
# "imageSelect" betrifft die Einbindung von Bildern, "fileSelect" die
# Einbindung von Dateien, "videoSelect" die Einbindung von Videos.
imageSelect:
# Die Angabe "collection" ist zwingend. Hier wird die Kollektion
# definiert, die als Sammlung für die Bilder/Datei dient.
# Der Aufbau der Kollektion ist dabei frei, solange ein Upload-Feld
# für die Dateien existiert, welches die URL zur Datei zurückgibt.
collection: medialib
# Optional kann ein Filter und View für die Einbindung der Bilder/Dateien
# definiert werden. Dies geschieht über einen "subNavigation"
# Eintrag innerhalb des "meta.subNavigation" Arrays, der Kollektion
# (hier bei "medialib").
# Die Angabe hier ist die auszuwählende Navigation per Index des Arrays.
subNavigation: 0
fileSelect:
collection: medialib
subNavigation: 0
videoSelect:
collection: medialib
subNavigation: 0
# "customTags" des ContentBuilder können verwendet werden um die Einbindung
# von Modulen ins HTML zu ermöglichen.
# Die folgende Auflistung ist dabei ein Beispiel für ein Modul.
customTags:
- # Der Platzhalter wird 1:1 ins HTML übernommen und ist dabei frei
# definierbar.
# Die eigentliche Funktion eines Modul-Systems muss dann später
# im Frontend implementiert werden.
placeholder: "<my-module class='tibi-module' title='Titel' description='Beschreibung'>Mein Modul</my-module>"
# Die Benennung für die UI des ContentBuilder geschieht über die
# "label" Angabe, die mehrsprachig erfolgen kann.
label:
de: "Mein Modul"
en: "My Module"
# Um direkt Style-Angaben in das iframe des ContentBuilder zu übernehmen,
# werden diese hier angegeben.
# Natürlich ist auch hier wieder die Angabe via "eval" möglich.
# Nachfolgendes Beispiel erzeugt im ContentBuilder eine deutliche Darstellung
# des eingebundenen Moduls.
style: |
/*css*/
.tibi-module {
padding: 10px;
border: 3px dashed #c4c4c4;
display: block;
text-align: center;
font-size: 14px;
color: black;
}
.tibi-module::before {
content: "\1F5BD ";
font-size: 16px;
color: black;
}
.tibi-module::after {
content: " title=\"" attr(title) "\" description=\"" attr(description) "\"";
font-size: 10px;
color: #555;
display: block;
padding-top: 5px;
}
/*!css*/