Wizard In The Market
システムトレードの魔術師

*

バグ回避!Crayon SyntaxHighliterの上手な使い方

公開日: : 最終更新日:2014/10/29 Wordpress, Plugin

WS000147
先日の記事で、TinyMCE AdvancedとSyntaxHighlighter Evolvedを併用すると表示バグが生まれやすいという記事を書きました。そこで、そのバグの回避策としてCrayon SyntaxHighlighterの使用をお勧めします。

代替のSyntaxHighliter

前回紹介したバグを避けるためにも、ショートコードを使用しない形でSyntaxHighlighterを使用する必要があります。
その候補として、私がテストしたのはこの2つ。

WP SyntaxHighlighter

  • 表示の左上にWP SyntaxHighlighterのプラグインページへのリンクが入る。
  • コピー等のツールが少ない。

使い勝手はさほど悪くないものの、ほかと比べるとあまり使いたくないなぁといった感じ。
特に、左上に表示されるリンクが邪魔でした。

そこで、この記事でお勧めのCrayon SyntaxHighlighterです。

Crayoon SyntaxHighlighter

  • コピーなどのツールが豊富
  • カスタマイズ性にとみ、記事への追加にもヴィジュアルエディター用ツールがある

気軽に使え、ヴィジュアルエディタから簡単に編集ができるのが最大の利点。
SyntaxHighlighter Evolvedよりも機能的にかなり優秀です。

ちなみに表示内容はこのような形。

Crayon SyntaxHighlighterの使い方

プラグインのインストールは通常の方法で問題ありません。
WordPressプラグインの「新規追加」より、Crayon SyntaxHighlighterを検索して導入してください。

記事を編集する際には、2通りの方法で簡単にソースコードを記入できます。

ヴィジュアルエディタから導入する

ヴィジュアルエディタからは、Crayon SyntaxHighlighterを導入した時点でソースコード挿入用のボタンが追加されています。

WS000145

ボタンをクリックするとエディタが表示されます。

WS000146

ソースコードを記入し、言語を選択すれば完了です。
その他にも、ここで文字の大きさや表示の詳細設定を行うことができます。
それがヴィジュアルエディタから編集する利点です。

テキストエディタから導入する

上記のようなpreタグで囲い、langのあとを対応する言語で指定します。

このように、Crayon SyntaxHighlighterを使えば、ショートコードを使わずにpreタブが直接使えるためpreタブ自動挿入によるバグ避けることができるわけですね。

にほんブログ村 為替ブログへ 
Fx-Kirin

About Fx-Kirin

2009年10月にFXを開始、翌年2010年5月から脱サラをしてFX業界に専念。 2012年10月頃から本格的に勝ち始め、一月で資産を倍にする、2年半月間負けなし等、安定した収支で2013年11月に生涯FX収支が1億を超える。 投資スタイルはシステムトレード。プログラミングの知識がほぼない状態から、独学で自分がしたいと思うことであればほぼ実現することが可能なレベルまで成長。好きな言語はRuby, Python。必要となればC++からVBA、Pascal等なんでも行う。MT4/MT5のプログラミングも得意。 2011年にはFXで稼いだ資金をもとにシンガポールに移住し、留学も兼ねて起業をチャレンジするほど、ビジネスを興すことに熱意がある。国内の業者を主に使い始めたことから、2012年に帰国。零細株式会社経営中。

Adsense

  • このエントリーをはてなブックマークに追加
  • Pocket
  • 67 follow us in feedly

関連記事

おしゃれなTwitter Cardsをプラグインで簡単に表示する方法

Twitter Cardsはツイッターをしていると見ることが多い、おしゃれでなかなか良い感じの機能です。今日は記

記事を読む

もうデータ全消去も怖くない!WordPress全体をDropBoxにバックアップ

WPBlogというレンタルサーバをこのサイトでも利用しているのですが、怖いのがサーバ側のトラブルによるブログデータの

記事を読む

乗っ取られてからでは遅い!WordPressのログインのセキュリティを向上

WordPressはBrute Force Attackに弱い [bm url="http://wpdocs.sou

記事を読む

高さが変?Stinger3でTwitterの挿入のスマホ表示のバグの修正

ブログでのTweetの紹介はとっても便利 Twitter EmbedというWordpress用プラグインがあります。

記事を読む

簡単お手軽!Pluginでrobots.txtを設定!

今日もWordPressのプラグイン関係の記事です!Google Web Masterを使っている際に、なぜかクロールエ

記事を読む

WPBlogではPHPや外観の設定を変更してもすぐには反映されない

先日の記事にて、WPBlogがお勧めな理由をご紹介しました。 WordPressで運用を始めるならWPBlogがお勧め

記事を読む

概要がおかしい!そんなときのTwitter Cards Meta のバグ修正

こんにちは!キリンです。先日の記事で、Twitter Cards Metaを使えば簡単にTwitter Cardsが表示

記事を読む

セキュリティ向上、スパム対策にGoogle Captcaで画像認証!

昨日からの続きで、ログインページのセキュリティ向上や、コメントスパムの対応策としてGoogle Captch

記事を読む

これが原因か!TinyMCE AdvancedのStop Removingオプションは使わなほうが良い件

WordPressを使い建ての頃は、エディタの独特さと付き合うのが苦手でした。全部HTMLで作成してももちろ

記事を読む

WordPressで運用を始めるならWPBlogがお勧め

少しでも生活の足しになれば・・・。 FX専業投資家として活動を続けてきていますが、この度幸いなことに結婚をして子宝

記事を読む

Message

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

Adsense

Fixing kernel error AMD-Vi: Event logged IO_PAGE_FAULT on Ryzen Machine

My pc was periodically shut down on 7:40 am JS

Ubuntu で仮想ディスプレイを使う

雑多な備忘録ですが、せっかくなので残しておきます。 Ubuntu 18.04 の resolv.c

PYPIへの登録を10秒でできるようになる方法

pip 使ってますよね Pythonを使っている人であれば、pip installでライブラリ

The art of debugging with GDB, DDD, and Eclipse の読書メモ

GDBの勉強がしたくて、下の本を原著で読んでみました。10年前の本だけど全然現役でした。

JupyterでボタンからJavascriptを実行して追加のアウトプットをさせない方法

Javascriptを実行するとアウトプットセルの行が増える これがとても面倒だった。上の

→もっと見る

PAGE TOP ↑