テキストエディタ

WP(WordPress)

WordPress テキストエディタにオリジナルのクイックタグを追加

テキストエディタにオリジナルのクイックタグを追加

テキストエディタを利用して記事を書いている場合、
よく使用するタグやCSSを簡単に追加できるようにしておけば便利ですよね。

そんな場合、
テキストエディタにオリジナルのクイックタグを追加しておけば便利です。

クイックタグとは、これです↓
WordPress クイックタグ

で、クイックタグの追加には、
■functions.phpにQTags.addButton()を追加する
■プラグイン「AddQuicktag」を使って追加する
の2通りの方法があります。

 

functions.phpにQTags.addButton()を追加する

functions.phpでクイックタグを追加する場合には、
QTags.addButton()を使います。

基本的な使い方は、
QTags.addButton("ID", "ボタンに表示する文字", "開始タグ", "終了タグ");
です。
※IDは被らないようにして下さい。

他にもパラメータはありますが、使用するのは、基本的にこの4つのパラメータだけです。
※他のパラメータは、こちらにまとめてあります => クイックタグ

例えば、アンダーラインを書くCSSを追加できるようにする場合には、
functions.phpに以下のように追記します。

function add_org_quick_tag() {

print <<QTags.addButton("line_blue", "下ライン(青)", "", "");//ポイント QTags.addButton("line_red", "下ライン(赤)", "", "");//ポイント QTags.addButton("line_yellow", "下ライン(黄)", "", "");//ポイント
EOF;

}

add_action("admin_print_footer_scripts", "add_org_quick_tag");

そうすると、
以下の様にクイックタグが追加されていると思います。
WP オリジナルのクイックタグ

「下ライン(青)」をクリックしてみて下さい。
<span class="blueline"></span>
が挿入されればOKです。

あとは、以下の様なCSSを追加して下さい。

.blueline{background:linear-gradient(transparent 70%, #a7d6ff 70%);}
.redline{background:linear-gradient(transparent 70%, #FF6666 70%);}
.yellowline{background:linear-gradient(transparent 70%, #ff0 70%);}

そうすれば、
簡単にアンダーラインを追加できるようになります。

 

プラグイン「AddQuicktag」を使って追加する

このくらいの機能であればfunctions.phpを使った方がいいですが、
一応「AddQuicktag」というプラグインを使って追加することも出来ます。

functions.phpをいじるのが面倒な場合には、
プラグインを使用して下さい。

WordPress短期学習プログラム

関連記事

  1. Akismet Anti-Spam (アンチスパム)

    WP(WordPress)

    Akismet Anti-Spam (アンチスパム)

    スパム対策で最も有名なプラグインと言えば「Akismet Anti-S…

  2. WP:WordPress(ワードプレス)

    WP(WordPress)

    【WordPress】is_page()で固定ページかどうかの判定

    is_page()で固定ページの判定固定ページかどうか…

  3. The Thor(ザ・トール)

    WP(WordPress)

    THE THOR(ザ・トール)

    THE THOR(ザ・トール)が公開間近!!先日、FITさんか…

  4. WP:WordPress(ワードプレス)

    WP(WordPress)

    WP プラグイン「Delete Custom Fields」で不要なカスタムフィールドを削除

    開発当初の設計ミスであったり、後になっての大幅な仕様変更など、…

  5. WP(WordPress)

    「ゆるゆるカフェ」に参加!!

    昨日、WordPressイベントに参加してきました。&nbsp…

  6. WP:WordPress(ワードプレス)

    WP(WordPress)

    【WordPress】記事URLを出力、または、取得する方法

    WordPressでは、投稿記事のURLを出力する場合には…

最近の記事

  1. CakePHP
  2. PHP(ピー・エイチ・ピー)
  3. PHP(ピー・エイチ・ピー)
  4. PHP(ピー・エイチ・ピー)
  5. WP:WordPress(ワードプレス)
  6. WP:WordPress(ワードプレス)
  7. WP:WordPress(ワードプレス)
  8. Security(セキュリティ)
  9. WP:WordPress(ワードプレス)
  10. WP:WordPress(ワードプレス)
PAGE TOP