ワードプレスのテーマ LightningとExUnit
LightningはシンプルでカスタマイズしやすいBootstrapベースのWordPress公式テーマでGPLライセンス、カスタマイズ自由自在で商用利用可能です。 fontawesome、Bootstrapを実装していてレスポンシブデザイン。公式プラグインとの連携により高機能を実現しています。またWordPress公式ディレクトリに登録されているテーマなので、管理画面の「外観」から無料で簡単にインストールする事ができます。
さらに、無料の多機能プラグイン「VK All in One Expansion Unit（通称：ExUnit）」と併せて利用する事によって、コーポレートサイトやお店のホームページ、ブログなど簡単に構築する事ができます。
「ExUnit」もWordPress公式ディレクトリ登録プラグインなので、管理画面の「プラグイン」からインストールができます。「PR Block」「画像つき新着記事リスト」「プロフィール」「ボタン」「固定ページ本文」「CTA」「連絡先情報」をはじめ、需要の高いさまざまなウィジェットが使えます。ビジネスサイトやブログを作る上で必要な機能を網羅しているので、Lightningと併せて利用する事によって、コーポレートサイトやお店のホームページ、ブログなど簡単に構築する事ができます。
また、有料の追加プラグイン「Lightning Origin Pro」を使用しています。
WordPressテーマ「Lightning」標準のデザインスキン「Origin」使用時にヘッダーにメニュー・電話番号・問い合わせボタンを追加したり、ブログの3列の表示を可能にしたり、高機能なメディアポストウィジェットが利用できるようになるプラグインです。
ExUnitの設定（赤字は本サイトの設定値）
fontawesome link タグを出力
fontawesome を読み込むための link タグを html head 内へ出力します。使用中のテーマやプラグインで fontawesome を既に読み込んでいる場合はチェックを外して下さい。
アイキャッチ画像自動挿入
VK Blocks ( Beta )
Gutenbergのブロックを拡張します。
アイキャッチ画像自動挿入
タイトルタグの書き換え
head title タグ内へ出力される内容を VK EX Unit のルールで出力します。 ( VK EX Unit 側で wp_title() をフィルターフックでカスタマイズ ) 使用中のテーマやプラグインで title タグの内容を出力する場合はチェックを外して下さい。
アイキャッチ画像自動挿入
メタキーワードを出力
ヘッダーにメタキーワードを出力します。
アイキャッチ画像自動挿入
メタディスクリプションタグを出力
投稿画面「抜粋」欄に入力されたテキストを meta description タグとして html head 内へ出力します。使用中のテーマやプラグインで meta description タグを出力している場合はチェックを外して下さい。
アイキャッチ画像自動挿入
ソーシャルメディア連携
OG タグを html head 内へ出力します。
Twitter カードタグを html head 内へ出力します。
ソーシャルブックマークボタンを表示します。
Facebookページプラグインウィジェット
Follow me box を記事コンテンツ下のエリアへ表示します。
Main setting page から個別に機能を停止する事ができます。
アイキャッチ画像自動挿入
Google Analytics
Google アナリティクスのトラッキングコードを出力します。有効化した後「設定」のリンクより設定画面へすすみ Google アナリティクス ID を入力して下さい。使用中のテーマやプラグインで Google アナリティクスのトラッキングコードを埋め込む場合はチェックを外して下さい。
アイキャッチ画像自動挿入
ウィジェット
以下の機能を持ったウィジェットを追加します。各ウィジェットの設定は「外観」→「ウィジェット」の設定画面より行って下さい。
VK_最新記事 – 最新記事タイトルのリンクテキストと日付を表示します。
VK_固定ページ本文 – 固定ページのコンテンツ部分をウィジェットに表示します。
VK_プロフィール – ウィジェットに入力されたプロフィールを表示します。
VK_FB Page Plugin – Facebook ページプラグインを表示します。
VK_3PR エリア – 3PR エリアを表示します。
VK_カテゴリー/タグ リストカテゴリ・タグまたは、フォーマットリストを表示します。
VK_アーカイブリストアーカイブの一覧を表示します。月ごともしくは年ごとでの表示。また、ポストタイプを選択できます。
アイキャッチ画像自動挿入
CSSカスタマイズ
テーマデザインをカスタマイズする CSS を管理画面より追加できるようになります。追加する CSS コードは「VK Ex Unit」→「CSS カスタマイズ」の画面にて入力して下さい。
アイキャッチ画像自動挿入
子ページの一覧表示
指定した固定ページの下部へ、その固定ページの下層子ページの「ページタイトル / サムネイル / 抜粋文 / 該当ページへのリンク」をセットで一覧表示します。
アイキャッチ画像自動挿入
先祖階層からの子ページリスト表示
現在のページの先祖階層からの子ページリストをページ本文の下に表示します。
アイキャッチ画像自動挿入
お問い合わせ情報
お問い合わせ情報を本文の下に表示する
アイキャッチ画像自動挿入
HTMLサイトマップの表示
指定した固定ページにHTMLサイトマップを表示します。
アイキャッチ画像自動挿入
Call To Action
投稿内容の最後にCTAを表示します。
CTAは「Call To Action」の略で、ユーザーにとってもらいたい行動へ誘導するための情報を表示します。
例えば、無料サンプルのダウンロードページへの誘導のためのテキストやリンクボタンなどです。
アイキャッチ画像自動挿入
広告の挿入
記事に広告を挿入します
アイキャッチ画像自動挿入
関連記事を表示
関連記事を記事コンテンツ下のエリアへ表示します。
アイキャッチ画像自動挿入
管理バーメニュー
ExUnitのメニューを管理バーに表示する
アイキャッチ画像自動挿入
カスタム投稿タイプマネージャー
カスタム投稿タイプやカスタム分類を追加します。
アイキャッチ画像自動挿入
ページトップへ戻るボタン
ページトップへ戻るボタンは、画面の右下隅に表示されます。
アイキャッチ画像自動挿入
スムーススクロール
ページ内のアンカーリンククリックした際にスムーズにスクロースします。
※他のjsと干渉する事があります。独自にjsで制御している箇所をクリックしても正しく動作しない場合はこの機能を停止してみてください。
アイキャッチ画像自動挿入
Body class の追加
投稿タイプ名や固定ページのスラッグ名をbodyタグのクラスに追加します。
アイキャッチ画像自動挿入
ナビメニューclassの改変
メニューに投稿トップやカスタム投稿タイプアーカイブページが設定された時に、詳細ページや関連するカスタム分類ページを表示している時でも適切にcurrentクラスが追加されるように調整します。
アイキャッチ画像自動挿入
アイキャッチ画像を本文の最初に表示します。各記事毎に非表示にする事も出来ます。
アイキャッチ画像自動挿入
TinyMCE スタイルタグ
スタイルタグにTinyMCEエディタを追加する
アイキャッチ画像自動挿入
Bootstrap の CSS（grid/button/tableのみ）を出力
BootstrapのCSSを読み込むためのタグを html head 内へ出力します。使用中のテーマ（Lightningなど）やプラグインで Bootstrap を既に読み込んでいる場合はチェックを外して下さい。
ExUnitのメイン設定
トップページの<title>タグ
通常「サイトのタイトル」が全ページのタイトルタグに入ります。
例えば固定ページであれば
<title>固定ページ名 | サイトのタイトル</title>
というような形式で出力されます。
しかし、<title>の文字数が長くなりすぎると検索エンジンからの評価が逆に悪くなるので、サイトのタイトル は一番検索されたいキーワードを盛り込みつつなるべく短くまとめる事が望ましいです。
トップページでは
<title>サイトのタイトル | キャッチフレーズ</title>
というような形式で出力されます。
しかし、上記の形式では長くなりすぎる事があります。その場合は下記の入力欄に入力すれば、その内容が反映されます。
メタキーワード
共通キーワード設定 メタタグに入力するキーワードを入力します。ここでは全てのページで使用する共通のキーワードを設定します。複数ある場合は「,」で区切ってください。
* あまり深く考える必要はありません。現状のサーチエンジンではそこまで重要なファクターとはなりません。
* 個々のページのキーワードはそれぞれの投稿ページのキーワード入力欄から追加してください。それらと合わせて10個程度のキーワード数であることが望ましいです。
* 最後のキーワードの後ろに「,」は必要ありません。
【例】 WordPress,テンプレート,テーマ,無料,GPL
メタディスクリプション
メタディスクリプション 各ページの編集画面の「抜粋」欄に記入した内容がmetaタグのディスクリプションに反映されます
トップページのメタディスクリプションにはサイトのキャッチフレーズが適用されます。しかし、トップページに設定した固定ページに抜粋が記入されている場合はその内容が反映されます。
トップページのメタディスクリプションにはサイトのキャッチフレーズが適用されます。しかし、トップページに設定した固定ページに抜粋が記入されている場合はその内容が反映されます。
* 抜粋欄が表示されていない場合は、編集画面の右上に「表示」というタブがありますので、そこをクリックすると「抜粋」欄を表示するチェックボックスが出てきますので、チェックして下さい。
SNS Settings
OGPなどの投稿タイトルの変更 投稿タイトルだけにする（サイトタイトルなど含めない）。
facebookアプリケーションID
[ » アプリケーションIDを確認・取得する ]
※アプリケーションIDを入力しないとボタンやコメント欄が表示・正しく動作しません。
facebookのアプリケーションIDの取得方法についてよくわからない場合は「facebook アプリケーションID 取得」などで検索して下さい。
FacebookページURL
デフォルトのOGPイメージ Facebookの「いいね！」ボタンを押した際、ここで設定した画像が Facebook のタイムラインに表示されます。
ページにアイキャッチ画像が指定されている場合は、アイキャッチ画像が優先されます。
例) https://www.vektor-inc.co.jp/images/ogImage.png
画像サイズ 橫 1280px 縦 720px 以上、画像比率 16:9 を推奨します。
twitterアカウント @
OGタグ OGタグを出力する
OGタグの出力を選択して下さい。もし他のプラグインやテーマでOGタグを出力している場合は、このプラグインでの出力は必要ありません。
Twitterカードタグ Twitter カードタグを html head 内へ出力します。
ソーシャルボタン ソーシャルブックマーク（シェアボタンやtweetボタン）を表示します。
シェアボタンを表示しない投稿タイプ
投稿
固定ページ
イベント
シェアボタンを表示しない投稿のID
特定のポストのみSNSボタンを表示したくない場合、カンマ(,)区切りでポストIDを入力します。
空欄の場合はフィルタリングは行いません。
例 (12,31,553)
表示するボタン
Facebook
Twitter
はてな
Pocket
LINE (mobile only)
シェアボタンの表示位置
本文の前
本文の後
Follow me box Follow me ユニットを本文の下に表示する
Follow me box の見出しテキスト
Google Analytics設定
Google Analytics設定 このサイトで使用する Google アナリティクスの ID を入力して下さい。
UA-例) XXXXXXXX-X
アナリティクスコードの種類を選択して下さい。( 不明な場合この設定は省略できます )
推奨 ( gtag )
ユニバーサル アナリティクスのコード ( analytics.js )
ノーマルのコード ( analytics.js )
お問い合わせ情報
ここに入力された内容が各固定ページ下部や『お問い合わせ情報』ウィジェット、『お問い合わせボタン』ウィジェットなどに反映されます。
固定ページに表示する場合は、各固定ページの編集画面で"お問い合わせ情報の表示"にチェックを入れる必要があります。
メッセージ
例) お気軽にお問い合わせください。
電話番号
例) 000-000-0000
電話アイコン
例) fas fa-phone-square [ lcon list ]
営業時間 受付時間 9:00-18:00 [ 土・日・祝日除く ]
例) 営業時間 9:00 – 18:00 [ 土日・祝日除く ]
お問い合わせ先URL
例) http://www.********.com/contact/ もしくは /contact/
※ 未入力の場合、お問い合わせウィジェットには何も表示されません。
お問い合わせボタンに表示するテキスト お問い合わせ
例) メールでのお問い合わせはこちら
お問い合わせボタンに表示するテキスト2（オプション）
例) お気軽にお問い合わせください。
お問い合わせボタンウィジェットに表示するテキスト
このテキストはお問い合わせボタンウィジェットで使用されます。サイドバーでの利用を想定していますので少ない文字数で設定してください。
HTMLサイトマップ設定
除外ページ設定 HTMLサイトマップから除外したい固定ページのIDを入力してください。
複数のページを除外する場合は , （コンマ）で区切って入力してください。
Call To Action
投稿内容の最後にCTAを表示します。
CTAは「Call To Action」の略で、ユーザーにとってもらいたい行動へ誘導するための情報を表示します。
例えば、無料サンプルのダウンロードページへの誘導のためのテキストやリンクボタンなどです。
使い方
まずは投稿タイプCTAで、本文の最後に表示させたい内容を登録します。
下記のプルダウンで、投稿タイプ別に表示するCTAを選択して保存します。
投稿毎に表示するCTAを切り替えたい場合は、投稿などの詳細ページで設定してください。
CTAの一覧を表示
投稿
一覧ページを表示する
固定ページ
一覧ページを表示する
イベント
一覧ページを表示する
広告の挿入
Google自動広告
[ Google自動広告について ] Google自動広告を設定する場合はチェックを入れて、サイト運営者IDを入力してください。
Google自動広告を有効にする
サイト運営者ID
pub-
* サイト運営者IDは Google AdSense 管理画面 > アカウント情報 から確認できます。
アンカー広告を下部に指定する
* 自動広告の挿入によりレイアウトが崩れる事がありますが、広告の種類・仕様・利用中のテーマなどにより対応は様々ですので、表示崩れについては各自必要に応じてCSSを書いて修正してください。
投稿に広告を挿入 記事の直前 / moreタグの直後 / 記事の最後に広告を挿入できます。
２つのフィールドに分けて挿入すると、横並び（col-md-6）に表示されます。
広告を挿入 [ 記事の最初 ]
広告を挿入 [ moreタグ ]
広告を挿入 [ 記事の最後 ]
表示する投稿タイプ
投稿
固定ページ
イベント