WordPressテーマ「Lightning」をカスタマイズ(その6)インフォメーションの設置

WordPressテーマ「Lightning」をカスタマイズ(その6)インフォメーションの設置

「Lightning」は株式会社ベクトルが開発した無料のWordPressテーマです。

Lightning – シンプルでカスタマイズしやすいBootstrapベースのWordPress公式テーマ

前回に引き続き、Lightningのカスタマイズ「その6」。

今回はカスタム投稿タイプを使います。

前回はここまで進行しました↓

これを最終回までに、以下の状態にまでカスタマイズします。

北福岡歯科クリニック | 北福岡駅より徒歩2分の痛くない歯医者
(架空のサンプルサイトです)

~ 目次 ~

  • 「カスタム投稿タイプ」とは?
  • カスタム投稿タイプマネージャー
  • カスタム投稿タイプの設定
  • インフォメーションコーナーの設置
  • インフォメーションの投稿
  • 「VK ExUnit」は使いやすい!
  • 今回はここまで

「カスタム投稿タイプ」とは?

今回は、企業や店舗サイトに定番の「インフォメーションコーナー」を設置します。

サイト運営者がWordPressの強みを生かして、制作会社に頼らずに自前で更新できるように設定します。

インフォメーションは、通常の投稿タイプを使わずに「カスタム投稿タイプ」にて実装します。

そもそも「カスタム投稿タイプ」って何ぞや?という人は、下記の2サイトを参照されてください。

WordPressでカスタム投稿タイプを作成する方法【初心者向け】

カスタム投稿タイプとカスタムタクソノミーまとめ

要は通常の「投稿」とは別系統の、独自の投稿タイプを設定するということですね。

本サイトでは、通常の投稿はスタッフブログとして使い、インフォメーションはカスタム投稿タイプで実装します。

カスタム投稿タイプマネージャー

通常、カスタム投稿タイプを実装するには2つのパターンがあります。

◇PHPファイルをいじる(function.php)
◇プラグインで機能を追加する(Custom Post Type UIなど)

私は今までは後者の「Custom Post Type UI」を使うことが多かったです。

ですが、このLightningに付属しているプラグイン「VK ExUnit(VK All in One Expansion Unit)」には、「カスタム投稿タイプマネージャー」という機能が付いており、簡単かつ素早くカスタム投稿タイプを実装することが可能です。

カスタム投稿タイプの設定

では早速、実装してみましょう。

まず、WP管理画面の「VK ExUnit」を開きます。

「カスタム投稿タイプマネージャー」にチェックを入れ、変更を保存します。

さらに、「設定」をクリック。

「カスタム投稿タイプ設定」が開くので、「新規追加」をクリックします。

「新規投稿を追加」の画面で、タイトル・投稿タイプID・有効にする項目をそれぞれ入力し、公開ボタンをクリックします。

本サイトでは、
◇タイトル:Information
◇投稿タイプID:info
◇有効にする項目:タイトル、本文、アイキャッチ画像
で設定しました。

すると、WP管理画面左サイドに「Information」という項目が追加されました。

さらに、ウィジェット設定画面に「サイドバー(Information)」というエリアが追加されました。

また、カスタム投稿タイプ作成後は、WP管理画面の「設定」⇒「パーマリンク設定」で必ず一度保存をかけてください。

これをやらないとカスタム投稿の投稿記事が表示されません。
(*パーマリンク設定がデフォルトの場合は不要)

これで「カスタム投稿タイプ」の設定は完了です。

インフォメーションコーナーの設置

次に、ウィジットを使ってインフォメーションをトップページに表示します。

場所は「診療・受付時間」と「所在地・地図」の間に設置します。

WP管理画面より「外観」⇒「ウィジェット」と開き、トップページコンテンツエリア上部に「VK_最新記事」というウィジットを入れます。

ウィジェットの各項目に必要事項を入れ、保存ボタンを押します。

ここで重要なのは「表示したい記事タイプ」には、カスタム投稿タイプの「投稿タイプID」で設定したIDを入れます。
本サイトでは「info」になります。

これ以外でもウィジェットでインフォメーション関連記事を扱う場合は、「記事タイプ」や「ポストタイプ」のIDを「info」にします。

トップページ中段にインフォメーションコーナーが出現しました。

まだ、何も投稿してないので見出しのみです。

インフォメーションの投稿

インフォメーションはWP管理画面「Information」より投稿してください

通常の投稿とほとんど同じです。

タイトル・本文・アイキャッチ(必要ならば)を入れて投稿します。

投稿がトップページに表示されます。

これをクリックするとインフォメーションの個別投稿ページが開きます。

この時点ではまだサイドバーの領域が空白のままです。

WP管理画面の「外観」⇒「ウィジェット」より、「サイドバー(Information)」エリアに表示したいウィジェットを入れます。

サイドバーにウィジェットが反映されました。

「VK ExUnit」は使いやすい!

とまあ、こんな感じでカスタム投稿タイプを使って、インフォメーションを設置しました。

実際にカスタム投稿の設定をした人なら分かると思いますが、PHPファイルをいじったり、プラグイン「Custom Post Type UI」を使うよりも、Lightningの「VK ExUnit」ははるかに簡単です。

「Custom Post Type UI」は定番のプラグインですが、なんと言っても入力項目が多くて、あれを見た初心者さんは途方に暮れると思います。
また、外国産なので日本語表記がこなれてなくて、意味不明な記述が多いです。

それに比べると「VK ExUnit」のカスタム投稿機能はシンプルながら簡単明瞭で分かりやすいです。

今回はここまで

さて、ここまでのカスタマイズ結果です。

トップページ中段にインフォメーションコーナーが鎮座しました。

さてさて、次回は「全幅コンテンツ」の実装についてです。

 

ken
思ったよりも長文記事になってしまいました ε= (++ )

 

関連記事

WordPressテーマ「Lightning」をカスタマイズ(その9)よくある御質問ページの作成

2017.10.16

WordPressテーマ「Lightning」をカスタマイズ(その8)スライドショーの調整・他

2017.10.09

WordPressテーマ「Lightning」をカスタマイズ(その7)全幅コンテンツの実装

2017.10.02

WordPressテーマ「Lightning」をカスタマイズ(その5)3PRの変更・その他

2017.09.18

WordPressテーマ「Lightning」をカスタマイズ(その4)見出しの変更・その他

2017.09.08

WordPressテーマ「Lightning」をカスタマイズ(その3)フォントの変更・クレジットの非表示

2017.09.04

WordPressテーマ「Lightning」をカスタマイズ(その2)WP管理画面からのカスタマイズ

2017.08.28

WordPressテーマ「Lightning」をカスタマイズ(その1)準備編

2017.08.21

テーマの知識が無いと困る!? 今後のWordPress制作

2017.08.09