今は、誰でもネットショップを簡単につくれる時代です。
さまざまなネットショップ作成ツールのほか、テキストコンテンツを販売できるnoteや写真素材を販売できる「Shutterstock」などもあります。
こうしたプラットフォームを利用した販売形態は、手軽に販売をスタートできるメリットはありつつも、手数料や自由度の面で不満を感じることもあるでしょう。
また、プラットフォームで買ってくれたお客さんは、あなたの顧客になるわけではなく、プラットフォームの顧客です。継続的に収益を上げる意味でも、自身のショップを持つことは重要な意味を持ちます。
自分のネットショップを持つには、フルスクラッチで制作会社に依頼する方法もありますが、WordPressの無料ECカートプラグイン「WooCommerce」で自分でショップ開設する手もあります。
WooCommerceであれば、テンプレートが豊富にあるため、デザインも選べるし、カスタマイズの自由度も高い。
そこで今回は、デジタルコンテンツの販売サイトを自分でつくれるWooCommerce対応のテンプレート「common」についてご紹介いたします。主な機能概要についての解説です。
目次
WordPressテーマ「common」とは
ECサイトプラグイン「WooCommerce」対応のWordPressテーマです。デジタルコンテンツの販売に特化しています。WooCommerceの設定方法はこちらが参考になります。
WooCommerceでは、写真や映像ファイル、PDFファイルなどのデジタル商品を販売することもできます。カメラマンやイラストレーターがデジタル作品を販売したり、音楽データや電子書籍などの販売も可能です。 当記事では、そんなデジタル商品を登録・設定してWooCommerceで販売する方法を解説...
できること
commonの主な特徴は以下の通りです。
- 商品画像にウォーターマーク（透かし）を追加できる
- サンプル動画などで商品をPRできる
- 商品ページへの導線を工夫できる
- ブログメディアとして集客できる
- 小規模〜大規模サイトまで柔軟に対応できる
もちろん物理的な商品の販売も可能ですが、いずれもプラットフォームにはない高いデザイン性とカスタマイズ性で実現できます。
用途
commonは、次のようなご要望にお応えできます。
「デジタルコンテンツを自身のサイトで販売したい」
「スタイリッシュな販売サイトで運営したい」
「ブログなどのコンテンツで集客できるようにしたい」
写真家やイラストレーターの方の作品販売サイトなどはもちろん、動画クリエイターやセミナー動画のほか、教育系のレッスン動画などの販売にもご活用いただけます。
WordPressテーマ「common」の機能概要
commonに実装されている機能は、すべてクリエイターの商品販売のサポートとなります。丹精を籠めてつくられた作品をいかにかっこよくブランディングするのか。どのように購入に至る導線をつくるのか。
そのような点をサポートするcommonの機能概要をご紹介いたします。
- 3タイプのトップページヘッダー
- 3タイプのページレイアウト
- ヘッダーメッセージ
- ヘッダー/フッターのバナー
- 商品画像のウォーターマーク
- 商品を動画でPRする機能
- 商品CTA
- メガメニュー
- ランキングページ
- ランディングページ
3タイプのトップページヘッダー
トップページのヘッダースライダーを次の3タイプから選択可能です。
商品スライダー（商品ページと連動）
まずは商品の販売ページへの直接の導線となる商品スライダー。
商品を登録しているなら、自動的にトップページヘッダーに表示されます。おすすめ商品やセール中の商品などを指定して任意の順番（新着/人気/ランダム）で表示可能です。
コンテンツスライダーA（画像/mp4動画）
オリジナルのヘッダー画像やmp4動画を表示できるコンテンツスライダー。
ご自身で制作したヘッダー画像やmp4動画を背景にして、オリジナルのキャッチフレーズを登録できます。画像自体に文字入れしている場合は、サイト内外を問わずリンク先を設定してバナーとしても活用可能です。
コンテンツスライダーB（画像/mp4動画）
こちらも画像やmp4動画を設定できるスライダーですが、デザインが異なります。
デザインされたテキストエリア内にキャッチフレーズのほか、「作品集を見る」という部分にリンクボタンを表示できます（文言変更可能）。
主にサイト内の商品販売ページや複数の商品をまとめたページへリンクさせることを想定した仕様です。
3タイプのページレイアウト
各ページのレイアウトも3タイプから変更いただけます。
サイドバー左
サイドバー（ウェジェットエリア）の表示位置は左右から選択できて、無しにもできます。ショップ開設当初でコンテンツ量が少ない場合は、1カラムでも運営いただけるということです。
各ページごとに配置を設定できます。
表示するウィジェットやページの性質に合わせて変更可能です。
一例としてデモサイトでは、ブログやお知らせ記事などの読んでいただくことが目的のページにはサイドバーを右に配置しています。
ヘッダーメッセージ
サイトの最上部に任意のテキストとリンクを設定できる機能です。
全ページで最上部に表示されるため、期間限定のキャンペーンや緊急告知などにお使いいただけます。ヘッダーバーの背景色や文字色は自由に変更可能です。
ヘッダー/フッターのバナー
ヘッダーやフッターには、お好みでバナーを追加できます。
指定の商品をまとめた特集ページや、内外部のリンクとしてご活用ください。指定の商品をまとめて表示する方法は下記記事を参考にご覧いただけます。
WooCommerceでは用意されているショートコードを使うことで、セール中の商品や売れ筋の商品、個別で指定した商品のみを表示するページを作成できます。表示する順番なども自在に指定できるので、商品をさまざまな角度から訴求可能です。 そこで今回は、WooCommerceの商品一覧ページをショート...
ヘッダー/フッターのバナーは下記のような仕様となっており、両方とも最大6つまで登録可能です。
- ヘッダーバナーは、カルーセル式でトップページのみに表示
- フッターバナーは、読み込みごとに全ページにランダム表示
必ずしも設定は必要はなく、下記のように非表示にもできます。
商品画像のウォーターマーク
商品ページ内の画像には、オリジナルのウォーターマーク（透かし）を表示可能です。
サイト内の作品画像をスクショされたり、不正ダウンロードして利用されることを防ぎます。写真やイラスト作品などを販売する方に便利な機能です。画像を一つ一つ加工する手間もありません。
拡大した画像には、四隅にウォーターマークが入る仕様になっています。
画像素材販売のセキュリティとなる上、本格的なデジタルコンテンツ販売サイトというブランディングにもつながります。
商品を動画でPRする機能
商品ページ内のメイン画像には、代わりに動画も設置できます。
映像作品やセミナー動画などを販売する際に、サンプル動画を設置してご活用可能です。デジタルコンテンツはもちろん、物理的な商品でも動画でPRできます。
mp4形式の動画のほか、YoutubeやVimeoの動画も埋め込み式で設置可能です。
動画配信サイトで公開しているコンテンツをそのままサンプル動画として活用できて、デジタルコンテンツと相性が良いです。
商品一覧ページには、
商品CTA
ブログやお知らせ記事から、商品販売ページへ繋げるCTAがあります。
WordPressサイトなので、ブログコンテンツからのマーケティングに対応した仕様です。ネットショップの顧客に対して有益な情報発信を行うことで、商品購入へのきっかけになります。
コンテンツマーケティングは奥深いので無限に切り口はありますが、一例としてTCDとしては次のような使い方をご提案しています。
デモサイトでは写真家の作品販売サイトをイメージしているため、以下の通りです。
- ブログ記事：撮影テクや裏話など、カメラ好きの顧客の興味に関する情報発信
- お知らせ記事：作品のリリース（新商品の追加）や、イベント情報など
CTAは以下の2タイプから選べるので、それぞれ用途別に使い分け可能です。表示/非表示/タイプは記事個別に設定できます。
タイプA
商品を個別にアピールするためのCTAです。商品ごとのIDで指定して任意の数だけ表示できます。デモサイトではお知らせ記事内に表示しています。
タイプB
3つの商品をカテゴリーごとにアピールするCTAです。カテゴリーや並び順などを自在に変更可能。デモサイトではブログ記事内に表示しています。
メガメニュー
commonには2種類のメガメニューがあります。
デモサイトでは以下の箇所です。
- メガメニューA：メニュー項目「ITEM」に商品カテゴリーを表示
- メガメニューB：メニュー項目「BLOG」にブログ記事を表示
メガメニューBはブログ記事のタイプや並び順を指定して表示するタイプです。
一方、メガメニューAは、商品カテゴリーに限らず、画像/テキスト/リンクを自由に設定いただけます。外部リンクを設置してもいいですし、サイト内の任意のページにリンクさせることも可能です。
ランキングページ
固定ページテンプレート「ランキングページ」では、商品を販売個数順で表示できます。
商品カテゴリー別にソートして表示可能です。左側に表示されているサイドカテゴリーボタンクリックすることで、ワンタッチで商品が変わります。
スマホでは画面上部に商品カテゴリーが表示され、同じくタップで商品が変更されます。
カテゴリー別の人気商品を瞬時にチェックできる機能です。
ランディングページ（LP）
固定ページテンプレート「ランディングページ」は、独立した特設ページなどの作成に便利な機能です。ヘッダーバーやフッターを非表示にできたり、コンテンツの横幅も3タイプからお選びいただけます。
メインのコンテンツは通常のエディタを使って自由に作成可能です。
デモでは一例として次のようなページをつくっています。
- LPサンプル1（ヘッダーメッセージ無し/ヘッダーバー無し/フッター無し/コンテンツ横幅「普通」）
- LPサンプル2（ヘッダーメッセージ有り/ヘッダーバー有り/フッター有り/コンテンツ横幅「広い」）
- LPサンプル3（ヘッダーメッセージ無し/ヘッダーバー有り/フッター有り/コンテンツ横幅「狭い」）
ショップの会員登録や商品販売ページへの導線として運用を想定しています。LPの内容に合わせて設定を変更してみてください。
高機能でお洒落なネットショップをつくるなら「common」
WordPressテーマ「common」の機能概要を解説いたしました。端的にまとめると以下が大きな特徴です。
- デジタルコンテンツに適した高機能な商品販売ページ
- あらゆる箇所から商品ページへ繋げられる導線設計
手前味噌ですが、これらを不自然でない美しいデザインで表現いただけます。
高機能でかつ、スタイリッシュなネットショップがつくれる「common」は、ぜひこだわりを持ったクリエイターに使っていただきたいテーマです。
第1回：デジタルコンテンツとは？
第2回：おすすめのデジタルコンテンツは？
第3回：デジタルコンテンツ販売対応のWordPressテーマ（当記事）
第4回：デジタルコンテンツの売り方
第5回：デジタルコンテンツ作成のおすすめツール
第6回：デジタルコンテンツが売れない原因と対策
コメント