TCD WordPressテーマ第78作目となる最新のテーマ「FORCE」をリリースいたしました。今回のテーマのコンセプトは、チームの力です。「FORCE」というネーミングにもそういった意味合いを込めました。情熱をもつメンバーたちのエネルギー溢れる活動をWordPressテーマでサポートいたします。

結束力の強いチームや、活動力のあるグループやサークル。会社だって例外ではありません。同じ想いをもった人が集まる集団はどんな形であれチームです。弊社のように毎日会うことのないリモートワークの業務体制でも個々の熱量はなぜか伝わります。チームとして成り立つためには、そういった情熱が大切でしょう。

チームの情熱や活力を表現するのにピッタリなデザインでかつ、強力なマーケティング機能を搭載したテーマが「FORCE」です。その威力を当記事で紹介していきたいと思います。

躍動感やアクティブなイメージにマッチするテーマ「FORCE」

販売ページ デモサイト

デモサイトでは、サーファーのチームをイメージして制作いたしました。ダイナミックなスポーツの躍動感や、チームの情熱が伝わるコンテンツを意識しています。サイトを表示した際のインパクトは今までのTCDテーマでもトップレベルでしょう。ファーストインプレッションで強烈な印象を与えることができます。その他にもトップページに横幅いっぱいに表示されるギャラリー画像や、サイト下部に固定表示できるCTA機能でも抜群の訴求力を生み出します。

FORCEのイメージ動画も制作していますので、ぜひご覧ください。音が出ます。

ヘッダーコンテンツで圧倒的な存在感を放つチームロゴを設定可能

トップページのキャッチコピーや、リード文でサイトの印象は大きく変わりますし、重要な役割を果たす要素の一つです。ただ、言うまでもなくテキストは読まれなければその意味を果たしません。俯瞰した時の印象をテキスト量でコントロールすることはできますが、目に入るインパクトまで調整することは難しいはずです。

そこでFORCEではより単純かつ、強力に印象を残せる画像をセットできる仕様にしました。オリジナルのロゴや、チームエンブレムをヘッダーコンテンツ中央にセットするような使い方ができます。テーマオプションの設定画面で、プレビューを見ながら直感的にサイズ感を変更できるので、ロゴのサイズによって小さく表示されたり大きすぎるといった問題を簡単に回避可能です。

ベストなサイズ感で、あなたのチームのモットーを画像にするなど、工夫してみてください。スマホなどのモバイルデバイスとサイズ感を分けられるので、スマホでの見やすさも考慮することができます。次項で詳しく紹介いたしますが、FORCEはモバイル環境を特に意識した設計です。

トップページコンテンツ群をデバイスに合わせて最適化できる

できればFORCEのトップページの各コンテンツをスマホとPCで見比べていただきたいです。

デモサイトを見る

ヘッダーコンテンツ中央のリードコピーやページ内の各テキストなど。PC環境とは別のものが表示されていることがわかると思います。従来のテーマでは両方の環境でちょうど良く表示させるために、文字数などを意識してコンテンツを制作する必要がありました。

綺麗に収まれば問題ないのですが、そうでない場合、サイトの印象に響いてしまう場合もあります。スマホユーザーが多い時代に妙な箇所で改行されていたり、テキスト量によって異様に縦に長くなってしまうと見栄えが悪いですよね。人に見てもらうためには極力見やすく、綺麗にまとめられている方がいいに決まっているわけです。

PCでかっこいいのに、モバイル環境で不恰好だともったいないですし、最悪の場合サイト運営者のセンスが疑われたりするかもしれません。ここまでいうと煽っているように聞こえますが、逆にいえばデバイスごとにしっかりと設定するだけでサイトの印象がグンとレベルアップするということですね。

CSSを使って個別に設定する必要もなく、簡単に表示内容を分けられるように各コンテンツに入力欄を設置していますので、FORCEなら初心者の方でも安心です。

ちなみにモバイル用の項目を設定しない場合は、PCの設定が共通して反映される仕様なので、何もすべてを入力する必要はありません。コンテンツ量によってバランスの悪くなるものをチョイスして、それだけを設定すれば完了ということです。

またブログ記事や、お知らせ記事を表示しているコンテンツでは、モバイルでの表示件数も設定できます。サイト回遊率を考慮した時に、まるまる非表示にするのは躊躇するケースもあるでしょう。記事数を少なめにして表示するなどの工夫をすれば、モバイル端末での見栄えを整えつつ記事へのアクセスもキープできますね。

直感的な操作を追求したギャラリーページ制作機能

FORCEには、チームの活動の歴史や実績を映像や、画像でセットできるギャラリー機能を搭載しています。美しいフェードアニメーションが気持ちいいですね。デモサイトのようにギャラリーに西暦を設定したカテゴリーをセットすることもできるので、今までの歴史を振り返えるような使い方も可能です。

ギャラリーサンプルページ

またアーカイブページのカテゴリーソートタブは「全て」のタブ+最大4つまで1行で表示される仕様で、カテゴリーが少ない場合は自動でコンテンツ幅にフィットするようになっています。見栄えを崩してしまう心配はいりません。

で、最も弊社がこだわったポイントは、その編集画面の使いやすさです。例えば、以下のギャラリー詳細ページを編集画面と並べてご覧ください。

このように編集画面と実際にサイト上に表示されているギャラリーページが、かなり近いUIになっているわけです。しかも、各画像を上下左右にドラッグ&ドロップで並び替えることもできますし、表示するアイテム(画像 or 動画)を自由に追加することも可能になっています。

非常に直感的な操作でかつ、柔軟性も高いこのギャラリーページ機能なら、さくさく編集が捗るでしょう。後から「この写真の隣は、この動画がいいかな」といったような調整もドラッグ&ドロップで瞬間的に完了できますからね。

マニュアル不要、自動生成される印象に残るチームページ

FORCEに実装されているチームページで、チームメンバーの個性やメッセージを表現してみましょう。使い方はとても簡単で、WPユーザーなら正直マニュアルも必要ないぐらいかと思います。

WPデフォルトの操作手順と同様に、ユーザーを新規追加します。追加した各ユーザーの編集画面で諸設定を行い、そのユーザーをサイトに表示するかどうかを選択するだけです。それだけで、以下のようなスタイリッシュなチームページが自動生成されます。

チームアーカイブページサンプル

さらにアーカイブページのデザインは以下の二通りをご用意していますので、テーマオプションからいつでも切り替え可能です。

  • TEAM type1

チームメンバーの人数によってデザインを変えてみるとぱっと見の印象が結構変わりますからね。また、各ユーザーの編集画面でユーザーのカテゴリーを設定できるので人数が増えても便利にカテゴライズできる仕様となっています。

スポーツチームなら性別の他にポジションや、階級など、会社なら役職や、職種など。さまざまなカテゴリーを設定してメンバーを整理することができます。厳密には、投稿者のカテゴリーページが生成される仕様ではないのですが、アーカイブページにソートタブが表示されるので、カテゴリーごとにソートして表示させることができるというわけです。

チーム詳細ページサンプル

上記のようなチーム詳細ページで、詳しいプロフィールを設定でき、個人レベルの各種SNSボタンへのリンクも設置可能です。チームのサイトから個人のSNSなどにスムーズに連携できます。さらに先ほど紹介いたしましたユーザーカテゴリーの部分(以下赤枠)をクリックすると、アーカイブページの該当カテゴリーに遷移する仕様なので、同じカテゴリーのメンバーをすぐに確認できるはずです。

例えば、格闘技のチームが所属するジムなどでは、階級別にカテゴリーを設定すれば同じ階級にどんな選手がいるのか簡単に表示できますね。アーカイブページからも簡単にソートできますが、個人のプロフィールからも一発で遷移できるので、ちょっとした一手間を軽減できるわけです。

加えて、急にメンバーが変わったり、表示するメンバーの順序を変えたい場合などを想定して簡単に並び替えもできる仕様になっています。

WPデフォルトのユーザー一覧の画面で直感的に並び替えができるので、非常に自然な操作が可能です。

誰もが優れたマーケティング戦略を展開できる機能

直感的な操作性や、モバイル環境に適応させやすい仕様や特徴についてご紹介してきましたが、ここからはマーケティング面で活用できる機能を紹介いたします。

「LP用固定ページ」でスマートに量産する

まずは、WEBマーケティングに必要不可欠なランディングページを簡単に制作できる機能です。固定ページテンプレートの「LP用固定ページ」機能を活用すれば、かなり豊富なバリエーションでランディングページを制作できます。

以下で複数のバリエーション例をご確認いただけます。コンテンツや使っている画像は同じなので、デザインの違いをご確認ください。

ちなみにABOUTページも同じテンプレートを活用して制作しています。ヘッダーのデザインパターンを変更したり、ヘッダーやフッターを省いて、よりLP仕様に近づけたりすることが可能です。またページ内にはコンテンツビルダーを搭載していますので、ブロックごとの並び替えや、追加・削除が直感的に行えます。

テキストを入力する箇所では、クイックタグ機能もご活用いただけますし、通常のエディター通りメディアを追加することも可能なので、大枠のデザインをテンプレートで設定した上で自由にランディングページを構築できるわけです。

ランディングページは基本的に商品購買やサービス契約などのコンバージョン(成果)につながりやすくするために活用するページです。そのデザインやキャッチコピー、画像や動画などのコンテンツ、導線の配備によって大きく結果が変わります。なので数あるパターンのページで試行錯誤する必要があるのです。

そういった面から考えると、デザインのバリエーションやコンテンツの自由度が高い当機能が活かされます。ある程度枠組みがありながらも、直感的に編集が可能で随所に工夫を施せるからです。

ユーザーの行動を促し、計測できるCTA機能

次に活用できるのは、記事下やサイトフッター部分に表示できるCTA機能です。CTA(行動喚起)機能とは、訪れたユーザーを目的のページに誘導するためのテキストや画像のことですね。記事下CTAはデモサイトのこの部分です。

あなたがこの手のCTAを実際のサイトで発見した時、「期間限定」や「クレジットカード情報の入力が不要」などの文言があるのと無いのとでは、受け取る印象が大きく変わるでしょう。ユーザーが明確なメリットを感じられて、かつ安心できるような工夫が必要になるわけですね。画像については、商品やサービスが理解しやすいものをセットするのもいいかもしれません。

FORCEの記事下CTA機能では、あらかじめ用意された3タイプのデザインを選んで、リードコピーや画像をセットするだけです。3タイプの工夫をこらしたコピーや画像をセットして、どのCTAからのコンバージョンが高いのかを簡単に分析できる機能がテーマオプション内に搭載されています。

また、前述のランディングページ制作機能とこのCTA機能を組み合わせることで、さらに幅広いマーケティング戦略を練れると思います。サイト内でモノやサービスの購入などに繋げるページを作っておき、そのページに遷移させるような使い方ですね。

同じく以下のようにサイトフッターに表示させるCTA機能も3タイプの異なる文言や色で保存しておけます。もちろんこちらも分析が可能なので、色々なパターンで試してみてください。

このサイトフッターに表示させるCTA機能については、今後さらに深い分析ができるように表示させるページごとのコンバージョン率の測定が可能な仕様にアップデートする予定です。楽しみにしていてください。

チームの熱量を強力なサイトパワーへと変換する
WordPressテーマ「FORCE」

販売ページ デモサイト

FORCEならチームのこだわりや、熱量をWEBサイトでもしっかりと表現していけると思います。トップページのヘッダーコンテンツに表示されるチームロゴでインパクトを与え、デバイスごとに表示を切り替えられるコンテンツで見やすさに配慮する。

複数のユーザーが投稿しても、各ユーザーのプロフィールから遷移できるブログへの導線だけでなく、チームページ内の随所への導線もバッチリです。

それらに加えて強力なマーケティングツールが搭載されている上に、このカッコいいデザインです。直感的な操作を追求し、誰もが強力なサイトパワーを体感できるテーマになっています。ぜひあなたもFORCEを活用して溢れ出るポテンシャルを解き放ってみてください。