Font Selector ist eine einfach zu verwendende Schriftauswahl, die Ihr nationales Auswahlelement durch eine Dropdown -Font -Vorschau -Funktionalität ersetzt.
Sie können die Schriftarten überall hosten, wo Sie möchten. Schriftart Selector ist nicht an Google -Schriftarten gekoppelt. Sie haben also keine Probleme in Bezug auf die DSGVO.
Schriftart Selector ist in SCSS und streng typisiertes Typenkript geschrieben.
Siehe Demo : http://fontselector.cilb.de
Erstellen Sie Ihr ausgewähltes Element wie Sie daran gewöhnt sind. Fügen Sie jeder Option die Schriftart -URL als Datenattribut hinzu:
< select id =" my-font-select " >
< option value =" Open Sans " data-font-url =" ./fonts/OpenSans-Regular.ttf " > Open Sans </ option >
</ select >BITTE AUF DEM MADEN: Wenn Sie die URLs auf einem anderen Host als den Host Ihrer Website speichern, müssen CORS -Header korrekt eingestellt werden.
Fügen Sie nun das CSS zu Ihrem HTML -Kopf hinzu ...
< head >
< link rel =" stylesheet " type =" text/css " href =" font-selector/styles.css " />
</ head >... und fügen Sie den JavaScript -Code am Boden Ihres Körpers hinzu:
< script type =" text/javascript " >
new FontSelector ( '#my-font-select' ) ;
</ script >Das ist alles!
Sie können ein Optionsobjekt an das zweite Argument des Fontselektor -Konstruktors übergeben, um die Klassennamen zu ändern oder Ereignisse anzuhören:
npm install aus, um Abhängigkeiten zu installierennpm run dev aus, um JS und CSS im Entwicklungsmodus einmal zu erstellennpm run watch aus, um JS und CSS im Entwicklungsmodus zu erstellen, wenn eine Quelldatei geändert wurdenpm run build aus, um JS und CSS im Produktionsmodus zu erstellen (Minified)