WordPress

超オススメ! カスタマイズも可能なLightBox風WPプラグイン「FancyBox for WordPress」

Fancybox for wordpress

記事内の写真をクリックすると、その写真が浮き出るように表示される「LightBox」表示は人気がありますよね。
私もさっそく取り入れました。

LightBox風のプラグインはかなりの数あります。その中でもインストールするだけで使えて、さらに見た目を設定でカスタマイズできる「FancyBox for WordPress」を使うことにしました。

インストール

いつもの手順ですね。

  1. プラグインを検索
  2. ダッシュボードでプラグインの項目から「新規追加」を選択します。
    キーワードに「LightBox」と入力して検索しましょう。
    Fancybox for wordpress 2

  3. インストール
  4. 3番目に出てきました。
    「いますぐインストール」をクリックします。
    Fancybox for wordpress 3

  5. プラグインを有効化
  6. インストールが完了したら「プラグインを有効化」しましょう。
    Fancybox for wordpress 4

  7. 効果を確認
  8. これで記事内のイメージをクリックすると以下のように「LightBox」風に表示されます。インストールするだけでいいのでカンタンですね〜。
    Fancybox for wordpress 5

デフォルト設定だけでもいいのですが、せっかくなのでカスタマイズしてみます。

カスタマイズ

  1. 設定項目を確認
  2. ダッシュボードの設定項目に「Fancybox for WP」というものがあります。
    これでいろいろ設定できますよ。
    Fancybox for wordpress 6

  3. 見た目をカスタム
  4. デフォルトでもいいのですが、私がやったカスタムは以下です。

    • 写真の背景を「黒(#000000)」に
    • 背景の透明度を「0.8」に
    • 写真のタイトルを非表示

    Fancybox for wordpress 7

  5. 機能をカスタム
  6. 記事内の写真を移動できる矢印を表示させるようにしました。
    Fancybox for wordpress 8

  7. カスタム結果を確認
  8. カスタムの結果以下のようになりました。
    背景は黒に近いほうが写真が映えますね。
    写真間の移動もできるようになったので便利になりました。
    満足♪ 満足♪
    Fancybox for wordpress 9

インストールするだけでも使えますが、
カスタムもカンタンなのでお好みに仕上げて使いましょう!
オススメ!

関連記事

  1. Google AnalyticsのWPプラグイン「Google Analyticator」を導入してみた

    WordPress

    Google AnalyticsのWPプラグイン「Google Analyticator」を導入して…

    Google Analyticsを導入したいと考えたときにWordPr…

  2. WordPressの基本的な設定項目をおさらい3「表示設定」篇

    WordPress

    WordPressの基本的な設定項目をおさらい3「表示設定」篇

    WordPressの設定項目のおさらい。こういうのはすぐに忘れてしまう…

  3. WordPressのバージョンを確認する方法

    WordPress

    WordPressのバージョンを確認する方法

    WordPressのバージョンを確認するにはダッシュボードの表示を調整…

  4. トップページ

    WordPress

    サイトにトップページをつけた

    従来型のサイト、ということで、トップページをつけた。個別のページとブ…

  5. top

    WordPress

    blogデザイン更新。

    ちょっと久しぶりにデザイン更新。シンプルに、blogへのリンク画像…

  6. 検索フォーム

    WordPress

    検索フォームを追加。

    ますますブログっぽくなってきた。検索するとこんな感じで表示される…

最近の記事

  1. ホワイトハウスコックスの財布
  2. 進撃の巨人展FINAL チラシ
  3. 【無印良品】ゴールデンウィーク中のご飯にレトルト買い込み!
  4. 世代ど真ん中だった!!『週刊少年ジャンプ展 vol2』
  5. デジタル通貨を買ってみた記録!とりあえず元は取っている!
  6. 【コレクション】カードダス:SDガンダム外伝シリーズ
  7. 懐かしい!!カードダスSD戦国伝!!

アーカイブ

  1. MTG

    【MTG】「ギルド門侵犯」発売記念FNMで記念プロモもらってきた
  2. Route7

    アート

    雨の日の車窓風景をリアルに描いた絵画
  3. プロダクト

    パロディ・デザインが逸品のDARTSLIVEカードを衝動買いした! その名も「ダ…
  4. 日常

    出発
  5. 【無印良品】刺激が少ない洗顔ミルク「洗顔ミルク・敏感肌用」

    無印良品

    【無印良品】刺激が少ない洗顔ミルク「洗顔ミルク・敏感肌用」
PAGE TOP