Як бачити HTML-сторінку на Github як звичайну відображену HTML-сторінку, щоб побачити попередній перегляд у браузері без завантаження?

На http://github.com розробник зберігає файли HTML, CSS, JavaScript та зображення проекту. Як я бачу вихід HTML у браузері?

Наприклад це: https://github.com/necolas/css3-social-signin-buttons/blob/master/index.html

Коли я відкриваю це, не відображається виведений HTML коду автора. Вона відображає сторінку як вихідний код.

Чи можна побачити його як візуалізований HTML безпосередньо? Інакше мені завжди потрібно завантажити весь ZIP, щоб побачити результат.

Найзручніший спосіб попереднього перегляду HTML-файлів на GitHub - це перейти на https://htmlpreview.github.io/ або просто додати його до вихідної URL-адреси, тобто: https://htmlpreview.github.io/?https:// github.com/bartaz/impress.js/blob/master/index.html

Якщо ви не хочете завантажити архів, ви можете скористатись сторінками GitHub .

1. Завантажте сховище у свій рахунок.
2. Клоніруйте його локально на вашій машині
3. Створіть gh-pagesгілку (якщо така вже існує, видаліть її та створіть нову, виходячи з неї master).
4. Відсунь гілку назад до GitHub.
5. Перегляньте сторінки на сторінці `http://username.github.io/repo

У коді:

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

Ви можете використовувати RawGit :
https://rawgit.com/necolas/css3-social-signin-buttons/master/index.html

Він працює краще (на момент написання цього повідомлення), ніж http://htmlpreview.github.com/ , обслуговуючи файли з відповідними заголовками типу вмісту. Крім того, він також пропонує CDN URL для використання у виробництві.

Це дуже просто зробити зі сторінками github , це просто трохи дивно, коли ви це зробите. Сорта, як перший раз, коли вам довелося жонглювати 3 кошенятами, навчаючись в’язати. (Гаразд, це не все так погано)

Вам потрібна гілка gh-сторінок:

В основному github.com шукає гілку gh-pages сховища. Він обслуговуватиме всі HTML-сторінки, які він знайде тут, як звичайний HTML, безпосередньо у браузері.

Як мені отримати цю гілку gh-сторінок?

Легко. Просто створіть гілку вашого репортажу github gh-pages. Вкажіть, --orphanколи ви створюєте цю гілку, оскільки ви насправді не хочете об'єднати цю гілку у свою гілку github, ви просто хочете гілку, яка містить ваші HTML-ресурси.

$ git checkout --orphan gh-pages

А як же з усіма цими речами в моїй репо, як це підходить до неї?

Ні, ви можете просто піти і видалити його. І це зараз безпечно, тому що ви звернули увагу і створили осіроту гілку, яку неможливо об'єднати назад у вашу основну гілку та видалити весь код.

Я створив філію, тепер що?

Вам потрібно підштовхнути цю гілку до github.com, щоб їх автоматизація могла розпочати роботу та почати розміщення цих сторінок для вас.

git push -u origin gh-pages

Але .. Мій HTML досі не подається!

Для того, щоб github проіндексував ці гілки і запустив необхідну інфраструктуру для обслуговування вмісту, потрібно кілька хвилин. До 10 хвилин згідно github.

Кроки, розроблені github.com

https://help.github.com/articles/creating-project-pages- вручну

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

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

You can preview HTML code by using following Chrome extension - Run Selected HTML, quite simple to use.

Якщо ви хочете select all the codeв режимі читання GitHub, це також досить просто: спочатку перемістіть курсор миші на початкову дужку <html>вгорі, потім утримуйте Shiftклавішу, а потім перемістіть курсор до кінця дужки </html>внизу.

Запустіть вибраний HTML - веб-магазин Chrome

https://chrome.google.com/webstore/detail/run-selected-html/eefflcdphpehljcadbmkdpopmbamfefl/

Крок 1 : У режимі читання виберіть все тіло коду html.

Крок 2 : Клацніть правою кнопкою миші «Запустити вибраний HTML», тоді ви зможете побачити виведений результат на новій вкладці.

Результат роботи:

Тепер ця застаріла відповідь (Because "Modify Content-Type Options" extension is not working as expected.).

Це рішення лише для браузера Chrome. Я не впевнений в іншому браузері.

1. Додайте розширення "Змінити параметри типу вмісту" у веб-переглядачі Chrome.
2. Відкрийте "chrome-extension: //jnfofbopfpaoeojgieggflbpcblhfhka/options.html" URL-адреса в браузері.
3. Додайте правило для URL-адреси сирого файлу. Наприклад:
   • Фільтр URL-адрес: https: ///raw/master//fileName.html
   • Тип оригіналу: текст / звичайний
   • Тип заміни: текст / html
4. Open the file browser which you added url in rule (in step 3).

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.

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. ^_^