38

I've got a repository on github with a .css file in it. Is there any way to have github serve this file in a way that I can consume it in a web page?

In other words, I'd like to be able to reference this source file at github directly, from an HTML file on my local computer or a live domain. Something like:

<link rel="stylesheet"
      type="text/css"
      href="http://github.com/foouser/barproject/master/xenu-is-my-lover.css"
/>

I've tried including a<link> to the "raw" source file (http://raw.github.com...), but github serves its Content-Type as text/plain, and consequently, Chrome and FF are not adding its content as CSS styles to the page—the file's data is being discarded and a warning is shown in the debugger consoles of the browsers.

user979672
  • 1,803
  • 3
  • 23
  • 32
  • 1
    possible duplicate of [Link and execute external JavaScript file hosted on GitHub](http://stackoverflow.com/questions/17341122/link-and-execute-external-javascript-file-hosted-on-github) – Troy Alford Oct 24 '14 at 20:43
  • (try this) You can create a `folder/file.css` and serve it from GitHub pages. Just follow the correct path from the URL and get the file when referencing it from your local html file. – carloswm85 Nov 27 '21 at 18:00

5 Answers5

66

Important: rawgit.com is shutting down. Read more about other alternatives here - https://rawgit.com/

Found something really cool. You get the raw link as: http://raw.github.com/...

Simply fetch the files from rawgit.com (or cdn.rawgit.com) instead of raw.github.com and DONE!


UPDATE:

You can also use raw.githack.com if you want to serves raw files directly from Bitbucket or GitLab

Kushagra Gour
  • 4,568
  • 2
  • 22
  • 26
  • 1
    Just what I needed to serve the proper MIME type! – Kevin M Jun 20 '13 at 20:31
  • 8
    Keep in mind that you should not use [rawgithub](http://rawgithub.com/) for production code. – ricksmt Oct 11 '13 at 16:04
  • Mind Blown. Private gists and repo's don't work. just as an FYI – Mark Carpenter Jr Jan 11 '18 at 19:42
  • JsDelivr does this apparently! Example: https://cdn.jsdelivr.net/gh/StylishThemes/Syntax-Themes/pygments/css-github/pygments-tomorrow-night-eighties.css from [this GitHub file](https://github.com/StylishThemes/Syntax-Themes/blob/master/pygments/css-github/pygments-tomorrow-night-eighties.css). This service seems to have been around for a long time, and widely used. – V. Rubinetti Feb 20 '23 at 03:28
17

GitHub repos aren't web hosting, you should push that stuff up to a service specifically designed to serve files, like pages.github.com.

Tekkub
  • 30,739
  • 2
  • 30
  • 20
  • 3
    I don't think this is true. You can host static files on github, granted web hosting is better but it can work on github pages. – 32423hjh32423 Aug 02 '18 at 13:58
9

Check out https://gitcdn.link/ . Seems to work well.

Rawgit.com has shut down.

Squirrl
  • 4,909
  • 9
  • 47
  • 85
  • Does not like this works either; there is a front page, but About etc do not resolve ("Cannot GET /about"), and when you try to paste a link, you get nothing in the text field? – sdbbs Sep 19 '22 at 19:54
  • 1
    This seems to be abandoned too unfortunately. Might be due to Heroku removing its free tier and removing inactive accounts. – V. Rubinetti Feb 20 '23 at 03:21
2
  • First Visit RawGit as suggested earlier
  • Next copy your file path from github into the RawGit box
  • RawGit will automatically produce two refrences to your web page
  • The Development and Production refrence
  • refrence the development link in your webpage if you are still developing
  • save/upload then reload your webpage
  • if there was no change it means your browser has saved your former refrence
  • clear your browser data then reload
  • Hope that helps?
Toye_Brainz
  • 100
  • 7
1

You have to use RawGit which, is a part of MaxCDN, serve files directly from the GitHub repository with the correct content type header. Full tutorial, click here

Vishal Chopra
  • 364
  • 5
  • 9