Lightning Fort は Lightning のデザイン・機能を更にパワーアップするプラグインです。

デモサイトを見る

ヘッダー機能拡張

より結果を出しやすくするためにヘッダーを強化

ウェブサイトは存在しているだけでは意味がありません。ビジネスにおいてはあくまでも問い合わせなどのアクションを得る事が目的です。

そのためにヘッダーに電話番号問い合わせボタンを配置しました。

また、ユーザーがより使いやすくなるようにサブナビゲーションを配置する事が可能で、加えてPC閲覧時には画面左上にサイトのキャッチコピーも表示されるようになっています。

※商品のデモサイトにてご確認ください。

ヘッダーに問い合わせボタンや電話番号などを表示 (Origin Pro との比較)

『お問い合わせボタン』と『電話番号』はカスタマイザーで設定します。

 

PCなどの場合

管理画面の『外観』→『カスタマイズ』からカスタマイザーを起動して、左のメニューに『ExUnit 設定』というセクションが表示されるので、そこから『お問い合わせ情報』を設定します。

※この商品を利用する際には、必ず無料の機能拡張プラグイン VK All in One Expansion Unit をインストール(有効化)してください。
こちらのプラグインを同時利用しない場合、表示が正常にできないことがありますのでご注意ください。

VK All in One Expansion Unit についてはこちら

 

スマホなどの場合

画面が狭い端末で表示している時は、ヘッダーには設定されているロゴのみが表示されます。

ナビゲーションはカスタマイザーの『メニュー』より設定してください。
サブナビゲーションをモバイルにも適用させる場合は、ウィジェットエリアの『モバイルナビ上部』あるいは『モバイルナビ下部』に「ナビゲーションメニュー」ウィジェットを利用して設定できます。

※「モバイルナビ上部」「モバイルナビ下部」は「外観 > カスタマイズ」画面でメニュータイプ「VK Mobile Nav」が選択されている状態の時に表示されます。

電話番号/問い合わせボタンについては、モバイル用のナビ内に表示させる事ができます。
カスタマイザーの『ウィジェット』→『モバイルナビ上部 / モバイルナビ下部』のエリアに、「VK_お問い合わせ情報」ウィジェットや「VK_お問い合わせボタン」ウィジェットなど、必要に応じて自由に要素を設定してください。

カスタマイザーから自由に設定できます。

 

タイトルのテキストスタイル

明朝体のタイトルで雰囲気がぐっと変わる

テキストのスタイルによってホームページの印象は大きく変わります。

Lightning Fort では、明朝体でタイトルを表示させることでより洗練されたエレガントな雰囲気を演出しています。

Origin Pro はゴシック体で表示、Origin Pro Fort では明朝体で表示されます。

その他ボタンなどの特徴

各種ボタン

フラットデザインやマテリアルデザインが登場してから数年たった現在では、ほとんどがカラーベタ塗りか、四角いアウトラインで囲ったミニマムな表現が主流になってきています。

このようなボタンを取り入れることでスタイリッシュな印象になります。

少しだけ立体感を加えることでユーザビリティも意識したデザインに仕上げました。

 

リンクボタン

四角いボタンでスタイリッシュに。

 

お問い合わせ情報

他のボタンと合わせて角のあるボタンに。

 

シェアボタン

ミニマムなボタンにしました。

 

サイドバーのメニューアイコン

メニューアイコンが表示されるようになりました。

Media Post ウィジェット / アーカイブレイアウト機能

Media Posts ウィジェット

WordPressは投稿された情報を条件によって絞り込んで表示する事を得意としていますが、Media Posts ウィジェットではその強みを最大限活かし、投稿タイプ・カテゴリーを指定した上で、様々なレイアウトで配置する事ができます。

※見出しの装飾は各デザインスキンに依存しますので下記の画像とは異なります。ご購入前にご希望の商品のデモサイトをご確認ください。

 

160910-0002

160909-0010160909-0011

160909-0012

160909-0013

160909-0014

160909-0015

表示する記事のオフセットで、複数のレイアウトを組み合わせて表示可能

通常は公開日付が新しい順に表示しますが、例えば新しい記事の4件目から表示するという事も可能です。この機能によって、例えばMediaPostウィジェットで1件だけ A のレイアウトで配置、その下にまたMediaPostウィジェットを設置し、見出しを空欄にした上で今度はBのレイアウトを選択して表示記事のオフセットを 1 にすれば、ウィジェットとしては2つのウィジェットを使用していますが、見た目は一つのグループとしてまとまります。

Media Post ウィジェットを複数組み合わせたレイアウト例

Media Post ウィジェットを複数組み合わせたレイアウト例

トップページの拡張ウィジェットエリアを拡張

無料で利用出来る標準のLightningではトップページのコンテンツエリアのウィジェットエリアは1つですが、Varietyではトップページでより多くのバリエーションを実現出来るようにさらに4つのウィジェットエリアを用意していますので、コンテンツエリアだけで合計4つのウィジェットエリアが利用可能です。

拡張されるウィジェットエリア

拡張されるウィジェットエリア

Media Posts ウィジェット用の画像のリサイズ

Media Posts ウィジェットでは独自の画像サイズを利用していますのでアップロード済みの画像について、プラグインを利用して画像を再生成してください。

登録済みの画像を一括リサイズするプラグイン Regenerate Thumbnails

ページヘッダーカスタマイズ機能

ページの訴求力を高めるページヘッダーカスタマイズ機能

ページを開いてまず初めに目にとまるのがヘッダー画像です。ヘッダー画像によってページの中身に興味を持ってもらえるか左右されると言っても過言ではありません。

さらにはページの雰囲気も決まってきます。ページヘッダーカスタマイズ機能では以下の項目をカスタマイズする事ができます。

  • トップページ以外のヘッダー画像を投稿タイプ別に指定する事ができます。
  • 固定ページでは、各固定ページ編集画面より個別にヘッダー画像を指定する事ができます。
  • 固定ページでは親ページで画像が指定されている場合、下階層のヘッダー画像は親階層の画像が自動的に適用されます。
  • ヘッダー画像上の文字色(固定ページであればページ名 / その他のページの場合は投稿タイプ名)
  • 文字の影の色
  • 文字の位置(左・中央・右)

ページごとに画像を選定することで、ページを訪れたユーザーの興味を惹き付けましょう。

もちろん基本設定もあるので、むやみに変更する必要のないページは共通の画像を表示させておくことも可能です。

  • このページで掲載している画面はデザインスキン JPNSTYLE適用時のサンプルです。JPNSTYLE以外での利用時は書体・余白などが異なります。
  • 投稿ページ(post)は各投稿個別で画像を設定できません。

 

 

設定について

基本となるヘッダー画像はカスタマイザーで設定します。

管理画面の【外観】→【カスタマイズ】からカスタマイザーを起動して、左のメニューに【Lightning ページヘッダー 設定】というセクションが表示されるので、そこから [ 基本 ] [ 投稿 ] [ 固定ページ ] [ メディア ] の4つが設定できます。

この画像が各ページごとに設定できます。

この画像が各ページごとに設定できます。

カスタマイザーの 【Lightning ページヘッダー 設定】を選択

カスタマイザーの【Lightning ページヘッダー 設定】を選択

カスタマイザーの【Lightning ページヘッダー 設定】を選択する または ヘッダー画像の鉛筆マークをクリックすると直接編集セクションにジャンプします。

初期設定の状態

何も設定されていない状態では、初期設定の画像がヘッダー画像として読み込まれています。

画像の上に表示する文字色などを設定

ページヘッダー画像の上に表示される文字の色を設定できます。
また、シャドウの色や文字を表示させる位置も設定できるので、ヘッダー画像の色味に併せて適宜設定してください。

画像を選択するとヘッダー部分に反映

画像を選択するとヘッダー部分に反映

【画像を選択】から画像を選ぶと、ヘッダー部分に反映されます。【削除】【画像の変更】で自由に選択し直すことができます。

ページヘッダー画像[基本]を設定すると、固定ページや投稿ページのすべてのヘッダー画像が設定されます。

投稿ページ用ヘッダー画像設定

ページヘッダー画像[投稿]に画像を設定すると基本設定の画像は反映されず、投稿用のヘッダー画像が表示されます。

投稿ページは共通画像のみの設定となっており、記事ごとでの設定はできません。

固定ページ用ヘッダー画像設定

投稿ページと同様に、[固定ページ]で設定された画像が表示されます。

固定ページに限り、それぞれの固定ページで違うヘッダー画像を設定することができます。

【Choose Image】各固定ページで別々の画像を設定できる

【Choose Image】で各固定ページで別々の画像を設定できる

個別で設定したい固定ページの編集画面を開き、【ページヘッダー画像】のカスタムフィールドで【Choose Image】から個別の指定画像を設定します。

個別の設定画像が表示される

個別の設定画像が表示される

拡張デザインスキンの設定

1. デザインスキン ( プラグイン ) をインストールする

管理画面からアップロードする場合

  • 「管理画面」→「プラグイン」→「新規追加」画面※1に移動します。
  • 「プラグインのインストール」画面でタイトル下の「アップロード」※2をクリック
「管理画面」→「プラグイン」→「新規追加」画面に移動、タイトル下の「アップロード」をクリック

「管理画面」→「プラグイン」→「新規追加」画面に移動、タイトル下の「アップロード」をクリック

  • 「ファイルを選択」ボタン※3をクリック。
  • アップロードするプラグインのファイルを選択※4して「開く」ボタン※5でアップロード

プラグインファイルを選択

アップロードするプラグインのファイルを選択して「開く」ボタンでアップロード

  • 「いますぐインストール」※6をクリック
「いますぐインストール」をクリック

「いますぐインストール」をクリック

  • 「プラグインを有効化」※7をクリックします。
「プラグインを有効化」をクリック。

「プラグインを有効化」をクリック。

FTPなどで直接アップロードする場合

公式サイトからダウンロードできるプラグインの他に、一般のサイトで公開されているプラグインも多数ありますので、それらを利用する場合は /wp-content/plugins/ フォルダにアップロードします。

  • /wp-content/plugins/ フォルダに、ダウンロードしたファイルを解凍してアップロード
  • 管理画面左メニューの「プラグイン」を開くと、インストールされているプラグインの一覧が表示されます。
    アップロードしたプラグインが含まれているはずですので、有効化をすると利用出来るようになります。

 

2. デザインスキン ( プラグイン ) を切り替える

ダッシュボードでプラグインを有効化したあとに、【外観】>【カスタマイズ】でカスタマイザーを起動します。

  1. 「Lightning デザイン設定」のセクションを開いてください。
  2. 「デザインスキン」のプルダウンに先程有効化したデザインスキンを選択します。
  3. 設定が完了したら「公開」ボタンを押して保存。
  4. 公開ボタンを押したらページを再読込してください。再読込しないとデザイン及びスキン固有の入力欄などが正しく表示されません。

注意事項

対応アプリケーション WordPress 4.9 以降
Lightning 4.4.0 以降
Lightning Advanced Unit 
3.3.0 以降
対応ブラウザ 下記ブラウザ最新版
* Chrome
* Safari
* Firefox
* Eddge
ライセンス GNU General Public License version 2
※一つのプラグインの購入で複数のサイトにご利用いただけます。
販売価格 販売価格 7,980円(税抜)

※楽天ID決済でご購入のお客様はメールアドレスが取得できませんので、将来的に商品アップデート通知やアップデートデータを受け取れなくなる可能性があります。DLmarketの都合上、楽天ID決済を使えなくする事が出来ないので、楽天ID決済をご利用の方は、上記についてご理解の上ご購入ください。


デモサイトを見る

DL-MARKETで購入


▼必ずお読みください▼

※本拡張デザインスキンはテーマではなく『プラグイン』です。プラグインとしてインストールして下さい。
プラグインのインストールについては「プラグインの説明と設定方法」をご参照下さい。
プラグインの説明と設定方法

更新履歴

 

Fort Version リリース 動作確認済 Lightning 変更箇所
1.2.0 2018.06.01 4.4.11 [ 仕様変更 ] Font Awesome5 対応
1.1.1 2018.04.28 4.3.0 [ ファイル整理 ] 前回のアップデートファイル容量が2Mを越えており、管理画面からのアップデートでエラーになる場合があるため軽量化
[ デザイン調整 ] トップページスライドショー上の文字サイズ調整
1.1.0 2018.04.24 4.2.0 [ 機能追加 ]
PR コンテンツウィジェット機能を追加
1.0.2 2018.03.20 4.1.5 [ 不具合修正 ]
管理画面のビジュアルエディタの不具合修正
1.0.1 2018.03.08 4.1.5 [ 不具合修正 ]
翻訳不具合修正
1.0.0 2018.02.15 4.1.4 初版リリース

Lightning JPNSTYLE

「JPNSTYLE」適用時にヘッダー画像をページごとに設定していただくことができます。標準でページ背景やタイトルアイコンに和テイストのパーツが設定できるようになっているので、和風サイトに適しています。

無料の多機能プラグイン「VK All in One Expansion Unit(通称:ExUnit)」を同時に利用することで、柔軟なサイト制作が可能です。