1.はじめに
●html図面(iCAD 3D Browser)をサイトで公開したい
●レンタルサーバーは契約したくない
という方向けの記事です。
サンプルで公開した図面(https://dxmechadesign.github.io/html-test/)です。
2.githubアカウントの作成
・github公式サイト(https://github.com/join)にアクセスし、アカウントを作成しよう。
・入力後、アカウント作成ボタンを押すとメールアドレスにコードが届きます。
そのコードを次の画面に入力すれば、アカウント作成終了です!!!
3.リポジトリの作成
・作成したアカウントにログインしたら、画面左上のNEWをクリックします。
・Repository nameに任意の名前をつけて、(今回は「html-test」としました。)
画面下のCreate repositoryをクリックします。
・create a new fileをクリックするとコード編集画面が出てきます。
・ここへhtml図面からコードをコピーしてきます。(後述)
4.コードの移植
・出力したhtml図面からコードをコピーします。
ブラウザー右上「…」 → その他ツール → 開発者ツールを選択します。
(chromeの場合は「…」 → その他ツール → デベロッパーツール)
・ツリーの〇〇〇.htmlをクリックするとコードが表示されるので、そのコードをすべて選択しコピーします。
・githubへ戻り、以下の画像を参考に「index.html」を入力します。必ず「index.html」と入力してください。
・その下の欄に先ほどコピーしたコードを貼り付けたら、緑のボタン commit changes を押します。
・もう一度 commit changes を押します。
・Settings → Pages の Branchの項目が「None」になっているので、「main」に変更します。
・Saveボタンを押します。
・ブラウザーの更新をするとページ上部にリンクが出てきます。
※表示されるまで1,2分かかることもあります。
以上で終了です。
もちろん、パスワード設定済みのhtml図面でも公開可能です。挙動はローカルで開いた場合と同じです。
コメント