Home > Mobile >  CSS import font issue, no direct access to HTML
CSS import font issue, no direct access to HTML

Time:10-22

I've recently started working on developing my css skills and experimenting with my code. I have run into a bit of a problem when trying to import a font for my code, I have read through many other questions and answers and none seem to solve the question. An example of what I'm trying to achieve is stated below.

@font-face {
    font-family:hpammo;
src:url(https://fonts.gstatic.com/s/montserrat/v15/JTURjIg1_i6t8kCHKm45_dJE3gnD_g.woff2);
}

It seems easy enough however I understand how to import a google fonts font using a .woff2 link, but can't manage to find this .woff2 link for any font, another example is presented below.

@font-face {
    font-family:gamefont;
    src:url(https://raw.githubusercontent.com/South-Paw/typeface-vag-rounded/master/files/vag-rounded-400.woff2);
}

In this example it shows how one has used a GitHub link with a .woff2 file included to import the font, would someone be able to direct me here to either upload a font to GitHub or using google fonts? I don't have access to the html directly so I can't locally import the font either.

CodePudding user response:

Here are two ways you can achieve that, but first:

  1. Create a GitHub account, if you don't have one.
  2. Create an empty repository [and initialize it with a readme].
  3. Click on Add File, upload your font, and commit changes.

Maximum Effort

Link and access the file using this format:

https://raw.githubusercontent.com/*USER*/*REPO*/*BRANCH*/*FILE*

Remove asterisks and replace USER, REPO, BRANCH, & FILE with the corresponding values.
If FILE is a sub-folder, provide the full path to it. Like this:

Minimum Effort

  1. Copy the url to your file on github.
  2. Head over to https://githubraw.com/
  3. Paste the url and get an auto-generated url.
  • Related