Google Fonts: Unterschied zwischen den Versionen

Aus Mediawiki Ferdinand Gruber
Zur Navigation springen Zur Suche springen
K
K
Zeile 5: Zeile 5:
 
https://google-webfonts-helper.herokuapp.com/
 
https://google-webfonts-helper.herokuapp.com/
  
Hier kann man einen oder mehrere Google Fonts downloaden.
+
Hier kann man einen oder mehrere Google Fonts downloaden und den notwendigen CSS Code direkt von der Seite kopieren.
: Joomla: Dateien im Template im Verzeichnis <tt>fonts</tt> speichern.
 
Auf der Seite wird ein CSS Code angezeigt, den man kopiert und in die CSS Datei der Seite einfügt.
 
  
== Open Sans Condensed ==
+
Joomla:
 +
: Die Font-Dateien werden im Template im Verzeichnis <tt>fonts</tt> gespeichert.
 +
Der CSS Code wird in die CSS-Datei des Templates eingefügt - am besten in <tt>costum.css</tt>
 +
 
 +
== Troubles ==
 +
=== Open Sanc Condensed ===
 
Der Font <tt>Open Sans Condensed" wird auf obiger Seite nicht angeboten. Dieser Font wird aber z.B. in dem Joomla Template '''Phoca-gweld''' verwendet.
 
Der Font <tt>Open Sans Condensed" wird auf obiger Seite nicht angeboten. Dieser Font wird aber z.B. in dem Joomla Template '''Phoca-gweld''' verwendet.
  

Version vom 2. September 2022, 19:55 Uhr

Das Einbinden von Google Fonts in eine Website ist (anscheinend) nicht mehr datenschutzkonform, da die IP-Adresse des Benutzers an Google übermittelt wird.

Man kann die Google Fonts auch über den eigenen Webspace in die Seite einbinden. Folgende Seite hilft dabei:

https://google-webfonts-helper.herokuapp.com/

Hier kann man einen oder mehrere Google Fonts downloaden und den notwendigen CSS Code direkt von der Seite kopieren.

Joomla:

Die Font-Dateien werden im Template im Verzeichnis fonts gespeichert.

Der CSS Code wird in die CSS-Datei des Templates eingefügt - am besten in costum.css

Troubles

Open Sanc Condensed

Der Font Open Sans Condensed" wird auf obiger Seite nicht angeboten. Dieser Font wird aber z.B. in dem Joomla Template Phoca-gweld verwendet.

Diesen Font habe ich hier als TTF Datei gefunden: https://www.fontsquirrel.com/fonts/open-sans-condensed

Man kann die Datei in das Format WOFF konvertieren auf folgender Seite: https://convertio.co/de/ttf-woff/

Der CSS Code (für Joomla) lautet dann:

@font-face {
   font-family: 'Open Sans Condensed';
   src: url('../fonts/OpenSans-CondLight.woff') format('woff');
}

Nun kann diese Schrift per CSS verwendet werden wie im folgenden Beispiel in der Datei index.php im Joomla Template:

.navbar-nav {
   font-family: 'Open Sans Condensed', sans-serif;
   font-size: 120%;
   text-transform:uppercase;
}