Shopify チェックアウトのカスタマイズ: どのようなオプションがありますか

Shopify は、事前定義されたチェックアウト プロセスをすべてのマーチャントに提供します。 余計な手間をかけることなく、高速かつ安全に動作します。 ただし、チェックアウトをストアのデザインに合わせたり、摩擦をなくしたり、特別オファーを追加したりするために微調整したい場合があります.

すべての e コマース プラットフォームには、カスタム チェックアウト フィールドが組み込まれています。たとえば、メモやギフト メッセージを注文に追加することは、主要なソリューション (Woocommerce、Squarespace、Eqwid など) で利用できます。 しかし、Shopify はおそらく、カスタム開発なしでチェックアウトを変更する方法において最も柔軟です。

この投稿では、実行可能な Shopify チェックアウトのカスタマイズとその実装方法について説明します。

Shopify チェックアウトはどの程度カスタマイズ可能ですか?

Shopify ストアで表示されるほとんどのチェックアウト ページはほとんど同じです。 このページは 2 つの部分に分かれています。左側は顧客が配送と支払いの情報を入力するためのもので、右側は注文の概要を表示するものです。

この構造とチェックアウト ロジックを変更することはできません。 できることは、ページの外観の変更とフィールドの追加です。 しかし、外観上のわずかな変更でも、チェックアウト エクスペリエンスに大きな影響を与え、コンバージョンを増加させる可能性があります。

‍

チェックアウト構造を変更したい場合はどうしますか?

現在、checkout.liquid テンプレートを編集してチェックアウト ロジックに影響を与えることができるのは、Shopify Plus マーチャントのみです。 ただし、リスクが高すぎる可能性があり、Shopify 自体は満足していません。 チェックアウト コードを編集すると、次のリスクが生じます。

• Web サイトの何かが壊れて、顧客が注文を完了できなくなる可能性があります。
• サードパーティのコードを統合するのは難しく、労力がかかる場合があります。
• 追加すると、サードパーティの JavaScript が機密データにアクセスできるようになり、セキュリティの問題が発生する可能性があります。

これに対処するために、 Shopify は、開発者がチェックアウト カスタマイズ アプリを作成できるようにするチェックアウト拡張アーキテクチャを作成しています。 すでにさまざまな Shopify アプリを使用して多くのことを微調整できますが、チェックアウト拡張機能の出現により、より多くのカスタマイズの機会が期待できます. Shopify が提供する UI コンポーネントとブランディング API に基づいて、これらの拡張機能により、チェックアウトの既存の部分を強化し、一部の要素を置き換え、まったく新しい機能を追加することができます。

Shopifyでのチェックアウトのカスタマイズの種類

そうは言っても、利用可能な2つの主要なタイプのチェックアウトのカスタマイズについて説明します.1つ目は自分で簡単に実装できるテーマの変更であり、2つ目はShopifyアプリの助けを借りて組み込まれた追加機能です.

1. Shopify チェックアウトの非常に簡単な視覚的カスタマイズ

とりあえず、特別な助けなしにテーマ エディタで何ができるか見てみましょう。 現在のテーマの横にある [カスタマイズ] をクリックして、上部のメニューで [チェックアウト] を選択し、左側の [テーマ設定] の [チェックアウト] セクションに移動します。

ここでは、多くの簡単なチェックアウトのカスタマイズを行うことができます:

‍

• チェックアウト ページにロゴを追加します。 ロゴは、一貫したブランド イメージを作成するために、あるページから別のページへと顧客を追跡する必要があります。 チェックアウト ページにストアの名前だけを表示するのではなく、代わりにロゴを表示します。

‍

• ページ セクション、テキスト、リンク、およびボタンの色を変更します。 デフォルトの色をそのまま使用する代わりに、ブランド要素により適した色を設定できます。 メイン ページのコンテンツと注文概要の背景画像を設定することもできますが、推奨される方法ではありません。これらの領域の情報ははっきりと見えるようにする必要があります。

Shopify もいくつかのフォントを提供しています。 適切なものが見つかったら、それを選択してチェックアウトの外観をパーソナライズします。

‍

• ブランドのバナーまたは関連する画像をヘッダーとして追加します。 画像ヘッダーは小さな要素ですが、チェックアウト ページの外観を完全に変えることができます。

‍

管理画面のチェックアウトとアカウントセクションで一部のフィールドを変更することもできます。

‍

• マーケティング サインアップを編集します。 メールと SMS のサインアップを追加し、デフォルトの「ニュースとオファーをメールで受け取る」を別のものに変更できます。 後者を行うには、[カスタマイズ] チェックボックス ラベルをクリックし、それぞれのフィールドにフレーズを入力します。

ただし、特別なデザインを作成してこれらのフィールドを強調したり、フィールドが表示される場所を制御したりする場合は、デフォルト設定では不十分です。 Shopify アプリまたはカスタム コーディングは、サインアップ ボックスのカスタマイズに役立ちます。

‍

• 顧客のログイン オプションと必須入力フィールドを設定します。 管理者設定では、訪問者が注文を行う方法を決定できます: ゲスト チェックアウトを許可する、マルチパスを設定するなど。住所2。

‍

• チップを許可します。 それがあなたのビジネスにとって理にかなっている場合は、チェックアウトでのチップを有効にすることで、顧客に感謝の意を表すことができます。

‍

2. アプリやその他のツールを介して、Shopify チェックアウトのカスタマイズを行う

さまざまなアプリを使用すると、チェックアウト プロセスを完璧なものにし、コンバージョンを生み出すことができます。 以下に、できることの例をいくつか示します。

‍

• デフォルトのブレッドクラムを進行状況バーに置き換えます。 チェックアウトのために自動的に作成されたパンくずナビゲーションが小さすぎて注意を引くことができません。 注文を完了するために必要なステップ数を顧客に明確に理解してもらいたい場合は、進行状況バーを追加できます。

‍

• 送料無料のしきい値を表示します。 購入プロセスのさまざまな段階で送料無料のしきい値を繰り返すことは理にかなっています。ストアのヘッダーに追加し、カートページとカートドロワーで強調表示し、チェックアウトに追加することもできます (送料無料の条件はまだ満たされていません)。

‍

• 購入で無料ギフトを追加します。 Gift Box のような無料の商品を提供できるアプリを使用している場合、指定した条件 (支出のしきい値など) が満たされると、注文概要にギフトが自動的に表示されます。

‍

• 製品のアップセルとクロスセル。 アップセル手法は、チェックアウトを含むファネルのさまざまな段階でうまく機能します。 Candy Rack を使用して、購入後のオファーをサンキュー ページに追加できます。 チェックアウト時またはチェックアウト後にアップセルするためのさまざまな方法とソリューションを検討したい場合は、Shopify の最高のアップセル アプリのセレクションをお読みください。

‍

• チェックアウト タイマーを追加します。 緊急性は、顧客が購入を完了するための大きな動機となります。 カウントダウン タイマーを使用して、製品の需要が高いことを示します。

‍

• 顧客が電子メールと SMS の更新にサインアップできるようにします。 この機能は、Shopify の管理設定で利用できます (仕組みについては以前に説明しました) が、アプリを使用すると、サインアップ オプションを提示する方法がより柔軟になります。

いくつかのサインアップを組み込むことができます: マーケティング キャンペーンと出荷の更新のため。 AfterShip のようなアプリは後者に役立ちます。

‍

• 信頼バッジを追加します。 Trust Me などのアプリを使用すると、サポートされている支払い方法やその他の信頼指標でバッジを簡単に追加できます。

‍

• 連絡先の詳細やその他の役立つ情報を表示します。 製品の利点を顧客に思い出させることができるのに、一部の領域を空白のままにしておく必要はありません。 注文概要の下に特別なセクションを作成できます。

‍

または、連絡先情報を顧客に思い出させることができます。 これにより、人々が抱えている問題を解決する可能性が高くなるため、カートの放棄率を下げることができます。

‍

• 顧客がコメントを残せるようにします。 Checkout Comments などのアプリを使用すると、チェックアウトに追加のフィールドを配置して、フィードバックを求めたり、顧客にパーソナライズのリクエストを残すことができます。

‍

• 注文概要をスティッキーにします。 顧客が配送および支払いフィールドに入力する際に​​注文を見失うことがないように、スティッキー注文概要を使用できます (顧客のスクロールに合わせて移動します)。

‍

• 単一ページのチェックアウトを作成します。 1 つのページにすべてのステップを含むチェックアウト エクスペリエンスを設計するのに役立つ、Chekify などのサードパーティ ツールがあります。

‍

私たちが言及した機能が、チェックアウトをカスタマイズして魅力的なものにするきっかけになることを願っています. その他のヒントについては、Shopify チェックアウト最適化のガイドをご覧ください。