チュートリアル8 — ゲームのトップページと公開

トップページ：site/

games/<id>/site/フォルダ（index.htmlと画像）は、このサイトでのゲームのページになります。自分のドメインにデプロイする場合は、そのドメインのルートになり、ゲームはplay/に置かれます。例： Rainbow Islands、Sapiens。

• ゲームの色合いで、ゲーム本物の画像を使います：スクリーンショット（bin/jumphp shot）、スプライト、タイル。
• ゲームへの大きなリンク：href="play/"。
• 検索エンジン対策：<title>、<meta name="description">、Open Graph（1200 × 630のog:image）、 <h1>、画像のalt、構造化データVideoGame。
• 絶対URLはhttps://{{DOMAIN}}/…と書きます：サイトが本物のアドレスに置き換えます。
• スマートフォンで読みやすくします（幅390ピクセル、横スクロールなし）。

bin/jumphp build:site <id>のあとbin/jumphp siteshot <id>で確認してください。

説明文：すべての言語で

このサイトは14言語（fr en es de it pt nl pl ru uk tr ja zh ko）に対応していて、訪問者の言語に合わせてゲームの説明文を表示します。config/game.yamlに、できるだけ多くの言語で書いてください（少なくともfrとen）。

game:
  description: "ブロック崩しゲーム：ライフ3、レベルごとに新しい壁。"
  descriptions:
    fr: "Un casse-briques : 3 vies, un nouveau mur à chaque niveau."
    en: "A brick breaker: 3 lives, a new wall every level."
    es: "Un rompeladrillos: 3 vidas, un muro nuevo en cada nivel."

訪問者の言語の翻訳がない場合は、プロジェクトの説明文が表示されます。

ゲームのサイトを他の言語で

site/index.htmlは、ゲームのメイン言語（その<html lang>）のページです。各翻訳はsite/<コード>/index.html（例：site/en/index.html）に置きます。同じページを翻訳したもので、相対パスは1つ上のフォルダ基準になります（../images/…、ゲームは../play/）。訪問者は、その言語のページがあればそれを見ます。どのページにもすべての言語が列挙され（<link rel="alternate" hreflang="…">）、小さな言語メニューが付きます。sitemap.xmlには言語ごとに1つのアドレスが載ります。あなたのClaudeならやり方を知っています（JumPHPのAGENTS.md §13）。

ディレクトリ用の画像

assets/thumbnail.png（16:9）。なければ、サイトはトップページのog:imageの画像を使い、それもなければゲームのアイコンを使い、最後の手段として、ブラウザでゲームそのものを撮影します。

サイトがゲームごとに追加するもの

• インストール：どのゲームも、アプリとしてインストールできます（スマートフォンでもパソコンでも）。アイコン（assets/icon.png）つきです。
• 共有：スマートフォンの共有シート、パソコンではSNS。
• プレイヤーによる評価（1〜5つ星、アカウント不要）と、プレイ回数のカウンター。
• ソースと、オンラインエディタ。
• バージョン（🕘）：ゲームを変更したすべてのコミット。プレイヤーには常に公開済みの最新バージョンが表示されます。古いバージョンは、もう一度遊んだり、サンドボックスで取り込んだり、元に戻したり（作者の場合：エディタから「GitHubに送信」）、フォークしたりできます。
• プレイヤーが、アカウントの有無を問わず投稿するコメント、アイデアボックス、問題の報告。匿名のメッセージは、あなたが承認して初めて表示されます。サイト上部のベル🔔は、あなたのゲームへの新しいメッセージと、承認待ちのメッセージを数えます。そのページ （通知）にはすべてが一覧され、✓ 承認、解決済みにする（問題の場合）、削除のボタンがあります。

公開する

リポジトリのメインブランチにpushするたびに、1分以内に公開されます。スタジオでは、プロジェクトのページに公開の状況とエラーが表示され、ディレクトリからゲームを隠すこともできます。