【Unity】Webページに埋め込む方法【2020.2】

webサイトにWebGLで書き出したゲームを埋め込む方法備忘録
例：https://ponkichi.info リンク切れごめんなさい

Unityバージョン 2020.2.7f1

手順
1.設定してBuild
2.フォルダに入れる
3.HTMLに埋め込む
4.サイズ調整

1. Build

Edit > ProjectSettings > Player
から、Publishing Settings > Compression Formatを　Disabledに変更

デフォルトのGzipでもできる場合があるみたいですが、私はこれにしないとゲームがロードされなかったです。

2. フォルダに入れる

3. WebサイトのHTMLに埋め込む

<iframe width="960" height="600" src="ponmoguraBuild/index.html"
 frameborder="0" allowfullscreen>
</iframe>

unityで書き出されたindex.htmlではなくて、埋め込みたい元のサイトのhtmlに記載する
大きさは１６：１０にしてます
srcの部分にはビルドしたファイルの名前を書く
この状態で一度確認するとゲームが埋め込まれているはずです。

4. index.htmlを書き換える

unityで書き出されたindex.htmlを少し編集する
3までの手順でゲームのサイズやUIの位置がズレることがあるので修正します
赤枠部分がゲーム画面のサイズです

以下のように書き換える

style="width: 100%; height: calc(100vw * 0.56);

calcについてはググってみてください。

終わり