ブログ記事でスクリプトを紹介できるプラグイン

2017年11月21日
  • wordpressを使ったブログ記事の投稿でスクリプトを紹介する時に、ボックス内に綺麗にスクリプトを埋め込んであるサイトをよく見ますが、「Crayon Syntax Highlighter」というプラグインを入れるだけで設置可能だったので紹介します。コピー機能やコード種別も選択できるのでとても便利です。

    プラグインのインストール

    wordpressの管理画面メニューから「プラグイン」へ進みます。

    Crayon Syntax Highlighterを検索してインストールし、有効化

    「新規追加」ボタンをクリックして、検索窓に「Crayon Syntax Highlighter」と入力し表示されたプラグインをインストールして有効化してください。

    新規投稿を追加のテキストに挿入

    新規投稿画面のタブボタン群の中に「crayon」というボタンが追加されていますので、クリックしてください。ポップアップで編集画面が表示されます。

    基本は、下の画像の赤枠の中に紹介したいスクリプトなどを入力して右上部の「add」を押せば、テキストに自動的に挿入されます。ご覧の通りオプションが豊富なので詳しくは、プラグインの紹介サイトでご確認ください。

    スクリプト表示

    記事には下の画像のようにスクリプトが奇麗に挿入されます。

    下の画像はマウスオーバー時です。マウスオーバーではコードコピーなどのボタンなどが表示されます。