当サイトには広告が含まれております

コーポレートサイトにもかっこいいテーマ Lightning でコーポレートサイトを作るーその1

この記事は最終更新日から7年経過しています。内容が古い可能性があります。

毎月行っている八王子WordPressもくもく会ですが、今回コーポレートサイトを作るときにかっこよくて使いやすい(んじゃないか?)と思われるテーマがあるという噂を聞きました。
聞いてみるとコーポレートサイトを作るときに人気のBizVektorを作っている会社が新しく出したLightningというテーマです。ぱっと見たところデザインも新しい感じで、同時に開発されているプラグインによって色々と便利なことができそうです。
このLightningテーマを使って、コーポレートサイトを作るとしたらどうなるか?ということを試してみようと思います。まずはインストールからです。

記事をざっと見る

コーポレートサイトにもblogサイトにも向いているテーマLightning

Lightningというテーマがどんな感じなのかは2つあるデモサイトを見ると、わかりやすいです。

コーポーレートサイトのデモサイト
http://demo-ja.lightning.vektor-inc.co.jp/

bizVektorと同じようにコーポレートサイトとして、しっかりした印象のデザインでできあがっています。

ブログサイトのデモサイト
http://sk8-life.info/

これが同じテーマ?と思えるほど全く違う印象のサイトになっています。Recent Postsにある画像付きの一覧とかとってもかっこいいですね!

このテーマLightningを使ってコーポレートサイトを作るとどんな感じになるのか?ということを試してみたいと思います。

Lightningをインストールする

Lightningテーマをインストールします。

ダッシュボード 外観>テーマ をクリック

新規追加をクリック



lightning
と入力して力強くリターン(^_^;

テーマが複数表示されますが、この画像のテーマが今回使おうとしている Lightning です。



インストール
をクリック

有効化 をクリック

これでLightningテーマのインストールと有効化が終了しました。

Lightningの推奨プラグインをインストールして有効化する

Lightningテーマは一緒に使うと便利なプラグインが2つあるようです。インストールした後の 外観>テーマ の上部に

このように表示が出ているので プラグインをインストール をクリック

インストール推奨プラグイン の一覧が出るので一番上のチェックボックスをチェックします。

下にあるリストボックスの  をクリックして、インストールを選択

適用 をクリックします。

このような表示が出てインストールが終了します。

さらに 外観>プラグインをインストール をクリック

インストール推奨プラグイン の一覧が出るので一番上のチェックボックスをチェックして

下にあるリストボックスの  をクリックして、有効化を選択

適用 をクリックします。

これで推奨プラグインの準備が終わりました。

Lightningをインストールした状態を確認してみる

現在のサイトはtwentysixteenのテーマが使われています

img_5782f092209d5

こんなかんじでした。そこにLightningをインストールして有効化して再度読み直すと

このようになります。文字の大きさなどがだいぶ読みやすく、Bootstrapが使われているためかボタンなどが統一感があり、スッキリした印象です。

スライドショーを編集して表示する

まず、カスタマイズの1歩目として、スライドショーをカスタマイズして表示したいと思います。

ダッシュボード 外観>カスタマイズ をクリック

カスタマイズのページでは今現在の表示が出ているはず、なんですがあれれ?スライドショーが動いている!?実際のトップページではスライドショーは表示されていませんでした…うむ。。。とにかく

Lightningトップページスライドショー をクリック

このようにデフォルトの画像が入っているので、自分の画像に置き換えてみます
置き換えたい画像はあらかじめ 1900×500ピクセル の大きさにしたものをメディアにアップロードしておきます。

画像の変更をクリックして、

使いたい画像を選択してから 画像の選択 をクリック

画像が置き換わります。同じ要領でスライド画像2と3を置き換えます。
すべて置き換えたら

保存して公開 をクリック。表画面を見ると、

先ほどまで表示されていなかったスライドが表示されました(^^)/。うーん、不思議ですが私の場合はスライドショーが表示されていませんでしたが、自分の画像にして保存したら表示されるよう二なりました。

コーポレートサイトのデモっぽいサイトを作るための変更箇所を確認

スライドショーをカスタマイズしてから、次は…と思ったときにはたと気づきました。カスタマイズする箇所はとっても多そう!ということに。

今カスタマイズしたスライドショー以外に、デモのコーポレートサイトに近づけるためにカスタマイズしたいところはとてもたくさんありました。一つ一つカスタマイズしていきたいと思いますので、今回はインストールとスライドショーの修正にとどめて、別の記事で一つずつカスタマイズしていこうと思います。

まとめ:テーマLightningはコーポレートサイトだけでなくブログでも使ってみたい!

コーポレートサイト向けのテーマはなかなかないため、最初Lightningのお話を聞いたときに、ぜひコーポレートサイトで使ってみようと思いました。しかし、今回記事を書きながらブログのデモサイトを見たら「これは!ブログでもすごくよさそう」と思いました。

このブログサイトをいっそのこと置き換えてしまいたい…ぐらいにかっこいいと思いました(実際にはfunctions.phpにかなり手を入れているためなかなか難しそうですが)。

Lightningは、コーポレートサイトだけでなくブログサイトにも強くお勧めしたいテーマです!

Lightning関連記事一覧

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

[ryus_blogcard url=”https://usortblog.com//lightning-corpo-1/”]
[ryus_blogcard url=”https://usortblog.com//lightning-corpo-2/”]
[ryus_blogcard url=”https://usortblog.com//lightning-corpo-3/”]
[ryus_blogcard url=”https://usortblog.com//lightning-corpo-4/”]
[ryus_blogcard url=”https://usortblog.com//lightning-kotheme-slider-interval/”]
[ryus_blogcard url=”https://usortblog.com//lightning-slider-string/”]

[amazon_searchlink search=”WordPress デザイン”]

この記事が気に入ったら
いいね または フォローしてね!

あなたのシェアが励みになります!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

記事をざっと見る