Lightning でコーポレートサイトを作る VK EX Unitプラグインでウィジェット ーその4

Lightningというテーマはコーポレートサイトを作る際に簡単に「ちゃんとした感じの企業サイト」が作れます。そのインストールやカスタマイズについて、今まで3回にわたってblogを書いてきました。
今回はlightning推奨プラグイン VK EX Unitプラグインでウィジェットを使って、ウィジェットを追加したりフッターメニューを追加したりします。これでLightningテーマを導入してカスタマイズが完成します!

今まで行ったLightningテーマのカスタマイズ

今までに行ったLightningテーマのカスタマイズは

毎月行っている八王子WordPressもくもく会ですが、今回コーポレートサイトを作るときにかっこよくて使いやすい(んじゃないか?)と思われるテーマがあるという噂を聞きました。

「コーポレートサイトにもかっこいいテーマ Lightning でコーポレートサイトを作るーその1」では、Lightningというテーマについての説明と、インストール、スライダー

Lightningというテーマを使うとコーポレートサイトがいい感じに作れる、ということで今まで2回に渡ってカスタマイズの方法を書いてきました。Lightningのコーポレートサ

の3記事に渡って書いてきました。

今時点で

こんな感じにできあがっています。残っているカスタマイズは、

5カ所あります。このカスタマイズはVK EX Unitプラグインウィジェットフッターメニューの追加になります。

カスタマイズ1 VK_お問い合わせボタン

1 のお問い合わせボタンを追加します。これは VK_お問い合わせボタン というウィジェットです。

お問い合わせ情報を追加してからウィジェットを作ります。情報の追加を先に行います。

管理ツールバーの VK ExUnit>メイン設定 をクリック

お問い合わせ情報 をクリック

このように入力欄が開きますので

内容を入力して、変更を保存 をクリック。

次にウィジェットを入れます。

ダッシュボード 外観>ウィジェット をクリック

VK_お問い合わせボタンをクリックし、サイドバー(トップページ) をクリックしてから ウィジェットを追加 をクリック

このようにVK_お問い合わせボタンが入るので、

最近の投稿 の下に移動します。

このようにお問い合わせボタンが入りました。

カスタマイズ2 VK_最新記事ウィジェット

今の時点ではWordPressの機能でblogが表示されています。この形だとちょっと長くなってしまうので、最新記事をよくあるコーポレートサイトっぽく日付とタイトル/カテゴリーだけの表示にしたいと思います。

このウィジェットは VK_最新記事 ウィジェットです。

ダッシュボード 外観>ウィジェット で、

VK_最新記事 ウィジェットをクリックし、トップページコンテンツエリア上部 をクリックしてから ウィジェットを追加 をクリック

このようにウィジェットの設定が表示されますので、

表示形式 日付/カテゴリー/タイトル を選び、記事数 5 に変更して 保存 をクリック

表画面を見ると

最新記事がいい感じに表示されています。しかし…下にまだ今までの記事一覧が残っています。これを消すには、と考えてあまりいい手は浮かばなかったのですが、こんな感じで対応しました。

新規固定ページでタイトルを top としただけで、公開 をクリック。

外観>カスタマイズ をクリック

固定フロントページ をクリック

このようになっているので

固定ページ にチェックを入れて フロントページtop を選択し、

保存して公開 をクリック

これで最新記事の下に何も表示されなくなりました。

カスタマイズ3 フッターメニュー

3はフッターのメニューです。これを追加するには、

ダッシュボード 外観>メニュー をクリック

新規メニューを作成 をクリック

メニュー名に フッターメニュー と入力して、 メニューを作成 をクリック

今回は固定ページから2つメニューを作りたいので、固定ページの すべて表示 タブから表示したいページを選びます

2つチェックを付けて メニューに追加 をクリック

選択した固定ページがメニュー構造のところに入りました。あとはメニュー設定 の Footer Navigation にチェックを入れてメニューを保存 をクリック

フッターメニューが表示されました

カスタマイズ4 VK_プロフィール

フッター部分の左側に会社情報のようなものが表示されています。これは VK_プロフィール ウィジェットです。

ダッシュボード 外観>ウィジェット で、

VK_プロフィールをクリックし、フッターウィジェットエリア1 をクリックしてから ウィジェットを追加 をクリック

設定入力画面が開きます。これを、

このように入力して 保存 をクリック

フッターの左側にこういう感じで表示されました。

カスタマイズ5 VK_FB Page Plugin

ふ~、いよいよ最後のカスタマイズです。フッターの右にあるFacebookPageの埋め込みを行います。これは VK_FB Page Plugin を使って行います。

ダッシュボード 外観>ウィジェット で

VK_FB Page Pluginをクリックし、フッターウィジェットエリア3 をクリックしてから ウィジェットを追加 をクリック

設定入力画面が開きます。これを、

このように入力して 保存 をクリック

Facebookページが埋め込まれました(^^)/

カスタマイズが全部終わりました

ということで4回にわたって書いてきた Lightning テーマの適用とカスタマイズが終了しました!

元のページは、

img_57833fee08c80

こういう感じでしたが、

こんな感じに、だいぶコーポレートサイトっぽく!なった気がします(^^)/

実際にこのデザインを適用するにはあと、各ページのサイドブロックの設定とスライダー画像の入れ替えが必要そうですがそれだけ終われば実際のページで公開できそうです!

多少手順は多いですが、やること自体は難しいことはないのでじっくりこつこつやれば1日あればテーマの書き換えは終わるかと思います。

今度はblog中心のサイトでこのLightningテーマを使ってみたいなとも思いますので、またそのときには記事を書こうと思います。

Lightning関連記事一覧

Lightningについて書いた記事をまとめておきます

毎月行っている八王子WordPressもくもく会ですが、今回コーポレートサイトを作るときにかっこよくて使いやすい(んじゃないか?)と思われるテーマがあるという噂を聞きました。

「コーポレートサイトにもかっこいいテーマ Lightning でコーポレートサイトを作るーその1」では、Lightningというテーマについての説明と、インストール、スライダー

Lightningというテーマを使うとコーポレートサイトがいい感じに作れる、ということで今まで2回に渡ってカスタマイズの方法を書いてきました。Lightningのコーポレートサ

Lightningというテーマはコーポレートサイトを作る際に簡単に「ちゃんとした感じの企業サイト」が作れます。そのインストールやカスタマイズについて、今まで3回にわたってblo

テーマLightningを使って実際のWebサイトを作っています。いくつか変更したいことがあるので、子テーマを作りました。作りました、といってもLightningは子テーマが用

テーマLightningを使って実際のWebサイトを作ったときに、スライダーの上に文字を表示したいなと思いました。スライダーはトップページに大きく表示されるのですが、スライダー

[Amazon sponsored link] WordPress デザイン 関連本
兎本美佳

ブログを見た人がそのままできたらいいなと思って、できるだけ丁寧に書いています。blogに書いたようなネタの有償対応のご相談は「ゆうそうと」へいただければと思います(^^)/
無償での対応をご希望の場合は、コメントをいただけましたら可能な場合はコメントを返させていただきます。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク
スポンサー広告
ブログをメールで購読

メールアドレスを記入して購読すれば、更新をメールで受信できます。

259人の購読者に加わりましょう

コメント

  1. […] 参考サイト https://usortblog.com/lightning-corpo-4/#VK […]

トップへ戻る