Webビューの設定

Webビュー機能を使うと、外部のウェブサイトやウェブアプリケーションをアプリ内の画面としてシームレスに表示できます。既存のWebサイトをアプリの一部として組み込みたい場合に便利です。

Webビューとは

Webビューは、外部のウェブページをアプリ内のネイティブ画面のように表示する機能です。以下のようなケースで活用できます。

• ECサイト — 既存のネットショップをアプリ内で表示
• 予約システム — 外部予約サービスのページを組み込み
• 会員マイページ — 既存のWeb会員ページを表示
• ブログ・メディア — WordPressなど外部のブログサイトを表示
• フォーム — 外部の申し込みフォームやアンケートを組み込み

Webビュー設定画面への移動

1. ダッシュボードの左側サイドバーで 「Webビュー」 をクリックします。
2. URL が /webview のページが表示されます。

新しいWebビューの追加

1. 画面右上の 「新規追加」 ボタンをクリックします。
2. Webビュー追加フォームが表示されます。

入力項目

• タイトル（必須）— アプリ内のナビゲーションに表示されるページ名を入力します。例：「オンラインショップ」「予約する」「マイページ」
• URL（必須）— 表示したいウェブページの完全なURLを入力します。https:// から始まるURLを指定してください。例：https://shop.example.com
• アイコン（任意）— ナビゲーションメニューに表示されるアイコンを選択します。アイコン一覧から適切なものを選んでクリックします。

表示設定

• ヘッダー表示 — ページ上部にタイトルバーを表示するかどうかを切り替えます。フルスクリーン表示にしたい場合はオフにします。
• 外部ブラウザで開く — アプリ内ではなくデバイスのデフォルトブラウザで開く場合にオンにします。

3. 設定が完了したら 「保存」 ボタンをクリックしてWebビューを追加します。

Webビューの編集

1. Webビュー一覧で、編集したい項目の行をクリックします。
2. 設定フォームが表示されるので、URL やタイトルなどを修正します。
3. 「保存」 ボタンをクリックして変更を確定します。

Webビューの削除

1. 一覧で削除したい項目の行にカーソルを合わせます。
2. 右側の 「削除」 アイコンをクリックします。
3. 確認ダイアログで 「削除する」 をクリックします。

Webビュー利用時の注意点

以下の点にご注意ください。

• 表示するWebページはモバイル対応（レスポンシブデザイン）であることが必要です
• HTTPS（SSL対応）のURLのみ指定可能です。HTTP のURLは表示できません
• 一部のWebサイトはiframe埋め込みを禁止しているため、表示できない場合があります
• 外部サイトの表示速度や動作はアプリ側で制御できないため、事前にモバイル環境での表示を確認してください

表示確認

Webビューを追加・編集した後は、ダッシュボード右側の 「プレビュー」 ボタンをクリックして、アプリ内での表示を確認することをお勧めします。以下の点をチェックしてください。

• ページが正しく表示されるか
• モバイル画面サイズで見切れていないか
• ページ内のリンクやボタンが正常に動作するか
• 読み込み速度に問題がないか