What I’m trying to do
I have a website published using Obsidian Publish. I would like to have a custom Google Font. Currently, I have the custom css in my publish.css file. I am trying to import Google Font Modern Antiqua into the CSS. However, the Google Fonts is for importing CSS into the head of the HTML file. As far as I know my custom theme does not have a HTML file. So, I am not sure how to go about importing the custom font…
Things I have tried
One idea I had was to download the font and host it myself then refer to it in the @font-face declaration… Something like this:
@font-face {
font-family: "CustomFont";
src: url("https://yoursite.com/css/fonts/CustomFont.eot");
src: url("https://yoursite.com/css/fonts/CustomFont.woff") format("woff"),
url("https://yoursite.com/css/fonts/CustomFont.otf") format("opentype"),
url("https://yoursite.com/css/fonts/CustomFont.svg#filename") format("svg");
}
My concern though is that this could take a long time for a user to call my site and fetch the necessary fonts then bring it back to the Obsidian Publish site.
Does anyone know the best way to do this?