コンテンツを綺麗に見せる 【WordPress プラグイン】


blueWaterコンテンツを綺麗に表示させるための おすすめのプラグインを紹介します。

Crayon Syntax Highlighter

ソースコードなどコードを綺麗に表示させるプラグインです。巷でもチラチラ見かけ、使用される上位に入るのではないでしょうか?評価も100件以上あり、5星が大半です。

白黒のコードではなく、キーワード表示ができるため、綺麗です。

やろうとしても、昔はガリガリHTMLで色つけていた時の大変さは並大抵ではありませんでした。

https://wordpress.org/plugins/crayon-syntax-highlighter/screenshots/

メリット

  • シンプルな表示もカラフルな表示もできる。
  • 大抵の言語に対応でき、困ることは使っていてもほぼ無い。
  • 極端に重くない。
  • 個人的に重視したのはコピペが簡単にできることです。(他のハイライトでは行数がくっついてきてしまったり、一手間必要なときもあったりしましたがこれは、すぐコピペできる表示があります。別ウィンドウ開いてコピペもできます)
  • もちろん、色付けの労力からの開放が半端ないです。
  • 使ってみたところ修正も簡単で、ソースコードをクリックしてボタンを押せば、同じコード範囲を認識してもらえます。(最初たまに失敗しましたが。)
  • 特定行のハイライトもできますので、記事が書きやすいですね。

3,4番目が他のプラグインに比べて良い所ではないでしょうか。「SyntaxHighlighter Evolved」 より軽いかもしれません。

デメリット

やはり、少し重い部分があります。やや引っかかる感じがあるぐらいですので、使い続けています。重くなってきた人は highlight.jsに流れる人もいるようです。

 

使い方は、まず普通のプラグインと同じようにインストールします。その後に投稿を編集するときにボタンから開き、そこにコードを挿入し、カラーリング、言語を指定します。たったこれだけで使えるようになります。

<>のボタンやCrayonというクレヨンボタンで作成できます。

他の細かい使い方や設定方法は、有名なのでそこそこ情報があります。

使用例 使用例2

FancyBox for WordPress

ライトボックスと言われる、画像などを画面にポップアップされたウィンドウでまるでスポットライトが当たるように表示させるプラグインです。

https://ja.wordpress.org/plugins/fancybox-for-wordpress/screenshots/

私は主に、レイアウトバランスのために小さく表示してこのプラグインでクリック時に大きく表示させるという使い方を良くしています。また動きも気持ち良いです。

ふわっと 記事内の画像が画面中央に 薄暗い背景とともに浮き出たり、スカッと画像を登場させたり、スライドショーなども表示できます。

使用の決め手は

使うのが簡単、見た目がよく動きも綺麗でそれぞれまずまず設定の種類が選べる。からです。

また重いと感じることはありません。

使用方法

使うのは簡単です。ただリンク付きの画像を挿入すれば自動的に感知してくれます。

FancyBox が動かない時は こちらを参考にしてください。

まずは 2015年3月頃の最新版(ver 3.06)を入れてください。その前の版ではクロスサイトスクリプティング攻撃により、リダイレクトの脆弱性があります。悪意のあるページに知らずに飛ばされたりアクセスされてウィルス等を仕込まれる事も有り得ます。

実態のないあやふやな  ISも 3.02で攻撃しかけたそうです。

Bookmark this on Yahoo Bookmark
Buzz This
Bookmark this on Delicious
Bookmark this on Digg
Share on reddit
Share on LinkedIn
Bookmark this on @nifty clip
LINEで送る
email this
Pocket




コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です