{"id":216,"date":"2020-05-19T23:47:18","date_gmt":"2020-05-20T02:47:18","guid":{"rendered":"https:\/\/untura.com\/?p=216"},"modified":"2021-02-24T17:30:44","modified_gmt":"2021-02-24T20:30:44","slug":"custom-fonts-in-oxygen","status":"publish","type":"post","link":"https:\/\/untura.com\/en\/wordpress\/oxygen\/custom-fonts-in-oxygen\/","title":{"rendered":"Custom Fonts in Oxygen"},"content":{"rendered":"

This is more a note to myself because I didn't write the code I will share here. I just found in the Newsletter of Oxystuff<\/a>, and the code was written by Matt Hias<\/a>.<\/p>\n\n\n\n

To make custom fonts appear in Oxygen, the only way is to use Elegant Custom Fonts. Because I don't like installing a plugin just for this, we can simulate that this plugin is installed and Oxygen will load our fonts in the editor dropdown.<\/p>\n\n\n\n

Create a Code Snippet with the code below:<\/p>\n\n\n\n

\/\/ create callback function for Oxygen\nif (!class_exists('ECF_Plugin')) :\nclass ECF_Plugin {\nstatic function get_font_families() {\n$font_family_list[] = 'MyFont';\nreturn $font_family_list;\n}\n}\n\/\/ create new instance of fake class\n$ECF_Plugin = new ECF_Plugin();\n\/\/ embed font style\nadd_action( 'wp_footer', function () { ?>\n<style id=\"hke-custom-font\">@font-face {font-family:'MyFont';font-weight:400;font-style:normal;src:url(<?php echo get_site_url(); ?>\/wp-content\/uploads\/fonts\/myfont\/myfont.woff);}<\/style>\n<?php } );\nendif;<\/code><\/pre>\n\n\n\n
Dont forget to upload your font file to this folder: \/wp-content\/uploads\/fonts\/myfont\/<\/p>\n\n\n\n
<\/p>\n\n\n\n
Update: I have put the code above in a plugin and adapted the path to where you need to upload files. Download here<\/a>.<\/p>\n\n\n\n
Update 2: There is an update to Matthias Altmann's original script, that is much better then the one I used above. Read about it in his blog: https:\/\/www.altmann.de\/en\/blog-en\/code-snippet-integrate-custom-fonts-into-oxygen-en\/<\/a><\/p>","protected":false},"excerpt":{"rendered":"
This is more a note to myself because I didn't write the code I will share here. I just found in the Newsletter of Oxystuff, and the code was written by Matt Hias. To make custom fonts appear in Oxygen, the only way is to use Elegant Custom Fonts. Because I don't like installing a...leia mais<\/a><\/p>","protected":false},"author":1,"featured_media":32,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"ct_builder_shortcodes":"","ct_template_type":"","ct_parent_template":0,"footnotes":""},"categories":[5],"tags":[],"class_list":["post-216","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-oxygen"],"acf":[],"_links":{"self":[{"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/posts\/216","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/comments?post=216"}],"version-history":[{"count":7,"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/posts\/216\/revisions"}],"predecessor-version":[{"id":324,"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/posts\/216\/revisions\/324"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/media\/32"}],"wp:attachment":[{"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/media?parent=216"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/categories?post=216"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/untura.com\/en\/wp-json\/wp\/v2\/tags?post=216"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}