Webfonts in Honeygrid

Thema wurde von svenmoss, 11. März 2016 erstellt.

  1. svenmoss

    svenmoss Mitglied

    Registriert seit:
    8. Mai 2013
    Beiträge:
    6
    Danke erhalten:
    0
    #1 svenmoss, 11. März 2016
    Hallo,
    ich möchte im Honeygrid eine Schriftart (Webfont) verwenden, bei der es sich nicht um ein Google-Font handelt. Meine Versuche diese über StyleEdit 3 mit eigenem CSS einzubinden sind bisher gescheitert.
    Auch in den Artikeldetails möchte ich diese Schriftarten auswählen können.
    Hat jemand eine Idee wie das funktionieren könnte?
     
  2. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    16. Januar 2016
    Beiträge:
    656
    Danke erhalten:
    115
    Danke vergeben:
    20
    #2 Anonymous, 11. März 2016
    Bevor du solche Schriftarten verwenden kannst, musst du diese entweder im <header> mit

    Code:
    <link href="url_zu_dem_font">
    oder in der CSS

    Code:
    @import url(url_zu_dem_font);
    abrufen/importieren.

    Danach kannst du loslegen mit font-family{usw..} in der CSS.
     
  3. svenmoss

    svenmoss Mitglied

    Registriert seit:
    8. Mai 2013
    Beiträge:
    6
    Danke erhalten:
    0
    #3 svenmoss, 11. März 2016
    Habe jetzt folgendes in die "eigene CSS" im StyleEdit 3 eingefügt:

    @import url(MyFontsWebfontsKit.css);

    .ProximaNovaA-Bold {
    font-family: ProximaNovaA-Bold;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaS-Bold {
    font-family: ProximaNovaS-Bold;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNova-Bold {
    font-family: ProximaNova-Bold;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaA-Extrabld {
    font-family: ProximaNovaA-Extrabld;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaS-Extrabld {
    font-family: ProximaNovaS-Extrabld;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNova-Extrabld {
    font-family: ProximaNova-Extrabld;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaA-Light {
    font-family: ProximaNovaA-Light;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaS-Light {
    font-family: ProximaNovaS-Light;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNova-Light {
    font-family: ProximaNova-Light;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaA-LightIt {
    font-family: ProximaNovaA-LightIt;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaS-LightIt {
    font-family: ProximaNovaS-LightIt;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNova-LightIt {
    font-family: ProximaNova-LightIt;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaA-Regular {
    font-family: ProximaNovaA-Regular;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaS-Regular {
    font-family: ProximaNovaS-Regular;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNova-Regular {
    font-family: ProximaNova-Regular;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaA-Semibold {
    font-family: ProximaNovaA-Semibold;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaS-Semibold {
    font-family: ProximaNovaS-Semibold;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNova-Semibold {
    font-family: ProximaNova-Semibold;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaA-SemiboldIt {
    font-family: ProximaNovaA-SemiboldIt;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNovaS-SemiboldIt {
    font-family: ProximaNovaS-SemiboldIt;
    font-weight: normal;
    font-style: normal;
    }
    .ProximaNova-SemiboldIt {
    font-family: ProximaNova-SemiboldIt;
    font-weight: normal;
    font-style: normal;
    }


    Die MyFontsWebfontsKit.css liegt im Hauptverzeichnis und sieht auszugsweise so aus:

    @import url("//hello.myfonts.net/count/30945e");


    @font-face {font-family: 'ProximaNovaA-Bold';src: url('webfonts/30945E_0_0.eot');src: url('webfonts/30945E_0_0.eot?#iefix') format('embedded-opentype'),url('webfonts/30945E_0_0.woff2') format('woff2'),url('webfonts/30945E_0_0.woff') format('woff'),url('webfonts/30945E_0_0.ttf') format('truetype');}

    @font-face {font-family: 'ProximaNovaS-Bold';src: url('webfonts/30945E_1_0.eot');src: url('webfonts/30945E_1_0.eot?#iefix') format('embedded-opentype'),url('webfonts/30945E_1_0.woff2') format('woff2'),url('webfonts/30945E_1_0.woff') format('woff'),url('webfonts/30945E_1_0.ttf') format('truetype');}

    @font-face {font-family: 'ProximaNova-Bold';src: url('webfonts/30945E_2_0.eot');src: url('webfonts/30945E_2_0.eot?#iefix') format('embedded-opentype'),url('webfonts/30945E_2_0.woff2') format('woff2'),url('webfonts/30945E_2_0.woff') format('woff'),url('webfonts/30945E_2_0.ttf') format('truetype');}

    richtig?