YAML-Framework in contenido einbauen<\/h2>\n

In diesem Beitrag bekommen Sie einen praxisnahen Einblick, wie Sie das CSS-Framework YAML in das Content-Management-System contenido v4.8.15 einbinden.<\/p>\n

Lernziele<\/strong><\/p>\n

\n
Integrieren des CSS-Frameworks YAML in das Content-Management-System contenido<\/li>\n<\/ul>\n
Bearbeitungsdauer<\/strong><\/p>\n
\n
ca. 120 – 180 Minuten (Umfassende Kenntnisse mit CSS und contenido sinnvoll)<\/li>\n<\/ul>\n
Wissenswertes \u00fcber das YAML-Framework<\/strong><\/p>\n
\n
contenido Layout tauschen<\/a><\/li>\n
YAML-Framework kennenlernen<\/a><\/li>\n
YAML-Dateien hochladen<\/a><\/li>\n
YAML-Paket herunterladen<\/a><\/li>\n
Weitere Informationen<\/a><\/li>\n<\/ul>\n
<\/p>\n
<\/a><\/p>\n
Schritt 1 :: contenido Layout tauschen<\/h3>\n
Wenn Sie das YAML-Layout nutzen wollen, m\u00fcssen Sie zu Beginn das Standard-Layout wechseln. Die Grundinstallation von contenido beinhaltet zwar bereits ein einfaches Layout, aber es fehlt nat\u00fcrlich der Verweis auf das neue Stylesheet (CSS), welches sich im head-Bereich befindet.<\/p>\n
$\"contenido$ <\/p>\n
Abbildung 1<\/span>: Neues Standard-Layout f\u00fcr contenido<\/span><\/p>\n
<\/p>\n
Aufgabe: Standard-Layout in contenido austauschen!<\/strong><\/p>\n
Auf der Website von wallaby.de finden Sie die einzelnen Dateien f\u00fcr das grundlegende zwei- oder dreispaltige Standard-Layout.<\/p>\n
\n
2-spaltiges Layout<\/strong>: HTML-Datei \u2013 standard-2spaltig.html<\/a><\/li>\n
3-spaltiges Layout<\/strong>: HTML-Datei \u2013 standard-3spaltig.html<\/li>\n<\/ul>\n
Um das Layout zu tauschen, melden Sie sich als Administrator bei Ihrer Homepage www.domain.tld\/contenido an. \u00d6ffnen dort die Layout-Bearbeitung \u00fcber „Style > Layouts“ und ersetzen den kompletten Inhalt im rechten Fensterbereich bei Quelltext.<\/p>\n
$\"contenido$ <\/p>\n
Abbildung 2<\/span>: Quelltext ersetzen mit neuem Standard-Layout<\/span><\/p>\n
Falls Sie ein neues Layout erstellen, m\u00fcssen Sie die Template-Zuweisung bei \u201eStyle > Templates\u201c f\u00fcr alle Templates einzeln vornehmen.<\/p>\n
<\/p>\n
<\/a><\/p>\n
Schritt 2 :: YAML-Framework kennenlernen<\/h3>\n
Zum besseren Verst\u00e4ndnis erl\u00e4utern wir Ihnen zun\u00e4chst ein wenig den Inhalt des Download-Pakets. Dieses finden Sie auf der Homepage von www.yaml.de im Bereich \u201eDownload\u201c. Die ZIP-Datei beinhaltet neben den Dateien des Frameworks eine gut beschriebene und ziemlich umfassende Dokumentation, einige Anwendungsbeispiele und auch ein paar hilfreiche Werkzeuge zur Layoutentwicklung. Wie Sie in Tabelle 3.1 sehen, beinhaltet die Datei einige Verzeichnisse.<\/p>\n\n\n\n\n\n\n\n
Verzeichnisse<\/td>\n Beschreibung<\/td>\n<\/tr>\n
\/documentation<\/span><\/td>\n Hierin befindet sich die deutsche Dokumentation des Frameworks, die einen vollst\u00e4ndigen Abzug der Online-Dokumentation darstellt<\/span><\/td>\n<\/tr>\n
\/examples<\/span><\/td>\n Wie der Name andeutet enth\u00e4lt dieser Ordner einige Anwendungsbeispiele des YAML-Frameworks basierend auf verschiedenen Layouts.<\/span><\/td>\n<\/tr>\n
\/tools<\/span><\/td>\n In diesem Ordner liegen Werkzeuge zur Layoutentwicklung. Der Ordner-Inhalt ist f\u00fcr eine korrekte Funktion des Frameworks nicht n\u00f6tig.<\/span><\/td>\n<\/tr>\n
\/yaml<\/span><\/td>\n Das ist der eigentliche Hauptordner mit alle wichtigen Dateien des Frameworks. Im Wesentlichen sind dies komplett fertige und sofort einsatzbereite CSS-Bausteine zur Layoutgestaltung.<\/span><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
Tabelle 3.1<\/span>: Verzeichnis-Inhalte des YAML-Frameworks<\/span><\/p>\n
Der Kern des YAML-Frameworks besteht aus einer vordefinierten XHTML-Struktur und extra CSS-Dateien mit unterschiedlichsten Funktionen. Erg\u00e4nzend zu den CSS-Bausteinen beinhaltet das \/yaml-Verzeichnis noch so genannte Dateivorlagen (Drafts). Diese ben\u00f6tigen Sie sowohl f\u00fcr die Anwendung des Frameworks als auch zur Gestaltung eigener Layouts. Die Hauptaufgabe der Vorlagen ist es Ihnen den Zugang zum Framework zu erleichtern und die grunds\u00e4tzliche Arbeitsschritte zu vereinfachen.<\/p>\n
central_draft.css (wird sp\u00e4ter umbenannt in \/css\/mylayout.css) ist die zentrale Stylesheet-Datei die alle im Layout ben\u00f6tigten CSS-Bausteine mittels @import-Rule einbindet. Die Datei iehacks.css b\u00fcndelt alle relevanten layout- und strukturunabh\u00e4ngigen CSS-Anpassungen f\u00fcr die aktuellsten Versionen des Internet Explorers und ist f\u00fcr die browser\u00fcbergreifende, einheitliche und fehlerfreie Darstellung des Basislayouts verantwortlich. Im Unterverzeichnis \/yaml\/navigation finden Sie noch diverse Navigationsbausteine f\u00fcr Men\u00fcs. Das YAML-Framework liefert hierzu unterschiedliche Listennavigationen mit:<\/p>\n
\n
nav_shinybuttons<\/strong>: Horizontale Navigation<\/li>\n
nav_slidingdoor<\/strong>: Horizontale Navigation<\/li>\n
nav_vlist<\/strong>: Vertikale Navigation<\/li>\n<\/ul>\n
<\/p>\n
<\/a><\/p>\n
Schritt 3 :: YAML-Dateien hochladen<\/h3>\n
Mit unserem contenido-Layoutbeispiel geben wir Ihnen einen ersten groben Einblick in die universellen Anwendungsm\u00f6glichkeiten des Frameworks. Die f\u00fcr das Beispiel erforderlichen CSS-Bausteine finden Sie alle im Hauptordner \/yaml.<\/p>\n
Aufgabe: Dateien und Ordner \u00fcbertragen!<\/strong><\/p>\n
Kopieren Sie zun\u00e4chst den kompletten Ordner \/yaml\/ auf Ihren Webspace. Als Zielverzeichnis nutzen Sie bei contenido den Ordner \/css. Ansonsten haben Sie noch folgende Aufgaben:<\/p>\n
\n
XHTML-Quelltext<\/strong>: Die XHTML-Datei \/yaml\/markup_draft.html beinhaltet die Vorlage f\u00fcr das Standard-Layout. F\u00fcr das CMS contenido benutzen Sie bitte die von uns bereit gestellte Datei standard-layout.html. Diese Datei binden Sie unter \u201eStyle > Layouts\u201c ein.<\/li>\n
Zentrales Stylesheet<\/span>: Kopieren Sie die zentrale Stylesheet-Datei \/yaml\/central_draft.css in Ihren css-Ordner und benennen Sie die Datei um in mylayout.css.<\/li>\n
IE-Patches<\/strong>: Kopieren Sie patch_layout_draft.css (Dateivorlage) aus dem Ordner \/yaml\/patches\/ in den Ordner \/css\/mypatches\/ und vergeben Sie der Datei den Namen patch_mylayout.css.<\/li>\n
Bildschirm-Layout<\/strong>: F\u00fcr das Screenlayout finden Sie im Verzeichnis \/yaml\/screen\/ die beiden Vorlagen basemod_draft.css (zust\u00e4ndig f\u00fcr das Seitenlayout) und content_default.css (zur Gestaltung von Inhalten).<\/li>\n<\/ul>\n
Die untenstehende Grafik verdeutlicht die so entstehende Datei- und Ordner-Struktur Ihres Projekts.<\/p>\n
$\"YAML-Ordnerstruktur\"$ <\/p>\n
Abbildung 3<\/span>: Datei- und Ordner-Struktur im CSS-Ordner von contenido<\/span><\/p>\n
Der wichtige Teil der mylayout.css sieht in unserem Beispiel so aus wie in Abbildung 3.4. F\u00fcr die Ver\u00e4nderung dieser Datei und den Aufbau der Ordnerstruktur sind die mitgelieferten Beispiele in \/examples besonders hilfreich. Schauen Sie sich das ein oder andere Beispiel an, denn dadurch bekommen Sie ein Gef\u00fchl f\u00fcr die Thematik. Wer alles \u00fcbersichtlicher gestalten will, der kann genauso gut alle Dateien gleich in den \/css-Ordner kopieren, so sind diese dann auch direkt im Backend von contenido editierbar.<\/p>\n
\/* import core styles | Basis-Stylesheets einbinden *\/\r\n@import url(yaml\/core\/base.css);<\/pre>\n
\/* import screen layout | Screen-Layout einbinden *\/
\n@import url(yaml\/navigation\/nav_shinybuttons.css);
\n@import url(yaml\/navigation\/nav_vlist.css);
\n@import url(myscreen\/basemod_2col.css);
\n@import url(myscreen\/basemod_2col_left_13.css);
\n@import url(myscreen\/content_2col.css);<\/p>\n
\/* import print layout | Druck-Layout einbinden *\/
\n@import url(yaml\/print\/print_003_draft.css);<\/p>\n
Abbildung 4<\/span>: Inhalt der mylayout.css<\/span><\/p>\n
Externe CSS-Dateien binden Sie bequem im -Bereich ein. Mit layout_vertical_listnav_2col.css nutzen Sie bspw. ein zweispaltiges Layout. In style.css befinden sich die eigenen Anpassungen. Die Datei mylayout.css basiert auf den mitgelieferten Beispielen des Frameworks.<\/p>\n
<link rel=\"stylesheet\" type=\"text\/css\" href=\"css\/mylayout.css\" \/>\r\n<link rel=\"stylesheet\" type=\"text\/css\" href=\"css\/style.css\" \/>\r\n\r\n<\/pre>\n
Abbildung 5<\/span>: Einbinden externer CSS-Dateien<\/span><\/p>\n
Selbstverst\u00e4ndlich ist es dazu erforderlich vorab die YAML-Verzeichnisse samt Inhalt in den CSS-Ordner von contenido zu kopieren. Als sinnvolle Erg\u00e4nzung empfehlen wir eine Erweiterung von Dodger77 (Username im Forum). Die Datei finden Sie unten auf dieser Seite im Download-Bereich<\/a>. Mit dieser Anpassung bekommen Sie die Unterordner der Verzeichnisse \u201ecss\u201c, \u201ejs\u201c und \u201etemplates\u201c im Backend angezeigt und k\u00f6nnen dort vereinfacht die enthaltenen Dateien bearbeiten.<\/p>\n
<\/p>\n
<\/p>\n
<\/p>\n
<\/p>\n
<\/a><\/p>\n
Schritt 4 :: YAML-Paket herunterladen<\/h3>\n
\n
2-spaltiges Standard-Layout<\/a> (TXT-Datei, 1 Seite)<\/li>\n
3-spaltiges Standard-Layout (TXT-Datei, 1 Seite)<\/li>\n
Ordner in Styles-Scripts-Modul Templates<\/a> (ZIP-Datei, ca. 20 kB)<\/li>\n
YAML-Framework<\/a> (ZIP-Datei, ca. 250 kB)<\/li>\n
YAML goes contenido Anleitung<\/a> (PDF-Datei, ca. 30 Seiten, ca. 1 MB)1 Grundlegendes
\n1.1 Einf\u00fchrung
\n1.2 Vorstellungsrunde
\n1.3 \u00dcberblick
\n
\n2 Die Installation von contenido<\/span>
\n2.1 Dateien per FTP \u00fcbertragen
\n2.2 Datei-Rechte mit dem FTP-Tool setzen
\n2.3 Installationstyp ausw\u00e4hlen
\n2.4 Datenbank-Anbindung konfigurieren
\n2.5 Konfigurationsdatei „config.php“ erstellen
\n2.6 Beispielmandant anlegen
\n2.7 Konfigurationseinstellungen pr\u00fcfen
\n2.8 Erster Login im Backend
\n
\n3 YAML-Framework in contenido einbinden<\/span>
\n3.1 Standard-Layout austauschen
\n3.2 Der Inhalt des Download-Pakets
\n3.3 YAML-Verzeichnis \u00fcbertragen
\n
\n4 Grundlagen zu Cascading-Stylesheets<\/span>
\n4.1 Formateigenschaften festlegen
\n4.2 Definieren von CSS-Klassen
\n4.3 Ma\u00dfeinheiten und Farbangaben
\n4.4 Zentrale CSS-Formatierung
\n4.5 CSS-Eigenschaften festlegen<\/li>\n<\/ul>\n
<\/p>\n
<\/a><\/p>\n
Weitere Informationen<\/h3>\n
\n
YAML<\/a> – Offizielle Homepage des YAML-Frameworks<\/li>\n
contenido Tutorial<\/a> – Installation, Content-Pflege, Layout-Entwurf und Administration<\/li>\n
Internetagentur S\u00fcdtirol<\/a> –\u00a0Web- & Internetagentur<\/li>\n<\/ul>\n\n\n<\/div>\n","protected":false},"excerpt":{"rendered":"
\n
YAML-Framework in contenido einbauen In diesem Beitrag bekommen Sie einen praxisnahen Einblick, wie Sie das CSS-Framework YAML in das Content-Management-System contenido v4.8.15 einbinden. Lernziele Integrieren des CSS-Frameworks YAML in das Content-Management-System contenido Bearbeitungsdauer ca. 120 – 180 Minuten (Umfassende Kenntnisse mit CSS und contenido sinnvoll) Wissenswertes \u00fcber das YAML-Framework contenido Layout tauschen YAML-Framework kennenlernen YAML-Dateien …<\/p>\n\n<\/div>\n","protected":false},"author":2,"featured_media":0,"parent":5236,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"_links":{"self":[{"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/pages\/5234"}],"collection":[{"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/comments?post=5234"}],"version-history":[{"count":5,"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/pages\/5234\/revisions"}],"predecessor-version":[{"id":5550,"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/pages\/5234\/revisions\/5550"}],"up":[{"embeddable":true,"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/pages\/5236"}],"wp:attachment":[{"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/media?parent=5234"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

Verzeichnisse<\/td>\n	Beschreibung<\/td>\n<\/tr>\n
\/documentation<\/span><\/td>\n	Hierin befindet sich die deutsche Dokumentation des Frameworks, die einen vollst\u00e4ndigen Abzug der Online-Dokumentation darstellt<\/span><\/td>\n<\/tr>\n
\/examples<\/span><\/td>\n	Wie der Name andeutet enth\u00e4lt dieser Ordner einige Anwendungsbeispiele des YAML-Frameworks basierend auf verschiedenen Layouts.<\/span><\/td>\n<\/tr>\n
\/tools<\/span><\/td>\n	In diesem Ordner liegen Werkzeuge zur Layoutentwicklung. Der Ordner-Inhalt ist f\u00fcr eine korrekte Funktion des Frameworks nicht n\u00f6tig.<\/span><\/td>\n<\/tr>\n
\/yaml<\/span><\/td>\n	Das ist der eigentliche Hauptordner mit alle wichtigen Dateien des Frameworks. Im Wesentlichen sind dies komplett fertige und sofort einsatzbereite CSS-Bausteine zur Layoutgestaltung.<\/span><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n Tabelle 3.1<\/span>: Verzeichnis-Inhalte des YAML-Frameworks<\/span><\/p>\n Der Kern des YAML-Frameworks besteht aus einer vordefinierten XHTML-Struktur und extra CSS-Dateien mit unterschiedlichsten Funktionen. Erg\u00e4nzend zu den CSS-Bausteinen beinhaltet das \/yaml-Verzeichnis noch so genannte Dateivorlagen (Drafts). Diese ben\u00f6tigen Sie sowohl f\u00fcr die Anwendung des Frameworks als auch zur Gestaltung eigener Layouts. Die Hauptaufgabe der Vorlagen ist es Ihnen den Zugang zum Framework zu erleichtern und die grunds\u00e4tzliche Arbeitsschritte zu vereinfachen.<\/p>\n central_draft.css (wird sp\u00e4ter umbenannt in \/css\/mylayout.css) ist die zentrale Stylesheet-Datei die alle im Layout ben\u00f6tigten CSS-Bausteine mittels @import-Rule einbindet. Die Datei iehacks.css b\u00fcndelt alle relevanten layout- und strukturunabh\u00e4ngigen CSS-Anpassungen f\u00fcr die aktuellsten Versionen des Internet Explorers und ist f\u00fcr die browser\u00fcbergreifende, einheitliche und fehlerfreie Darstellung des Basislayouts verantwortlich. Im Unterverzeichnis \/yaml\/navigation finden Sie noch diverse Navigationsbausteine f\u00fcr Men\u00fcs. Das YAML-Framework liefert hierzu unterschiedliche Listennavigationen mit:<\/p>\n \n nav_shinybuttons<\/strong>: Horizontale Navigation<\/li>\n nav_slidingdoor<\/strong>: Horizontale Navigation<\/li>\n nav_vlist<\/strong>: Vertikale Navigation<\/li>\n<\/ul>\n <\/p>\n <\/a><\/p>\n Schritt 3 :: YAML-Dateien hochladen<\/h3>\n Mit unserem contenido-Layoutbeispiel geben wir Ihnen einen ersten groben Einblick in die universellen Anwendungsm\u00f6glichkeiten des Frameworks. Die f\u00fcr das Beispiel erforderlichen CSS-Bausteine finden Sie alle im Hauptordner \/yaml.<\/p>\n Aufgabe: Dateien und Ordner \u00fcbertragen!<\/strong><\/p>\n Kopieren Sie zun\u00e4chst den kompletten Ordner \/yaml\/ auf Ihren Webspace. Als Zielverzeichnis nutzen Sie bei contenido den Ordner \/css. Ansonsten haben Sie noch folgende Aufgaben:<\/p>\n \n XHTML-Quelltext<\/strong>: Die XHTML-Datei \/yaml\/markup_draft.html beinhaltet die Vorlage f\u00fcr das Standard-Layout. F\u00fcr das CMS contenido benutzen Sie bitte die von uns bereit gestellte Datei standard-layout.html. Diese Datei binden Sie unter \u201eStyle > Layouts\u201c ein.<\/li>\n Zentrales Stylesheet<\/span>: Kopieren Sie die zentrale Stylesheet-Datei \/yaml\/central_draft.css in Ihren css-Ordner und benennen Sie die Datei um in mylayout.css.<\/li>\n IE-Patches<\/strong>: Kopieren Sie patch_layout_draft.css (Dateivorlage) aus dem Ordner \/yaml\/patches\/ in den Ordner \/css\/mypatches\/ und vergeben Sie der Datei den Namen patch_mylayout.css.<\/li>\n Bildschirm-Layout<\/strong>: F\u00fcr das Screenlayout finden Sie im Verzeichnis \/yaml\/screen\/ die beiden Vorlagen basemod_draft.css (zust\u00e4ndig f\u00fcr das Seitenlayout) und content_default.css (zur Gestaltung von Inhalten).<\/li>\n<\/ul>\n Die untenstehende Grafik verdeutlicht die so entstehende Datei- und Ordner-Struktur Ihres Projekts.<\/p>\n $\"YAML-Ordnerstruktur\"$ <\/p>\n Abbildung 3<\/span>: Datei- und Ordner-Struktur im CSS-Ordner von contenido<\/span><\/p>\n Der wichtige Teil der mylayout.css sieht in unserem Beispiel so aus wie in Abbildung 3.4. F\u00fcr die Ver\u00e4nderung dieser Datei und den Aufbau der Ordnerstruktur sind die mitgelieferten Beispiele in \/examples besonders hilfreich. Schauen Sie sich das ein oder andere Beispiel an, denn dadurch bekommen Sie ein Gef\u00fchl f\u00fcr die Thematik. Wer alles \u00fcbersichtlicher gestalten will, der kann genauso gut alle Dateien gleich in den \/css-Ordner kopieren, so sind diese dann auch direkt im Backend von contenido editierbar.<\/p>\n \/* import core styles \| Basis-Stylesheets einbinden \/\r\n@import url(yaml\/core\/base.css);<\/pre>\n \/ import screen layout \| Screen-Layout einbinden \/ \n@import url(yaml\/navigation\/nav_shinybuttons.css); \n@import url(yaml\/navigation\/nav_vlist.css); \n@import url(myscreen\/basemod_2col.css); \n@import url(myscreen\/basemod_2col_left_13.css); \n@import url(myscreen\/content_2col.css);<\/p>\n \/ import print layout \| Druck-Layout einbinden *\/ \n@import url(yaml\/print\/print_003_draft.css);<\/p>\n Abbildung 4<\/span>: Inhalt der mylayout.css<\/span><\/p>\n Externe CSS-Dateien binden Sie bequem im -Bereich ein. Mit layout_vertical_listnav_2col.css nutzen Sie bspw. ein zweispaltiges Layout. In style.css befinden sich die eigenen Anpassungen. Die Datei mylayout.css basiert auf den mitgelieferten Beispielen des Frameworks.<\/p>\n <link rel=\"stylesheet\" type=\"text\/css\" href=\"css\/mylayout.css\" \/>\r\n<link rel=\"stylesheet\" type=\"text\/css\" href=\"css\/style.css\" \/>\r\n<!--[if lte IE 7]>\r\n <link rel=\"stylesheet\" type=\"text\/css\" href=\"css\/mypatches\/patch_vertical_listnav_2col.css\" \/>\r\n <link rel=\"stylesheet\" type=\"text\/css\" href=\"css\/mypatches\/patch_2col_left_13.css\" \/>\r\n<![endif]-->\r\n<\/pre>\n Abbildung 5<\/span>: Einbinden externer CSS-Dateien<\/span><\/p>\n Selbstverst\u00e4ndlich ist es dazu erforderlich vorab die YAML-Verzeichnisse samt Inhalt in den CSS-Ordner von contenido zu kopieren. Als sinnvolle Erg\u00e4nzung empfehlen wir eine Erweiterung von Dodger77 (Username im Forum). Die Datei finden Sie unten auf dieser Seite im Download-Bereich<\/a>. Mit dieser Anpassung bekommen Sie die Unterordner der Verzeichnisse \u201ecss\u201c, \u201ejs\u201c und \u201etemplates\u201c im Backend angezeigt und k\u00f6nnen dort vereinfacht die enthaltenen Dateien bearbeiten.<\/p>\n <\/p>\n <\/p>\n <\/p>\n <\/p>\n <\/a><\/p>\n Schritt 4 :: YAML-Paket herunterladen<\/h3>\n \n 2-spaltiges Standard-Layout<\/a> (TXT-Datei, 1 Seite)<\/li>\n 3-spaltiges Standard-Layout (TXT-Datei, 1 Seite)<\/li>\n Ordner in Styles-Scripts-Modul Templates<\/a> (ZIP-Datei, ca. 20 kB)<\/li>\n YAML-Framework<\/a> (ZIP-Datei, ca. 250 kB)<\/li>\n YAML goes contenido Anleitung<\/a> (PDF-Datei, ca. 30 Seiten, ca. 1 MB)1 Grundlegendes \n1.1 Einf\u00fchrung \n1.2 Vorstellungsrunde \n1.3 \u00dcberblick \n \n2 Die Installation von contenido<\/span> \n2.1 Dateien per FTP \u00fcbertragen \n2.2 Datei-Rechte mit dem FTP-Tool setzen \n2.3 Installationstyp ausw\u00e4hlen \n2.4 Datenbank-Anbindung konfigurieren \n2.5 Konfigurationsdatei „config.php“ erstellen \n2.6 Beispielmandant anlegen \n2.7 Konfigurationseinstellungen pr\u00fcfen \n2.8 Erster Login im Backend \n \n3 YAML-Framework in contenido einbinden<\/span> \n3.1 Standard-Layout austauschen \n3.2 Der Inhalt des Download-Pakets \n3.3 YAML-Verzeichnis \u00fcbertragen \n \n4 Grundlagen zu Cascading-Stylesheets<\/span> \n4.1 Formateigenschaften festlegen \n4.2 Definieren von CSS-Klassen \n4.3 Ma\u00dfeinheiten und Farbangaben \n4.4 Zentrale CSS-Formatierung \n4.5 CSS-Eigenschaften festlegen<\/li>\n<\/ul>\n <\/p>\n <\/a><\/p>\n Weitere Informationen<\/h3>\n \n YAML<\/a> – Offizielle Homepage des YAML-Frameworks<\/li>\n contenido Tutorial<\/a> – Installation, Content-Pflege, Layout-Entwurf und Administration<\/li>\n Internetagentur S\u00fcdtirol<\/a> –\u00a0Web- & Internetagentur<\/li>\n<\/ul>\n\n\n<\/div>\n","protected":false},"excerpt":{"rendered":" \n YAML-Framework in contenido einbauen In diesem Beitrag bekommen Sie einen praxisnahen Einblick, wie Sie das CSS-Framework YAML in das Content-Management-System contenido v4.8.15 einbinden. Lernziele Integrieren des CSS-Frameworks YAML in das Content-Management-System contenido Bearbeitungsdauer ca. 120 – 180 Minuten (Umfassende Kenntnisse mit CSS und contenido sinnvoll) Wissenswertes \u00fcber das YAML-Framework contenido Layout tauschen YAML-Framework kennenlernen YAML-Dateien …<\/p>\n\n<\/div>\n","protected":false},"author":2,"featured_media":0,"parent":5236,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"_links":{"self":[{"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/pages\/5234"}],"collection":[{"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/comments?post=5234"}],"version-history":[{"count":5,"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/pages\/5234\/revisions"}],"predecessor-version":[{"id":5550,"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/pages\/5234\/revisions\/5550"}],"up":[{"embeddable":true,"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/pages\/5236"}],"wp:attachment":[{"href":"https:\/\/wallaby.de\/news\/wp-json\/wp\/v2\/media?parent=5234"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}