Jede beliebige Schriftart in die Webseite einbinden, irgendwo hängts

Hallo,
ich hänge gerade an dem Versuch, eine eigene Schriftart in die Website einzubinden.
Hat damit schon jemand Erfahrung? Es sollte eigentlich ganz einfach sein, doch ich weiss nicht, wie ich das folgende aus dem Tutorial in mein css umsetzen muss:

Link zum relativ kurzen Tutorial:

Ich habe die beiden Dateien “typeface-0.15.js” und meine Schrift “meineSchrift_regular.typeface.js” im Theme-Ordner “css” gespeichert.
2.
In die Datei _header.tpl folgendes reingeschrieben:
<script type=”text/javascript” src="[{ $oViewConf->getResourceUrl() }]typeface-0.15.js”></script>
<script type=”text/javascript” src="[{ $oViewConf->getResourceUrl() }]meineSchrift_regular.typeface.js”></script>

Hier weiss ich nicht weiter:

  1. aus Tutorial:
    <!– go ahead and specify typeface.js fonts with CSS –>
    <div class=”myclass typeface-js” style=”font-family:meineSchrift">

Wie kann ich in die oxid.css oder gezielt in der Datei “topcategories.tpl” angeben, dass er die Klasse “myclass typeface-js” und den style übernehmen soll.
MeineSchrift soll sich auf die Navigation auswirken.
Zeile 12 in Datei "topcategories.tpl:
<ul id=“navigation” class=“sf-menu”>

Hoffe auf Unterstützung.
Herzlichen Dank
Grüße, Sandra

Du musst anstatt “myclass” die gewünschte Klasse angeben - welche das ist für die Beschriftung der Topkategorien findest Du mit Firebug heraus.

Oder Du verwendest dieses Modul, das für die Beschriftung Grafiken verwendet:

aktiviert wird es mit oxoutput => sleightofhand/Sleightofhand_Oxoutput

Ich habe meine Schriftarten einfach ins css eingebunden, klappt ganz hervorragend. Nur leider nicht auf der Startseite. Hat da jemand ne Idee, woran es liegen könnte? Kommt auch bei Reload nicht, erst auf der nächsten Seite, die man betritt, völlig egal welche. :confused:

Ohne die Seite sehen/prüfen zu können, kann man nur raten…
Ich würde mal sagen fehlerhaft relativ verlinkt…

Naja, ich hab ja nur die Schriften in den css Ordner hochgeladen und ins oxid.css eingebunden. Scheinbar wird die Startseite schon aufgebaut, bevor das css gelesen wird?

Hallo!
Ihr habt vielleicht mitbekommen, dass in Österreich ein Anwalt mehrere Betreiber (lt. eigenen Angaben 10000) von Websiten mit Kostenforderungen abmahnt, weil diese GoogleFonts verwenden.
Ich habe noch die OXID-Version 4.10.8 (weil das Update auf die Version 6 für mich zu schwierig/teuer war). In welcher Datei (Flow-Theme) kann ich die Schriftarten auf lokale Fonts ändern?
Danke und LG
Michael

Moin :slight_smile:

in der komprimierten styles.min.css werden die Fonts zu Beginn referenziert flow_theme/styles.min.css at master · OXID-eSales/flow_theme · GitHub

Die OXID eSales Standard Themes arbeiten mit grunt der Ablauf um diese zu ändern kannst unter GitHub - OXID-eSales/flow_theme: OXID Flow Responsive Theme lesen oder noch einfacher kannst es Dir über Child-Theme machen und styles.min.css Datei komplett durch Deine eigene CSS-Datei ersetzen.

Danke für die Antwort!
Die styles.min.css hatte ich schon offen, jedoch kann ich “google” wenn ich danach suche nicht finden. Wird das eventuell über eine Art weiterleitung gemacht?
Ich befürchte, dass die Lösungsvorschläge meine technischen Fähigkeiten übersteigen…
Es wäre halt sehr schade, da ich wirklich viel Zeit in den Aufbau investiert habe (auch weil wegen eines Fehlers zweimal) und jetzt scheitert alles wiedereinmal an den großen Konzernen…
LG

Das kann ich nicht beantworten, weil wahrscheinlich die Version die einsetzt sehr alt und kann abweichen. Dort brauchst letztendlich professionelle Unterstützung. Wo welche findest ist unter OXID Forge – Die Knowledge Base rund um den OXID eShop vermerkt.

Hallo Michael,

der Verweis auf die Google Font ist im 4er Shop beim Flow Theme in dem Theme
in der Datei base.tpl

[{block name="base_fonts"}]
            <link href='https://fonts.googleapis.com/css?family=Raleway:200,400,700,600' rel='stylesheet' type='text/css'>
        [{/block}]

Dort kannst du die Font entweder ganz rausnehmen oder sie auf deinen Webserver kopieren und dann den Link einfach auf deinen Server zeigen lassen.
Dann ist das ganze auch nicht mehr abmahnfähig.

Viele Grüße,
(auch) Michael

1 Like

Danke an Alle die hier so hilfreich geholfen haben!!!
LG
Michael

1 Like