GemPagesを使用する場合、 時々、 エディタープレビュー と ライブ公開 ページ.
たとえば、画像はエディター内では適切に表示されますが、ページが公開されると表示されなくなる場合があります。
これらの問題は、多くの場合、製品の可視性、公開ステータス、またはテーマの競合に関連しています。
この問題の一般的な原因と解決方法
最も一般的な理由を確認し、手順に従って製品ページが正しく表示されるようにしてください。
1. GemPagesアプリの埋め込みが有効になっていない
Status GemPagesアプリはShopifyテーマで有効になっていませんライブ ページが壊れたように見えたり、正しいレイアウトが表示されなかったりする可能性があります。
それを修正する方法:
- あなたから GemPagesダッシュボード、クリック Shopifyエディターをオンにする.

- Shopifyテーマエディターで、 GemPagesテーマヘルパー.

- 詳しくはこちら Save 変更を適用します。
2. 製品モジュールの設定が正しくない
公開した製品ページに予想とは異なる製品が表示される場合、製品モジュールが正しく設定されていない可能性があります。
直し方:
- GemPages エディターで、製品モジュールをクリックして、左側のサイドバーにある設定にアクセスします。
- 下 製品を選択 セクションでは、選択 割り当てられた製品別に表示.
この設定により、モジュールは手動で選択された製品ではなく、テンプレートに割り当てられた製品を動的に表示するようになります。

- 詳しくはこちら パブリッシュ 変更を適用します。
3. オンラインストアで商品が表示されない
場合によっては、製品が GemPages エディターでは正しく表示されても、ライブ ページでは正しく表示されないことがあります。
直し方:
- Shopify管理ダッシュボードに移動し、 製品.

- 問題の製品を選択し、そのステータスが 有効.

- 下 販売チャネルとアプリ セクションで、 オンラインストア チャンネルが選択されます。

4. 変更は公開されない
エディターで行った編集は、公開するまでオンラインには表示されません。
- GemPages ダッシュボードから、エディターの製品テンプレートにアクセスします。
- 「公開」をクリックすると、ページのライブ バージョンが最新の変更内容で更新されます。
5. テーマCSSの競合
ライブページが中央に配置されていなかったり、小さすぎたり、エディターとは配置が異なっていたりする場合は、Shopify テーマの CSS が GemPages スタイルを上書きしている可能性があります。
直し方:
- 問題が解決しないかどうかを確認するには、一時的にデフォルトの Shopify テーマ (例: Dawn) に切り替えてみてください。
- デフォルトのテーマでデザインが正しく表示される場合、問題はアクティブなテーマのカスタムCSSにある可能性があります。この場合、競合するCSSを調整または削除するか、 追加のCSSクラス 独自の修正を適用するための GemPages のオプション。
5. レスポンシブデザインの違い
ライブページがデスクトップ、タブレット、モバイルで異なって見える場合は、レスポンシブ設定が一致していない可能性があります。
直し方:
- エディターで、各デバイスのビュー (デスクトップ、タブレット、モバイル) を確認します。
- レビュー フォントサイズ、余白、パディング 一貫性のために。
- ブレークポイント全体で要素が非表示になったり、サイズが誤って変更されたりしていないことを確認します。
- エディターとライブストアの両方でページをプレビューします。
よくあるご質問
1. 公開後に写真が消えてしまったのはなぜですか?
これは通常、ShopifyとGemPages間で画像が正しく同期されていない場合に発生します。修正するには、以下の手順に従ってください。
- 画像がShopifyに直接アップロードされていることを再度確認してください。
- 商品のステータスが設定されていることを確認してください 有効 オンラインストア販売チャネルでもご購入いただけます。
- 帰ります GemPages エディターページを再公開し、ライブサイトを更新します。
問題が解決しない場合は、ブラウザのキャッシュをクリアするか、Shopify で画像を再アップロードしてから再度公開してください。
2. ライブページでの商品の見た目が違って見えるのはなぜですか?
これは、商品モジュールに間違った商品が表示されている場合によく発生します。修正するには、以下の手順に従ってください。
- エディタで、 製品モジュール.
- [製品の選択] で、[割り当てられた製品別に表示] を選択します。
- ページを再度公開して、ライブ バージョンを更新します。
3. 編集内容がオンラインで更新されないのはなぜですか?
エディタで行った編集は、ページを再公開するまで反映されません。以下の手順に従ってください。
- GemPages ダッシュボードから製品テンプレートを開きます。
- 詳しくはこちら パブリッシュ 最新バージョンを公開します。
- 更新内容を確認するには、ストア ページを更新してください。
それでも変更が反映されない場合は、ブラウザのキャッシュをクリアするか、シークレット モードで試してキャッシュされたバージョンを除外してください。
4. エディターと比べてレイアウトが違って見えるのはなぜですか?
これは通常、ShopifyテーマのCSSがGemPagesのスタイルを上書きしていることが原因です。この場合は、一時的に デフォルトのShopifyテーマに切り替える (例: Dawn) を選択して、レイアウトが正しいかどうかを確認します。
問題が発生する場合、現在のテーマのカスタムCSSに問題があります。以下の対策をお試しください。
- テーマ内の競合する CSS を調整/削除します。
- または、GemPages に追加の CSS クラスを追加し、独自の修正を適用します。
コメントしてくださってありがとうございます