https://blog.partyonbici.com/ja/tags/bike-clubs/Recent content in Bike-Clubs on Party Onbici BlogHugojaMon, 28 Sep 2026 21:00:00 +1000https://blog.partyonbici.com/ja/posts/embed-routes-and-rides-on-your-website/Mon, 28 Sep 2026 21:00:00 +1000https://blog.partyonbici.com/ja/posts/embed-routes-and-rides-on-your-website/<p>自転車クラブにはウェブサイトがあり、学校にはお知らせページがあり、自治体には新しい自転車道を紹介するページがあります。これまで、そこでルートを紹介するには、すぐに古くなるスクリーンショットを貼るか、訪問者をよそへ送り出すリンクを載せるしかありませんでした。</p> <p>これからは、<strong>Party Onbici のルートやグループライドを自分のサイトに直接埋め込めます</strong>。統計、標高、ダウンロードまで揃ったインタラクティブなライブマップを、コピー＆ペーストひとつで。</p> <h2 id="実際に見てみよう">実際に見てみよう</h2> <p>これは画像ではありません。Party Onbici の本物のルートを、あなたのサイトに埋め込むのとまったく同じ方法でこのページに埋め込んでいます。ズームしたり、動かしたり、ベースマップを切り替えたり、全画面で開いたりしてみてください：</p> <iframe src="https://au.partyonbici.com/embed/route/ucIhGuhqdJ9b4wi3KEME6w/" title="The Sydney Harbour Bridge Offramp - North Side" width="100%" height="560" style="border:0;max-width:100%" loading="lazy" allow="fullscreen" referrerpolicy="strict-origin-when-cross-origin"></iframe> <p>シドニー・ハーバーブリッジの自転車道を渡る 2 km のショートライドです。黄色の線は自転車専用インフラ、赤は車道を共有する区間。ヘッダーを見れば、91% が自転車フレンドリーであることがひと目でわかります。</p> <h2 id="埋め込みに含まれるもの">埋め込みに含まれるもの</h2> <p>どの埋め込みにも、ライダーがアプリで見るのと同じ情報が入っています：</p> <ul> <li><strong>ライブマップ上のルート</strong> - ズーム可能で、自転車道がハイライトされるので、どれだけ安全なルートかがわかります</li> <li><strong>距離・上り・下り</strong> - スクロールしなくても一番上に表示</li> <li><strong>自転車フレンドリースコア</strong> - ルートのうち自転車専用インフラを通る割合</li> <li><strong>標高プロファイル</strong> - カフェ休憩のあとの坂道に驚くことはもうありません</li> <li><strong>スタート・経由地・ゴール</strong> - スケジュールを公開しているグループライドでは到着予定時刻も表示</li> <li><strong>ダウンロード</strong> - ルートを GPX などに書き出してサイコンに取り込めます</li> <li><strong>フル版へのリンク</strong> - ライドに参加したい人やルートを保存したい人のために</li> </ul> <h2 id="ルートやライドを埋め込む方法">ルートやライドを埋め込む方法</h2> <ol> <li><a href="https://www.partyonbici.com/">partyonbici.com</a> でルートまたはグループライドを開きます。</li> <li>共有パネルで <strong>ウェブサイトに埋め込む</strong> を探します。</li> <li>高さを選びます — コンパクト（420px）、標準（560px）、縦長（720px）。</li> <li><strong>コードをコピー</strong> をクリックし、ウェブサイトの HTML に貼り付けます。</li> </ol> <p>これだけです。WordPress、Squarespace、Wix、Google サイト、Webflow など、HTML や「埋め込み」ブロックを使えるサービスならどこでも動きます。</p> <h3 id="便利なオプション">便利なオプション</h3> <p>必要に応じて、埋め込みリンクの末尾に次を追加してください：</p> <ul> <li><code>?theme=dark</code> または <code>?theme=light</code> - 配色を固定します（デフォルトでは訪問者の設定に従います）</li> <li><code>?elevation=0</code> - 標高プロファイルを非表示にします。サイドバーの小さな埋め込みにぴったりです</li> </ul> <h2 id="プライバシーはあなたの手に">プライバシーはあなたの手に</h2> <p>埋め込めるのは <strong>公開</strong> と <strong>限定公開</strong> のルートとライドだけです。非公開のライドや組織限定のライドは、主催者としてログインしていても埋め込みには決して表示されません。あとからルートが非公開になった場合は、地図の代わりに「表示できません」という丁寧なメッセージが表示されます。</p>