{"id":1204,"date":"2015-12-31T07:07:15","date_gmt":"2015-12-31T07:07:15","guid":{"rendered":"https:\/\/themehunk.com\/?post_type=docs&#038;p=1204"},"modified":"2024-07-31T19:11:03","modified_gmt":"2024-07-31T13:41:03","slug":"how-to-add-custom-font-in-themehunk-themes","status":"publish","type":"docs","link":"https:\/\/themehunk.com\/fr\/docs\/how-to-add-custom-font-in-themehunk-themes\/","title":{"rendered":"Adding custom font in Themes"},"content":{"rendered":"\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<section class=\"wp-block-group custom-font has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<section class=\"wp-block-group custom-font has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<section class=\"wp-block-group custom-font has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<h3 class=\"wp-block-heading\">Adding Custom Font<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/themehunk.com\/fr\/\">ThemeHunk<\/a> themes are compatible with all custom fonts available on the web. In this tutorial we&#8217;ll learn how easy is to integrate any custom font with our <a href=\"https:\/\/themehunk.com\/fr\/all-themes\/\">themes<\/a>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You can add your custom font in three easy steps:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>First you need to convert the fonts (eg. TTF or OTF format) that you have to use with @font-face. Use one of the following tools: https:\/\/fontface.codeandmore.com to generate the fonts.<\/li>\n\n\n\n<li>Upload the font files on your server (create a folder called named fonts for example, and add the files in it).<\/li>\n\n\n\n<li>Go to Appearance > Customize > Custom CSS and add the code given below<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">@font-face {\n    font-family: \"FontName\";\n    src: url(\"https:\/\/abc.com\/fonts\/fontname.eot\");\n    src: url(\"https:\/\/abc.com\/fonts\/fontname.eot?#iefix\") format(\"embedded-opentype\"),\n        url(\"https:\/\/abc.com\/fonts\/fontname.woff\") format(\"woff\"),\n        url(\"https:\/\/abc.com\/fonts\/fontname.ttf\") format(\"truetype\"),\n        url(\"https:\/\/abc.com\/fonts\/fontname.svg#fontname\") format(\"svg\");\n}\nh1, h2, h3, h4, h5, h6, a, span {\n    font-family: \"FontName\";\n}\n\n\n<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">Hope this helps.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">If you need any assistance regarding this, please contact to our <a href=\"https:\/\/themehunk.com\/fr\/support\/\" target=\"_blank\" rel=\"noreferrer noopener\">support forum.<\/a><\/p>\n<\/section>\n<\/section>\n<\/section>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>Adding Custom Font ThemeHunk themes are compatible with all custom fonts available on the web. In this tutorial we&#8217;ll learn how easy is to integrate any custom font with our themes. You can add your custom font in three easy steps: @font-face { font-family: &#8220;FontName&#8221;; src: url(&#8220;https:\/\/abc.com\/fonts\/fontname.eot&#8221;); src: url(&#8220;https:\/\/abc.com\/fonts\/fontname.eot?#iefix&#8221;) format(&#8220;embedded-opentype&#8221;), url(&#8220;https:\/\/abc.com\/fonts\/fontname.woff&#8221;) format(&#8220;woff&#8221;), url(&#8220;https:\/\/abc.com\/fonts\/fontname.ttf&#8221;) format(&#8220;truetype&#8221;), url(&#8220;https:\/\/abc.com\/fonts\/fontname.svg#fontname&#8221;) [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"template":"","meta":{"footnotes":""},"class_list":["post-1204","docs","type-docs","status-publish","hentry","docscate-documentation"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/docs\/1204","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":7,"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/docs\/1204\/revisions"}],"predecessor-version":[{"id":71058,"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/docs\/1204\/revisions\/71058"}],"wp:attachment":[{"href":"https:\/\/themehunk.com\/wp-json\/wp\/v2\/media?parent=1204"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}