How to see an HTML page on Github as a normal rendered HTML page to see preview in browser without downloading

Question

On http   github com developer keep the HTML  CSS  JavaScript and images files of the project  How can I see the HTML output in browser   For example this  https   github com necolas css3-social-signin-buttons blob master index html  When I open this it doesn t show the rendered HTML of the code of author  It shows the page as a source code   Is it possible to see it as rendered HTML directly  Otherwise I always need to download the whole ZIP just to see the result

User · Answer

If you don t want to download an archive you can use GitHub Pages to render this    Fork the repository to your account  Clone it locally on your machine Create a gh-pages branch  if one already exists  remove it and create a new one based off master   Push the branch back to GitHub  View the pages at http   username github io repo    In code   git clone git github com username repo git cd repo git branch gh-pages   Might need to do this first  git branch -D gh-pages git push -u origin gh-pages   Push the new branch back to github Go to http   username github io repo

User · Answer

I have found another way   Click on the  quot Raw quot  button if you haven t already Ctrl A  Ctrl C Open  quot Developer Tools quot  with F12 In the  quot Inspector quot  right-click on the  tag and choose  quot Edit HTML quot  Ctrl A  Ctrl V Ctr Return  Tested on Firefox but it should work in other browsers too

User · Answer

You can use RawGit  https   rawgit com necolas css3-social-signin-buttons master index html  It works better  at the time of this writing  than http   htmlpreview github com   serving files with proper Content-Type headers  Additionally  it also provides CDN URL for use in production

User · Answer

Also  if you use Tampermonkey  you can add a script that will add preview with http   htmlpreview github com  button into actions menu beside  raw    blame  and  history  buttons   Script like this one  https   gist github com vanyakosmos 83ba165b288af32cf85e2cac8f02ce6d

User · Answer

It s really easy to do with github pages  it s just a bit weird the first time you do it  Sorta like the first time you had to juggle 3 kittens while learning to knit   OK  it s not all that bad   You need a gh-pages branch   Basically github com looks for a gh-pages branch of the repository  It will serve all HTML pages it finds in here as normal HTML directly to the browser   How do I get this gh-pages branch    Easy  Just create a branch of your github repo called gh-pages   Specify --orphan when you create this branch  as you don t actually want to merge this branch back into your github branch  you just want a branch that contains your HTML resources     git checkout --orphan gh-pages   What about all the other gunk in my repo  how does that fit in to it   Nah  you can just go ahead and delete it  And it s safe to do now  because you ve been paying attention and created an orphan branch which can t be merged back into your main branch and remove all your code    I ve created the branch  now what   You need to push this branch up to github com  so that their automation can kick in and start hosting these pages for you   git push -u origin gh-pages   But   My HTML is still not being served   It takes a few minutes for github to index these branches and fire up the required infrastructure to serve up the content  Up to 10 minutes according to github    The steps layed out by github com  https   help github com articles creating-project-pages-manually

User · Answer

I read all the comments and thought that GitHub made it too difficult for normal user to create GitHub pages until I visited GitHub theme Page where its clearly mentioned that there is a section of  GitHub Pages  under settings Page of the concerned repo where you can choose the option  use the master branch for GitHub Pages   and voil       checkout that particular repo on https   username github io reponame

User · Answer

You can just turn on Github Pages       Click on  Settings   than go to  GitHub Pages  and click on dropdown under  Source  and choose branch which you want to public  where main html file is located  aaaand vualaa

User · Answer

The most comfortable way to preview HTML files on GitHub is to go to https   htmlpreview github io  or just prepend it to the original URL  i e   https   htmlpreview github io  https   github com bartaz impress js blob master index html

User · Answer

This isn t a direct answer  but I think it is a pretty sweet alternative    http   www s3auth com   It allows you to host your pages behind basic auth   Great for things like api docs in your private github repo   just ad a s3 put as part of your api build

[html] How to see an HTML page on Github as a normal rendered HTML page to see preview in browser, without downloading?

Examples related to html

Examples related to css

Examples related to git

Examples related to github

Examples related to github-pages