Evlop のモバイルアプリ埋め込み拡張機能の使い方
概要
モバイルアプリ埋め込み拡張機能を使うと、ウェブサイトや Shopify のページを Evlop のモバイルアプリにシームレスに埋め込めます。ページの主要コンテンツだけを表示し、ヘッダーやフッターなど不要な要素は自動的に非表示になるため、アプリ内でスムーズなユーザー体験を提供します。
利用シーン
- カスタムページや複雑なページを再作成せずに素早く表示。
- ウェブサイトとモバイルアプリ間の一貫性を確保。
- ポリシー、FAQ、特別ページなどをアプリに直接組み込む。
仕組み
この拡張機能は、ウェブサイトまたは Shopify の <body> タグ内に直接配置された <main> HTML 要素を検出し、そのコンテンツだけをアプリ内に表示し、他の要素は非表示にします。最適な表示結果を得るには、テーマで <main> タグが <body> の直下に配置され、ヘッダーやフッターは <body> 内で <main> の外側にあることをご確認ください。
トラブルシューティング
1. 有効化後に何も表示されない場合
- Check: ウェブサイトテーマが、主要コンテンツを囲むように
<body>内に直接<main>HTML タグがあるか確認してください。 - Resolve:
<main>タグがない場合は、テーマコードに追加するか、テーマ開発者にお問い合わせください。 - Check: Shopify テーマ設定で Mobile App Embed が有効になっているか確認してください:
- 「Shopify Admin > Online Store > Themes > Customize」へ移動。
- 「Theme Settings > App Embeds」を開く。
- Mobile App Embed 拡張機能を有効化。
- Resolve: 有効になっていない場合は、設定を有効にして保存してください。
2. If header or footer is still showing
- Check: ウェブサイトテーマの構造を確認してください。ヘッダーとフッターは
<body>タグ内にあり、<main>タグの外側に配置する必要があります。 - Resolve: ヘッダーとフッターを
<main>の外側に移動してテーマ構造を調整してください。コード編集に自信がない場合は、テーマ開発者にご相談ください。
さらにサポートが必要な場合は、Evlop Support までお問い合わせください。