スモールビジネス、デジタルコンテンツ販売に最適なポータルサイトを構築するワードプレステーマ「ANTHEM(アンセム)」の商品販売ページの仕様について解説します。
本ワードプレステーマにはショッピングカートには対応していませんが、非常にセールス力の高い販売ページを実装しているのが特徴です。どういう機能が優れているのかをここでは深堀りして紹介していきたいと思います。
WordPressテーマ「ANTHEM」
先進的なデザイン設計。
すべてのページが機能美に直結、集客からセールスまでの導線を確立しています。
スムーズに売れていくセールスページとは?
WordPressテーマ「ANTHEM」ではカスタム投稿タイプ「商品」で、セールスページを制作できます。TCDオリジナルの「コンテンツビルダー」がより高度なページ作成をサポートします。
商品やサービスの魅力を洩れなく伝える機能性
上のGIFアニメは解像度が荒いため、実際のセールスページをご覧ください。
・セールスページ作成事例
いかがでしょう。順番にコンテンツが表示される美しい仕様になっています。
背景画像にはぼかしエフェクトやオーバーレイ(色を重ねる)機能を適用可能です。レイヤー構造になっているため、奥行きを表現できますね。
上のキャプチャはシンプルに背景画像を設置しただけのヘッダーです(レイヤーなし)。テキストの位置やレイヤー画像の位置も変更可能です。
メインコンテンツには、中央にキャッチフレーズをセット、その下にフリースペースです。自由度の高いセールスページがつくれます。
ブロックごとに見出しを設定すると自動でコンテンツリンクボタンが生成されます。コンテンツリンクボタンはスクロール時も上部で固定されます。
商品ごとにキーカラーを決められる
セールスページには基本設定の項目があり、そこからキーカラーや一覧ページに「おすすめ」として表示するかといった設定ができます。
いつでも決済に導く、サイドエリアの追従バー
サイドエリアには、ウィジェット&追従バーを設置できます。追従バーには商品名や概要、申込みページへのリンクボタンなどが設置できます。
追従バーの設定項目は上のキャプチャのようになっています。
キャッチフレーズ、説明文、価格の他に、自由にリンク先を設定できるボタンを任意の数だけ追加できます。
追従バーのボタンを決済or申し込みURLに変更
ボタンのラベルとURLを変更すると、上のキャプチャのようになります。銀行振込の場合は振込先銀行口座情報を送信するフォーム、PayPal(Stripeなど)の場合は決済(送金)URLを入力するのも良いでしょう。どの決済手段を利用するかはあなたの自由ですのでおまかせします(決済手段はご自身で用意してください)。
このようにラベルとURLを変更することで、ボタンの用途も変更できます。PayPalの決済リンクの作り方についてはこちらの記事を参照してください。
本稿ではPayPalを自社のECサイトの決済手段として利用する方法を解説します。PayPalはどなたでもすぐに利用できるため、スモールビジネスやデジタルコンテンツ販売に特に利用しやすい決済手段だと思います。現に弊社でも10年以上前からPayPalを主要の決済手段として利用しています。 PayPal...
リンクボタンはいくつでも設置できますが、2つまでなら小さなPC画面で表示しても違和感がありません。申し込みフォームは無料でもあります。
Webサイトの運営で必ず設置することになる要素のひとつにメールフォームがあります。 お問い合せや資料請求、メルマガ登録などに活用されるものですね。メールフォームは、メールソフトを起動せずに問い合わせできるので、比較的気軽にアクションを起こしてもらえます。チャット系サービスのほうが気軽さは増しま...
ヘッダーで興味を引く
↓
固定式のコンテンツリンクボタンから解説を読む
↓
ユーザーのタイミングで追従バーから購入
というフローが成立します。
アイコン画像などを用意して直感的に特徴を伝えるためのコンテンツ
画像付きのリストを表示する「特徴一覧コンテンツ」です。ここには、ユーザーが直感的に理解できるようなアイコン風の画像を設定しておくといいですね。項目は任意の数だけ追加でき、並び替えが可能な上に、レイアウトも1列か2列(PCのみ)にワンタッチで変更できます。項目数によって切り替えて使うといいでしょう。
また、アイコン画像にはレティーナディスプレイ対策機能がついていますので、チェック一つでどのデバイスでも綺麗に表示できます。
信頼度を上げるレビュー&評価機能
管理画面から実際のユーザーの評価に合わせて5段階のスターを設定できます。テキストだけよりも直感的に評価を把握できますね。
また、フロント画面に表示される「このレビューが参考になった」はページの閲覧ユーザーが評価できます。クッキーで重複評価を制御していますので、ある程度の不正防止にもなります(クッキーを消去すればできるが)。
レビューを表示する順番は、管理画面から「日付順」「参考になった順」を選択可能です。最近のレビューが多い場合 or 参考になったユーザーが多いレビューがある場合で相対的に判断して切り替えるといいでしょう。
セールスページへの3つの導線
あらゆるページからセールスページに誘導する仕組みを用意することで、集客の価値を上げます。ワードプレステーマ「ANTHEM」では次の3つの導線を用意しています。
メガメニューから売る
いつでも目立つ場所にセールスページ(一覧ページ)への導線を確保しています。ブログから来たユーザーもここから誘導できますね。
ランキングページから売る
売れ筋ランキングはユーザーの興味を強く引くコンテンツです。これは「行列ができる店」「予約が取れない店」と同じ仕組みです。Amazonや楽天市場でも売れている商品が何かをチェックするユーザーは多いのです。
「ANTHEM」でもランキングページが充実しており、総合ランキングだけでなくカテゴリーごとのランキングも設定できます。また、「おすすめ」や「ロングセラー」といったラベル付けも可能です。
商品の一覧ページから売る
商品一覧をカテゴリーソート付きで閲覧できます。ユーザーが興味のある分野の商品を閲覧しやすいようになっています。ちなみに、お好みのフェードアクションが管理画面から選択できます(下記参照)。
フェードイン(デモサイトと同様)
上にスライド
ポップアップ
大手のECプラットフォームとの完全な差別化
高い販売力を期待できるページを制作できる「ANTHEM」
今回はANTHEMのメイン機能でもある商品ページ機能にフォーカスを絞り、解説いたしました。この機能をフル活用して制作できるセールスぺージの販売力は、外部のプラットフォームに出店して訴求可能なレベルとは比べ物になりません。ぜひANTHEMの機能を活用して、サイトの販売力を伸ばしてみてください。
合わせて読みたいWordPressテーマ「ANTHEM」の関連記事
第1回 : どうすれば成約率を高められるか?「ANTHEM」に実装されたセールスページを徹底解説(当記事)
第2回 : WordPressテーマ「ANTHEM」の販売ページで紹介できなかった16の機能一覧
第3回 : FAQ、ランキング、アバウトページをWordPressテーマ「ANTHEM」で作成する方法
第4回 : CSS不要。思わず押したくなる「ANTHEM」のボタンホバーアニメーションの活用方法