Shopify での「チェックアウトカスタマイズ」とは、購入手続き(=チェックアウト)の画面や機能を拡張し、より魅力的で使いやすい購入体験を提供することを指します。具体的には、以下のような取り組みが代表的です。
これらを実現することで、お客様にとってはスムーズで分かりやすい決済フローを、マーチャントにとってはコンバージョンや顧客満足度の向上を期待できます。
今回は、以下の記事を参考にしています。
ブランド力・信頼感の向上
購入直前・直後の画面に独自のデザインやメッセージを反映させることで、顧客が「自分が信頼できるブランドから買い物をしている」と感じやすくなります。
アップセル・クロスセルによる売上増
購入を確定するタイミングや、購入後のサンクスページ上で追加商品を提案することで、客単価(AOV)の向上が期待できます。
顧客体験(UX)の向上
不要な支払い方法や配送方法を非表示にしたり、特定の顧客層に最適化されたチェックアウトを提供することで、購入完了率や顧客満足度が高まります。
マーケティング施策との連携
キャンペーンバナーを表示したり、サンクスページで次回クーポンを案内するなど、買い物後のリテンションや再購入施策にも応用できます。
購入率の向上
フォーム項目の最適化や入力チェックの強化で、エラーやストレスを軽減し、カート放棄率を下げる効果が期待できます。
在庫管理や不正注文のブロック
商品タグや住所などの条件をもとに、配送方法や支払い方法を制限するなど、ルールに合わせた注文制御を行うことで、不正注文や無用なコストを削減できます。
顧客データ収集の効率化
チェックアウト時にアンケートや追加の入力欄を設置することで、購買データや顧客の傾向を把握しやすくなり、今後のマーケティング施策に生かせます。
Shopify アプリを利用してチェックアウトを拡張する場合、以下のポイントを重視するとよいでしょう。
ここからは、Shopify App Store で提供されているチェックアウトカスタマイズアプリを 10 個ご紹介します。いずれも公式の評価や機能を参考にまとめています。
今回は、以下の記事を参考にしています。
ここでは、月額料金や無料プランの有無を簡単にまとめます。
(※テーブルではなく箇条書き形式で記載しています。)
シンプルサンクスページ編集|お手軽チェックアウト拡張
qikify Checkout Customizer
BeSure Checkout Rules
Checkout Plus
Shopify Checkout Blocks
Blockify Checkout Rules & COD
SMART Checkout Rules
Checkout Buddy
Kwik COD & Checkout
AfterSell Post Purchase Upsell
日本語でのサポートや管理画面を重視する場合は「シンプルサンクスページ編集|お手軽チェックアウト拡張」や「qikify Checkout Customizer」が安心です。
自社の求める機能量やサポート言語に応じて選ぶのがベストです。
ここでは、Shopify Plus で利用可能な「Checkout Extensibility」を使ったサンクスページへのバナー設置例をご紹介します。以下のコードはあくまでもサンプルであり、実際にはアプリやテーマに応じて修正が必要です。
import {
extend,
BlockStack,
Heading,
Image,
Link,
} from '@shopify/post-purchase-ui-extensions';
extend('Checkout::PostPurchase::ShouldRender', ({storage}) => {
// 購入データなどを取得して、バナー表示の可否を判断
const cartValue = storage.initialPurchase.totalAmount;
if (cartValue.amount > 100) {
return {render: true};
}
return {render: false};
});
extend('Checkout::PostPurchase::Render', ({done, inputData, storage}) => {
return (
<BlockStack spacing="tight">
<Heading>ご購入ありがとうございます!</Heading>
<Link to="https://example.com/campaign" external={true}>
<Image
source="https://example.com/thanks-banner.jpg"
description="キャンペーンバナー"
/>
</Link>
</BlockStack>
);
});
ShouldRender
フェーズRender
フェーズこのように、コードで直接チェックアウト画面やサンクスページを拡張する方法もありますが、今回ご紹介したアプリの多くは UI で設定できるため、コード不要で同様の機能が実現できる場合もあります。コーディングが苦手な方はアプリを活用するのがおすすめです。
今回は「Shopify のチェックアウトカスタマイズアプリ 10 選」をご紹介しました。チェックアウトやサンクスページを自由にカスタマイズすることで、ブランドの印象を高めたり、アップセルやリピート購入を促進したりと、多くのメリットがあります。
ショップの規模や目的、言語サポートなどにあわせて、最適なアプリを導入してみてください。コーディングによる柔軟な拡張を行う場合も、アプリや公式ドキュメントを参考にすると導入がスムーズになります。
最後までお読みいただきありがとうございました。チェックアウトカスタマイズによって、あなたの Shopify ストアがより魅力的な購買体験を提供できることを願っています。