WordPressで年表や沿革を簡単でおしゃれに実装する方法

はじめて商品を購入する会社や、取引をしたことがない会社だと、不安になる人も多いでしょう。会社の沿革や年表をホームページに表示させると、会社のこれまでの歴史を多くの人に知ってもらうことができるので、ユーザーからの信頼を得られるなど、さまざまなメリットがあります。一見、複雑な作業が必要だと思われますが、WordPressのWebサイトでも簡単に、沿革や年表を導入することが可能です。この記事では、WordPressで年表や沿革を簡単かつおしゃれに実装する方法について解説します。

自社サイトに沿革や年表を表示する意味

自社サイトに沿革や年表を表示させるのは、会社の運営において非常に重要な意味をもちます。ユーザーにとって、サイトを運営している会社がどのような会社なのかを知ることは大切です。利用したことがない会社であれば、本当に信頼できるかどうか、求めるサービスを受けられるかどうか、ユーザーも不安になります。商品の購入やサービスを利用してもらえるかどうかは、まず会社の信頼を得ることからはじまるといっても過言ではありません。そのため、ユーザーの目線に立ち、会社の情報を提供することが求められます。

Webページには、社名や所在地、問い合わせ先、個人情報の取り扱いに関する確認事項など、基本的な情報を記載するのはもちろん大切です。さらに、会社の歴史がわかる情報を盛り込むことで、ユーザーからの信頼をより厚いものにすることができるでしょう。

年表は沿革以外におしゃれな使い方もできる

年表は、会社の歴史などを紹介する沿革に使われるケースが多いですが、沿革以外の使い方もできます。使い方によっては、おしゃれなサイトを作るためのツールとしても活躍する機能です。例えば、商品のデザイン変遷など。ハイブランドのアイテムや時計など、歴史のある商品を紹介する場合、商品のデザイン変遷として年表を作成すると、見やすくおしゃれなページになります。長い歴史のある商品であればあるほど、ユーザーはその歴史にも付加価値を見いだします。商品の歴史を、商品価値に結びつけて販促を行うのも1つの戦略になるでしょう。

また、デザイナー個人に焦点を当てて紹介する場合も、文字だけを並べるより年表を活用するとわかりやすくなります。そのデザイナーがいつから活躍し、どのような経歴や過去の業績があるかを紹介することも、商品や会社の信頼感へとつながります。年表を活用して、デザイナーや商品の魅力を高めましょう。さらに、スケジュールにも年表が活用できます。購入の流れやスケジュールを説明するときに、年表を活用すると見やすくなります。

例えば、商品ができるまでの工程の説明や、発注から発送までの流れなどです。文章だけで説明をすると、時間の流れがうまく伝わらない場合もあります。しかし、年表を使って楽しくおしゃれに紹介すれば、ユーザーもいつ商品が手元に届くのかをイメージしやすくなり、安心です。このように、年表は会社の沿革以外にも、サイトをおしゃれで見やすくする使い方もできるのです。

WordPressに年表を実装する方法とは？

WordPressに年表を実装するには、対応しているテーマを利用する方法があります。年表を表示させる機能のあるテーマを使えば、管理画面から設定することで、簡単に年表を作成することが可能です。複雑なコードの記述も必要ないので、初心者でもすぐに設定できるでしょう。しかし、対応しているテーマはあまり多くありません。どのテーマを選択するかによって、年表だけではなく、Webサイト自体の雰囲気も変わってしまいます。対応しているテーマの種類が少ないため、自社のイメージに合ったテーマを探すのは難しくなるでしょう。

WordPressで年表を実装させるもう1つの方法は、プラグインを使う方法です。プラグインを使えば、簡単におしゃれな沿革や年表を実装させることができます。テーマのように、レイアウトやデザインなど、ほかの部分に影響を与えることもありません。すでに使用しているテーマで、年表を実装させたい場合は、プラグインを導入して設定するといいでしょう。

年表を実装できるプラグイン：Elementor

「Elementor」は、年表を簡単に実装できるプラグインです。「Elementor（Elementor Page Builder）」は、WordPressのページビルダープラグインで、ドラッグ＆ドロップでページを作成できるという大きな特徴があります。テキストはもちろん、画像やアイコンなどを自由に変更できます。ページ毎のカスタマイズができるので、WordPressのテーマに左右されにくく、好きな箇所に年表を表示させることが可能です。また、操作のほとんどがドラッグ＆ドロップで行えるので、直感的に作業できます。複雑なコーディングも必要ありません。そのため、年表を表示させる設定においても、初心者でも簡単に操作ができるでしょう。

さらに、「Elementor」は日本語対応です。日本語で設定することができるので、操作に困ることもないでしょう。「Elementor」はさまざまなサイトで紹介されているプラグインです。そのため、使い方に迷ってしまったときも多くの情報があり、すぐに調べられます。基本的な操作や応用した操作など、情報量が豊富です。「Elementor」と一緒に使用するアドオン（プラグイン）を導入すれば、さらにデザインや機能を追加することができます。「Elementor」は、年表を実装させるのに適しているだけではなく、Webサイトの自由度を高め、制作時間の短縮につなげられるプラグインです。

「Elementor」をインストールするには、管理画面の「プラグイン」を選択して、「新規追加」をクリックします。すると、「プラグインを追加」という画面が表示されるので、右上にある検索窓に「Elementor」と入力して検索しましょう。そして、「Elementor Page Builder」というプラグインが表示されるので、「今すぐインストール」ボタンを押して、インストールを完了させます。インストールができたら、プラグインを有効化して「Elementor」の導入は完了です。「Elementor」は、WordPressの公式ホームページからダウンロードすることも可能です。

「Elementor」は無料のプラグインですが、「Elementor Pro」という有料版もあります。無料版でも十分な操作ができますが、Pro版ではTempleteやさらに豊富なウィジェットが使用可能になります。「Elementor Pro」のインストールは無料版のインストール方法とは異なり、公式ホームページからインストールしなければなりません。購入画面で料金の支払いを完了したあと、メールアドレスとパスワードでログインします。そして、「My Account」のページから「DOWNLOAD PLUGIN」をクリックします。ダウンロードが完了したら、WordPressの管理画面から「プラグイン」を選択し、「新規追加」をクリックしましょう。

「プラグインのアップロード」に「Elementor Pro」のプラグインファイルが追加されているはずです。そして、「今すぐインストール」ボタンを押し、プラグインを有効化したら完了です。

投稿や記事を年表表示する方法

「Elementor」をインストールして有効化したら、年表を表示させる設定を行いましょう。ここでは、投稿や記事の一覧を年表表示する方法について解説します。まず、「Elementor」の「ELEMENTS」タブを開き、検索窓で「EA Post Timeline」を検索します。つぎに、「EA Post Timeline」を「+」または「Drag widget here」にドラッグ＆ドロップしましょう。これで、年表表示の準備は整いました。続いて、年表のレイアウトを設定していきます。「コンテンツ」タブを開き、「クエリ」と「レイアウト設定」の入力を行いましょう。

「クエリ」の「ソース」では、投稿ページや商品ページなど、どの記事を年表表示させるかについて選択することができます。ドロップダウンで、年表表示させたい記事や投稿を選択しましょう。選択したあと、投稿者やカテゴリー、タグなどでコンテンツを絞り込むことも可能です。表示させたくない投稿がある場合は、その投稿を非表示にすることができます。また、年表を表示させる際、1ページあたりの投稿数や表示順を設定することも可能です。「レイアウト設定」では、画像の有無や抜粋の表示などをボタン1つで簡単に切り替えることができます。

画像のサイズ変更もここから設定できるので簡単です。投稿の一覧などであれば、新規記事も自動で表示させることが可能になります。「スタイル」タブでは、年表表示におけるタイトルや背景の色などをカスタマイズできます。このように、「Elementor」では、簡単な設定で投稿や記事を年表表示させることが可能です。さらに、画像の有無や色の変更などカスタマイズ性に優れているので、よりオリジナリティのある年表を作れます。「Elementor」を導入すれば、自社のWebサイトにマッチする年表も作りやすいでしょう。

任意のコンテンツを年表表示する方法

「Elementor」では、投稿ではなく、任意のコンテンツを年表表示させることも可能です。これは、記事の一覧を年表のように表示する機能で、任意で記事や投稿を選択して表示させることができます。また、自由に文章を入力して年表表示させることもでき、自由度の高さが魅力です。「Elementor」の編集画面には、それぞれのコンテンツごとに編集できる項目が用意されているので、その項目を編集することで簡単に表示内容を変更することができます。コンテンツのタイトルや、投稿日、画像などの編集も、各コンテンツの編集画面から設定可能です。

コンテンツを年表表示させるには、まず年表を表示させるコンテンツの種類を選択する必要があります。投稿またはページから選択します。必要であれば、投稿の日付の降順、昇順の設定をしましょう。「レイアウト設定」から、ラベルテキストの編集やアイコンの選択も可能です。タイトルの表示または非表示も、ボタン1つで切り替えができます。基本的な設定を完了させたら、「スタイル」のタブからカスタマイズを行いましょう。「スタイル」では、5つのカスタマイズオプションを設定することができます。

「タイムラインスタイル」では、アクティブ時とそうでないときのタイムラインの色の選択をします。そして、「カードスタイル」では、余白やボックスの影などの微調整が可能です。文字を見やすくするために余白も設けたり、動きを出すためにボックスに影をつけたりすることができます。さらに、「箇条書きスタイル」においては、箇条書きのサイズや位置、境界線の幅を調整することができます。アクティブ時とそうでないとき、それぞれの箇条書きのスタイルを設定することも可能です。

「色と文字のスタイル」では、タイトルや日付、抜粋の文字のスタイルや色を変更することができます。「続きを読むスタイル」は、年表のコンテンツに表示される「続きを読む」ボタンの設定を行う箇所です。ボタンの余白を調整したり、ホバー状態とそうでないときの文字スタイルや色を編集したりすることができます。このように、任意のコンテンツを年表表示する場合もさまざまな設定が可能です。コンテンツ毎に編集する項目が用意されているので、実際に表示させる画面を見ながら操作することができるので扱いやすいでしょう。

また、「スタイル」タブで、レイアウトに関する細かい設定が可能なので、使用しているテーマに合わせたデザインにすることができます。ホバー状態やアクティブ時の設定もできるので、よりおしゃれで見やすいWebサイトにできるでしょう。投稿や記事を年表表示する場合も、任意のコンテンツを年表表示する場合も、「Elementor」を使えば直感的な操作でWebサイトに合った年表を作ることができます。会社の沿革や商品紹介など、年表を表示させたい内容に合わせて、表示方法を選択しましょう。

まとめ

会社の信頼を得たり、イメージアップを図ったりするうえでも、沿革や年表の挿入は大切です。商品の歴史や納品までのスケジュールなど、文字だけで羅列するよりも、年表を表示させたほうがユーザーにとって見やすくなるケースもあります。そのため、必要に応じて沿革や年表を取り入れるようにしましょう。WordPressで年表を表示させる方法には、年表表示に対応しているテーマを使用する方法もありますが、プラグインを利用したほうが自由度も高く、自社のイメージに合った年表を導入しやすくなります。プラグインを使っておしゃれな年表を実装しましょう。

この記事では、ドラッグ＆ドロップで直感的に操作できる「Elementor」を紹介しました。「Elementor」には、年表を表示するだけではなく、レイアウトを変更したり画像を挿入したりするなど、便利な機能がたくさんあります。このプラグインを利用すれば、初心者でも簡単に年表を表示させることができるでしょう。