Seite 2 von 2: Tutorials
Seite 2 von 2
Kleine Tutorials für YOOtheme Pro
Video in voller Breite / Höhe einbinden
Um ein Video mit Flexiblen Höhen und Breiten einzubinden gibt es kleinen Trick:
- Das Video-Element an der gewünschten Stelle einfügen
- Im Video-Element unter Erweitert -> CSS muss noch der folgende Style eingefügt werden:
.el-element{position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; width: 100%; height: auto}
.el-element iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%}
Jetzt ist die Videoeinbindung Flexibel in der Höhe / Breite und im 16:9 Format.
Joomla Template "YOOtheme Pro" um eigene Schriftarten erweitern
Schritt 1 - Schrift hochladen
Als erstes muss man natürlich die Schrift im Format woff woff2 hochgeladen werden. Am besten ins Verzeichnis "templates/yootheme/fonts"
Schritt 2 - Schrift im ins Theme Laden
Als nächstes muss die Schrift in das Theme geladen werden, dazu geht man in der Administration auf "Erweiterungen -> Templates -> NAME_DES_YOOTHEME_TEMPLATES
wird einfach des Theme im Customizer öffnen und unter "Einstellungen-> Benutzerdefinierter Code -> CSS/LESS". In das Feld muss dann an erster Stelle ein Code wie der folgende eingefügt werden:
@font-face {
font-family: 'SCHRIFTNAME';
src: url('../fonts/DATEINAME1.woff2') format('woff2'), url('../fonts/DATEINAME2.woff') format('woff');
}
Hinweis: Den Schriftnamen erhält man vom Herausgeber der Schrift bzw. der Quelle von der man sie bezogen hat.
Achtung! Es dürfen keine vorhandenen Dateien überschrieben werden, da diese bei einem Update sonst zurückgesetzt werden.
Schritt 3 - Auswählen der Schrift
Als letzter Schritt muss nun die Schrift noch in den Einstellungen des Themes ausgewählt werden. Zum Auswählen der Schrift geht man unter "Styles -> Global" oder in die gewünschte Komponente. Im Feld "FontFamily" trägt man dann den SCHRIFTNAMEN ein und drückt "Enter".
Weiterführende Informationen
