購入ボタンがWordPressのメインコンテンツに反映されません。

AI-generated summary

WordPressのメインコンテンツにShopifyの購入ボタンを埋め込んでも表示されず、原因としてAMP対応の影響が強く疑われていました。ブロックエディタでは下書き上は見える一方、本番反映されない状態だったため、埋め込み方法そのものよりAMP側の制限や変換処理が焦点になっています。

挙がった確認点は以下の通りです。

  • AMPページのエラー確認
  • AMP化に使っているプラグインや実装方法の見直し
  • AMPではない通常URLで表示されるかの切り分け
  • 他サイトでも同じボタンが動くかの確認
  • ShopifyのBuyButton.jsを使ったiframe以外の実装検討

AMPはJavaScriptなどの機能制限があるため、通常のShopifyスクリプトがそのまま動かない可能性がある、という見解が示されました。最終的には、AMP対応を維持したまま表示に成功したとの報告があり、完全未解決ではありませんが、「1つだけエラーが残っている」ため、根本原因の特定や恒久的な解決はまだ継続課題です。

shopifyの購入ボタンをWordPressに貼り付けたのだが、反映されない。

何度もじっくりコードをみて、貼り付けたのだがやっぱりダメだ。

以前は反映されたのだが、以前と今回の違いは、WordPressにAMP対応させたことと、ブロックエディタに変更したぐらいです。

ブロックエディタは問題ないとして、実際に下書きには購入ボタンは反映されます。

しかしAMP対応に問題があるのか、、shopifyのサポートセンターにメール問い合わせたが、明確な回答はなかった。

「トライアンドエラー」でやっていくしかないという回答をいただいた。

購入ボタンが反映されない原因と改善策を教えてください。

サポートに問い合わせをされての現状であれば解決は難しいかと思いますが、色々と確認や試す事柄あるように思います。

  • AMPページのエラーを確認する
  • どの様にしてAMP対応したか(=プラグイン開発者に相談する / 別のAMP対応方法に変更する)
  • AMPではなくオリジナルのURLでは表示されるか(=表示されない場合ボタンの導入方法やテーマやサーバーに問題がある可能性)
  • 他のサイトに同じボタンを貼り付けて動作するか(=表示されない場合ボタンに問題あり)
  • BuyButton.jsを使って独自に購入ボタンの作成を試す(=iframeなしの形にできるようなのでそちらも検討)

AMPは以前に触ったきりで今はあまり把握していませんが、基本的に使用できる機能を制限して速度を出すという仕組みなので(Googleがキャッシュを提供するというのも大きいですが)、Shopifyのスクリプトをそのまま入れても動かないと推測できます。
例えばscriptタグをamp-scriptに書き換える必要があるなどです。

そのためAMPページのエラーを確認して原因を探り、一つ一つ問題を解決していくしかないと思います。
サポートでも解決できないとのこと、AMP対応にプラグインを使われている場合はそのプラグインの仕様が影響すること、おそらく内部を見ないと解決できないことなどを考えますと、ShopifyのエキスパートかAMPや該当プラグインに詳しい業者に依頼されるほうがよいかと思います。

なお蛇足になりますが、SEOと言いますかGoogleのトップニュース枠の要件からAMPが外れたためメリットは減じていますので、そういう目的でのAMP導入でしたら取りやめるというのも選択肢に入ると考えます。

ありがとうございます。

現状、AMP対応にしつつ、1つだけのエラーは出ていますが反映させることに成功しました。