TCDからついに100作目のテーマが登場しました。WordPressテーマ「BASARA」です。ネットショッププラグイン「WooCommerce」対応の、和風ECサイトがつくれるテンプレートとなっています。

ネットショップ作成ツールは巷に溢れていますが、汎用性の高い無難なデザインのものが大半です。ユーザーが手軽に作成できることを優先し、ブランディングは後回しにされているからとも推測できます。

たしかに販売する商材に関わらず無難にマッチするかもしれませんが、それは同時に商品やブランドの世界観を無視することにもなります。

一方でBASARAは、日本の美意識、侘び寂びを落とし込んだ和のブランディングに特化したデザインです。日本的な商品を扱うWebサイトに最適化されているということです。

お手軽なネットショップというよりは、「高級感溢れる和風の店舗サイト」で、オンラインショップも内包できるというイメージです。デモサイトでは、格式高い「老舗和菓子屋」をコンセプトとしています。

当記事では、そんなBASARAの基本的なスペックと機能概要についてご紹介いたします。

和風ECに特化したWordPressテーマ「BASARA」

BASARAのイメージ

販売ページ

高級感のある和風デザインが特徴のWordPressテーマです。縦書きテキスト、家紋風ロゴの設置、余白を取ったレイアウトので和の世界観を演出できるほか、ネットショッププラグイン「WooCommerce」を使えば、同サイト内で販売機能も追加できる高機能なテンプレートです。

和風の店舗サイトやブランディングサイトとECサイトを兼務できるつくりになっています。

基本仕様/できること

  • ネットショップ無しで店舗や企業サイトとしても使える
  • コーディング不要で和風デザインの実現
  • テキストの縦書き表示&アニメーション
  • 家紋風ロゴの設置機能(任意)
  • 店舗やブランディングサイトにオンラインショップを内包できる
  • mp4動画やYouTube動画も設置できる商品ページ
  • 一部の商品のみを特集したページを専用デザインで作成可
  • 売れ筋ランキングページを自動作成可

どんなサイトに向いているの

BASARAは、次のような商品を販売する店舗サイトに適しています。和風ブランディングが必要なサイトと親和性が高いです。

  • 和菓子
  • 日本茶
  • 日本酒・焼酎
  • 和食器などの焼き物
  • 和服・着物・和装小物
  • 和楽器
  • 日本画
  • 書道作品

デザイン上、和風の商品を扱うサイトを挙げましたが、もちろん横書きにもできます。BASARAのデモサイトを英語版でも用意していますので、横書きデザインの参考例としてご覧になってみてください。

>>英語版のデモサイトを見てみる

WooCommerce」を使わない場合は、販売機能無しのブランディングサイトや企業サイトとしても活用できます。

BASARAの機能概要

和風ブランディングと相性がよく、店舗や企業サイト、ECサイトまでつくれるBASARAの主要機能をこちらでご紹介いたします。

  • ロード画面
  • ヘッダーメッセージ
  • トップページ
  • 見出しロゴ
  • ショップページ
  • 商品ページ
  • 特集ページ
  • ランキングページ

ロード画面

サイトを訪問した時に最初に表示されるロード画面。BASARAでは、ロゴとテキストを同時に表示できるようにマイナーチェンジが加えられました(いずれかのみも可)。もちろん横書きにも対応しています。

BASARAのロード画面

>>デモサイトでロード画面を見る

和風サイトであれば、家紋風のロゴと縦書きテキストを表示するとかなり雰囲気が出ますね。背景色や文字色、フォントタイプやサイズなど自由に変更可能です。ロード画面はOFFにもできますが、トップページに一度のみ表示するオプションなどもあるので、ぜひご活用ください。
※デモでは「トップページには毎回表示する」設定になっています

ヘッダーメッセージ

店舗サイトやECサイトと相性のいい機能です。

 BASARAのヘッダーメッセージ

期間限定のお知らせや、一時的な注意書きなど。ユーザーの目につきやすいエリアなので、幅広い告知に利用いただけます。テキストにリンクもつけられますので、キャンペーンページやセールページへの導線としても使いやすい部分です。こちらも文字色や背景色を自由に変更可能です。
※デモでは表示していません。

トップページ

トップページはヘッダースライダーとコンテンツビルダーによって構成されています。まずは以下をスクロールして全体像を見てみてください。

BASARAのトップページ

縦書きテキストと広めにとられた余白が印象的な和風のレイアウトになっています。

ヘッダースライダー

ページトップでは白い枠で囲われたヘッダースライダーが迎えてくれます。

ヘッダースライダー

>>デモサイトのトップページを見る

画像を複数枚セットできて、それぞれに見出しと説明文を登録可能です。もちろん1枚だけも可。mp4動画やYoutube動画もセットできるので、トップページから印象的なサイトも制作可能。

メインコンテンツ

ヘッダースライダーより下部は、用意されているのコンテンツを組み合わせてレイアウトする仕様です。
(ゼロからエディタで作ることも可)

メインコンテンツ

上記は、「記事スライダー」(上)と「デザインコンテンツ」(下)を組み合わせている箇所です。

ブログやお知らせ記事、商品記事から表示する投稿タイプを選択して、記事スライダーとして表示可能です。お察しの通り、商品が無くても使えます。

デザインコンテンツは、画像とテキストエリアを組み合わせたBASARA独自のレイアウトです。左右の入れ替えはワンタッチでできますし、モバイル端末でも綺麗にレスポンシブ表示されます。

他にも一般的な記事一覧や、タブで表示記事が切り替わるタイプのものも用意されています。サイトに合わせてさまざまな組み合わせが可能です。

見出しロゴ・縦書き

見出しロゴや、縦書きのテキストもBASARAの特徴的な機能です。

縦書き・見出しロゴ

デモサイトでは、見出しロゴに家紋のようなロゴ画像をセットしています。老舗の和菓子屋や呉服屋さんなら家紋をそのままロゴ画像として設置するのがオススメです。トップページの見出しの上部に反映される仕様です。家紋が無くても、店舗や企業のロゴをセットするのもありです。

また、多くの縦書き箇所がありますが、いずれもワンタッチで横書きに変更できます。

アニメーションもタイプや、見出しのデザイン(背景の有無)も変更可能です。例えば、日本語版と英語版のブログアーカイブページではこのような違いがあります。

  • 日本語版
  • 英語版
縦書きブログアーカイブの例

ショップページ

ネットショッププラグイン「WooCommerce」を有効化して使えるショップページ。こちらもBASARAでは一味違います。

ショップページ(商品一覧ページ)を任意でカスタマイズできます。比較してみましょう。

  • 通常
  • カスタマイズ
一般的なショップページの例
カスタマイズしたショップページの例

全く雰囲気が異なりますよね。カスタマイズしたショップページには、ヘッダー画像にテキスト、商品カルーセルなどを設置可能です。

ヘッダー画像は複数設定すれば、クロスフェードで切り替わりますし、商品をピックアップしてカルーセルでアピールできます。デモサイトでは、カスマイズしたショップページを設定していますので、ぜひ実際の画面をご覧になってみてください。

>>デモサイトのショップページを見る

商品ページ

BASARAの商品ページでは、複数の画像や豊富なテキストエリアで商品を詳しくアピールできます。

商品ページ

商品画像は拡大して細部まで閲覧可能で、画像の右側のテキストエリアに加え、下部のタブエリアにも商品情報を追記可能です。WooCommerceのレビュー機能を使えば、より効果的ですね(レビューを有効化すると3つのタブに表示される仕様)。

>>デモの商品ページを見る

また、商品イメージには動画も設置可能です。mp4動画をセットするも良し、YouTubeにアップしている動画を埋め込むことも可能です。

>>動画をセットした商品ページを見る

画像や動画でアピールできる上に、レビュー機能もあるので販売ページとして申し分ない機能性です。

特集ページ

ショップページや商品ページの機能をご紹介しましたが、BASARAには、一部の商品をまとめて特集できる機能があります。例えば、こちらのページ。

特集ページ

>>季節のお勧め

ヘッダー画像、縦書きのテキストがあり、イメージ画像のあとに商品が並んでいます。これは「季節のおすすめ」というカテゴリーに属する商品のみを特別なレイアウトで表示している例です。

通常の商品カテゴリー(餅菓子・団子)でソートしたページは次のように表示されます。

通常のカテゴリーソートページ

シンプルにソートされるので、検索時には問題ないのですが、”特別感”を演出するには、物足りないですよね。そこで、一部の商品を特別なページで訴求するための「特集カテゴリー」機能をご用意しています。

デモサイトでは、一例として「目的で選ぶ」という特集カテゴリーを設定しています。見え方の違いをぜひご確認ください。

>>特集ページの一覧

ランキングページ

オンラインストアには欠かせないランキングページも実装されています。

ランキングページ

>>ランキングページ

売り上げ数または、レビュー評価順でランキングページをつくれます。集計期間や表示する商品数を最初に設定しておけば、売り上げ数やレビューに応じて自動で更新されます。特に商品数が増えてきたときに非常に有効な機能です。

和のブランディングに最適なBASARA

和風ブランディングと親和性の高いWordPressテーマ「BASARA」の機能概要をご紹介いたしました。

WooCommerce」で実装できる販売機能にも対応済みですが、店舗や企業のブランディングサイトとしても使える仕様がBASARAの強みです。

和風ブランディングサイトとして立ち上げて、ゆくゆくは同サイト内で商品販売も行う。

ブランディングが完成したECサイトは、他を寄せ付けません。無味無臭で無難なネットショップとは全く異なります。歴史ある実店舗の佇まいをそのままオンラインに投影できるので、あらゆるジャンルの老舗と相性のいいテンプレートです。

バサラのモックアップ

販売ページ