大人の男性をターゲットにしたECサイト用WordPressテーマリリース

大人の男性をターゲットにしたECサイト用WordPressテーマリリース

こんにちは。Webloco代表/Webディレクターのヤブです。

本日は、大人の男性をターゲットにしたECサイト用のWordPressテーマ「ECP3シリーズ」のご紹介です。

こちらのテーマは、WordPressでECサイトを構築出来るプラグイン「Welcart」用のWordPressテーマとなります。

 

「ECP3シリーズ」のデモサイト

百聞は一見に如かず。

まず、こちらのデモECサイトで、デザインや操作性などをお確認いただけます。

 

「ECP3シリーズ」のデザインコンセプト

白をベースカラーとして、ネイビーをメインカラー、オレンジをアクセントカラーとした、シンプルながらも、信頼感を与えつつ、少し大人で男性的な印象を与えるビジュアルデザイン

 

「ECP3シリーズ」を使ったECサイトに向いている商材

「男性的」「大人」「シック」をデザインコンセプトとしている為、男性向けで少し高級感のある商材に向いていると思います。

  • 革靴、ビジネスシューズ
  • スーツ、ジャケット
  • 財布、鞄
  • 腕時計

 

「ECP3シリーズ」の仕様

ECP3シリーズ サイトレイアウト

トップページなどは1カラム

 ECP3シリーズテーマのレイアウトは、「トップページ」「商品詳細ページ」などが1カラムのレイアウトになっています。これは、モバイルファーストを意識して、コンテンツの幅を広げる事で、商品写真などを画面一杯に見せる事が出来、ユーザーのコンテンツへの没入感を増加する為のレイアウトです。

また、「ショッピングカート」から「購入完了ページ」までも1カラムレイアウトになっています。これは、「カート落ち」というカートに入れたけど、途中で離脱してしまう事を少しでも防ぐ為のアイデアになります。

 

商品一覧ページなどは2カラム

なお、情報を網羅的に閲覧したいニーズが高い「商品一覧ページ」「BLOG一覧ページ」「BLOG単一ページ」などは、通常通り、2カラムのレイアウトにしてあります。

 

ECP3シリーズ ウィジェットエリアの配置

トップページなどの1カラムレイアウト場合

 1カラムのウィジェットエリアの位置は、「メインビジュアル(トップページのみ)」「上部エリア」、「下部エリア」、「フッターエリア」になります。

 

2カラムレイアウトの場合

 2カラムレイアウトのウィジェットエリアの位置は、「上部エリア」、「下部エリア」、「左サイドエリア」、「フッターエリア」になります。

 ウィジェットエリアは、「固定ページ」、「単一ページ」、「商品詳細ページ」と、ページ別に表示する情報を変更出来るよう、ページ毎に「上下」のウィジェットエリアを設置

 

商品詳細ページのデザインとユーザビリティ

 商品画像が沢山あってもデザインや使い易さを損なわない「スライドショー」を完備。また、商品の魅力を伝える為に、大きな写真や動画などを掲載するのに便利な「フリーエリア」を、上下に配置。

 

便利なショートコードを用意

 「ECP1シリーズ」では、「商品表示」や「投稿表示」を「ウィジェット」として提供しておりましたが、「ECP3シリーズ」では、「ショートコード」として、「商品表示」「投稿表示」「投稿表示(画像付き)」を提供しています。

 「ウィジェット」ではなく、「ショートコード」になったのは、いろんな箇所で、柔軟に表示をしたいという要望にお応えしての改良です。

widgetArea

 「投稿ページ」「固定ページ」内で「商品表示ショートコード:[recent_items class=archive-list cat=itemreco col=4 num=4]」「投稿表示ショートコード:[recent_posts class=recent-posts num=3 dsp=cat]」「投稿表示(画像月)ショートコード:[recent_image_posts class=archive-list col=4 num=4 dsp=cat]」のコードを挿入するだけで、表示させたい情報を表示でいます。

 

カスタマイザからロゴやSNSの設定が可能

 WordPressの管理画面の「カスタマイザー」画面で、「ロゴ画像」の設定が出来るほか、SNSのURLを入力するだけで、フッターエリアに表示する事ができます。

 また、スマホヘッダーエリアに、カートボタンを表示する項目も装備。カートページのURLを設定するだけで、スマホでもすぐにカートページを閲覧できる動線が出来上がります。

 

ECP3シリーズの販売ページへ

 

Webマーケターが制作するユーザー目線のホームページ作成のバナー
Webマーケターが制作するユーザー目線のホームページ作成のバナー