チェックアウトページは、顧客が購入する前に最後に目にするものであり、スムーズでコンバージョン率の高い購入体験を生み出すデザインが必要です。
チェックアウトページを調整する方法はいくつかありましたが、限られた数のプリセットレイアウトに限定されており、その内部を並べ替える方法はありませんでした。
最新のEasy Digital Downloadsアップデートにより、WordPressのブロックエディターでチェックアウトページレイアウトを新しいインナーブロックでカスタマイズできるようになりました。追加のプラグインやコーディングは不要です。
新機能のすべてと、その使い方をご紹介します。
主なポイント
| 完全なレイアウトコントロール | チェックアウトページのあらゆる部分をブロックエディターで直接並べ替えたり、追加したり、削除したりできます。 |
| 追加のプラグイン不要 | Easy Digital Downloads LiteおよびProで利用可能。ページビルダーは不要です。 |
| 既製の開始点 | いくつかの既製レイアウトから選択し、そこからカスタマイズします。 |
| セクションごとの新しい設定 | 数量を表示したり、名前フィールドを組み合わせたり、その他多くの設定をブロックサイドバーから行えます。 |
チェックアウトページで変更されたこと 🎨
以前は、Easy Digital Downloadsのチェックアウトは1つのブロック（EDD Checkout）内にありました。いくつかの既製の形状から選択できましたが、その内部を触ることはできませんでした。
最新のEasy Digital Downloadsアップデートにより、チェックアウトページはインナーブロックで構築されます。カート、顧客の個人情報、支払い詳細、割引コードフィールドなどです。それぞれが独自のブロックになります。
すでにチェックアウトページをお持ちの場合は、自動的に更新されます。レイアウトや割引フォームの表示設定など、すでに選択した設定は引き継がれます。何も壊れず、やり直す必要もありません。
つまり、それらのいずれかを移動したり、不要なものを削除したり、ページ全体をゼロから再構築したりできます。すべてコードに触れることなく行えます。
チェックアウトのすべての部分に対するより多くのコントロール 🧩
Easy Digital Downloadsは、個別に制御できるブロックにチェックアウトを分割します。これが実際にどのように見えるかをご紹介します。
既製のレイアウトから選択
ストアのチェックアウトページでは、EDD CheckoutブロックのLayoutパネルを開きます。
開始点として5つのレイアウトが利用可能です。1列、2列の分割がいくつか、そしてカートが上にあり、フォームの残りがその下にあるレイアウトです。
最も近いものを選んでください。たとえば、2列レイアウトでは、顧客が支払い情報を入力している間、カートの概要が表示されるため、支払いを決定した時点で正確に何を購入しているかを確認できます。
このパネルを再度開き、いつでもレイアウトを切り替えることができます。ただし、レイアウトを切り替えると、チェックアウト内のすべてのブロックが置き換えられるため、まずレイアウトを選択し、その後でカスタマイズを保存してください。
チェックアウトのすべての部分を並べ替える
レイアウトを選択したら、チェックアウトの各セクションが独自のブロックになります。いずれかのブロックを新しい場所にドラッグするか、不要なものを削除してください。
チェックアウトに割引コードフィールドをまったく表示したくない場合は、セクション全体を削除するのではなく、カートブロックの設定からオフにしてください。
各セクションを微調整する
各部分には独自の Сettingsがあります。カートブロックでは、商品サムネイルを表示または非表示にしたり、サイズを調整したり、顧客がチェックアウトから直接商品の数量を変更できるかどうかを決定したりできます。
個人情報ブロックでは、名と姓を1つのフィールドにまとめることができます。これは、チェックアウトフォームを短く感じさせる小さな変更です。
各セクションをストアに合わせてスタイル設定する
2列レイアウトを選択すると、各列が独自のブロックとなり、独自のデザインオプションセットを持つようになります。ブロックの並べ替えに使用しているのと同じサイドバーから、いくつかの組み込みスタイルプリセットを選択できます。
チェックアウトページレイアウトのカスタマイズ方法 ⚙️
始める準備はできましたか？ Easy Digital Downloadsを最新バージョンに更新すると、新しい内部ブロックにすぐにアクセスして使用できます。
WordPressダッシュボードから、ページに移動し、チェックアウトページを開きます。EDDチェックアウトブロックはすでにそこにあります。どのページかわからない場合は、ダウンロード » 設定 » 支払いのチェックアウトページフィールドを確認してください。
ライブチェックアウトに触れることなく、まずこれを試してみたいですか？ 新しいページを作成し、代わりにそこにEDDチェックアウトブロックを追加してから、表示されるピッカーからレイアウトを選択してください。
ブロック、カート、個人情報、支払い情報、または割引フォームのいずれかを選択すると、サイドバーで独自のさまざまな設定が開きます。カートブロックだけでも、商品サムネイル、サムネイルサイズ、数量、割引フォームのトグルが利用できます。
ブロックツールバーを使用して、任意のブロックを並べ替えたり、複製したり、削除したりできます。
保存または更新をクリックしてから、カートブロックのゲストとしてプレビュートグルをオンにして、公開する前に顧客が正確に何を見るかを確認してください。
チェックアウトページレイアウトのカスタマイズに関するFAQ
Easy Digital Downloadsをアップデートすると、既存のチェックアウトページは変更されますか？
いいえ。チェックアウトページは新しいブロック構造に自動的に更新され、レイアウトの選択や割引フォームの表示など、すでにカスタマイズした設定は引き継がれます。やり直す必要はありません。
チェックアウトページのレイアウトをカスタマイズするには、Easy Digital Downloads Proが必要ですか？
いいえ。Easy Digital Downloadsには、無料のLiteバージョンとProの両方にこの機能が含まれています。すべてのEDDユーザーが完全にアクセスできます。
チェックアウトページのどの部分をカスタマイズできますか？
カート、顧客の個人情報フィールド、支払い詳細、割引コードフォームを並べ替えたり、削除したり、調整したりできます。それぞれが独自のブロックです。段落、見出し、またはお客様の声の引用などの標準のWordPressブロックを、それらと並べてドロップすることもできます。
チェックアウトレイアウトを変更すると、何か問題が発生しますか？
いいえ。すべてのレイアウトは、開始時点から機能するデザインです。WordPressの他のページを編集するのと同じ方法で、実際のブロックを並べ替えています。
チェックアウトページのデザインにElementorを引き続き使用できますか？
はい。より高度なデザインコントロールが必要な場合は、EDDチェックアウトテンプレートは引き続きElementorと連携します。このブロックエディターオプションは、レイアウトをカスタマイズするための、よりシンプルで組み込みの方法を求めている人向けです。
割引コードフィールドをオンまたはオフにするにはどうすればよいですか？
これはカートブロックの設定であり、追加または削除する個別のピースではありません。カートブロックを選択し、その設定を開き、割引フォームを表示を切り替えます。
これを使用するためにコーディングの経験は必要ですか？
いいえ。すべてWordPressブロックエディターで行われます。これは、ページや投稿の編集にすでに使用しているのと同じツールです。
これは私のテーマで動作しますか？
ほとんどの場合、はい。標準のWordPressブロックを使用しているため、ほとんどのテーマで動作します。テーマに異常なカスタムスタイルがある場合は、公開する前にチェックアウトの外観を確認してください。
コンバージョンを促進するレイアウトをチェックアウトに 🚀
チェックアウトページは、固定テンプレートである必要はもうありません。Easy Digital Downloadsを使用すると、おそらくすでに知っているツールを使用して、ストアに実際に適合するレイアウトを構築できます。
チェックアウトページにアクセスして試してみてください。このリリースで新しくなったすべてのものについては、リリースノートを参照してください。これには、Proパスでインポートできるチェックアウトテンプレートも含まれます。
📣追伸：ニュースレターを購読し、Facebook、Twitter/X、またはLinkedInでフォローして、WordPressのリソースをさらに入手してください！
