テキストエディタ

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をいじるのが面倒な場合には、
プラグインを使用して下さい。

この記事を書いている人
株式会社ディープ
名前足立拓也

メールアドレスadachi@deep-deep.jp

関連記事

最近の記事

  1. WP:WordPress(ワードプレス)
  2. URL設計(URLデザイン)
  3. URL「ディレクトリ名」と文字アンダースコア(_)とハイフン(-)
  4. SEO対策(外部ファイルの読み込み)
  5. URL リダイレクト
  6. インデックスされない
  7. 内部対策は必要?
  8. CMS(シーエムエス)
  9. SEO業者は必要?
  10. SSL(HTTPS)

Twitter

  • 機械学習を少し勉強してみて思ったのは、Pythonがよく使われるのは便利なライブラリーが揃っているので、楽!というだけ。 多分、Pythonを使えば、数学なんて全く分からんくても、勉強して流れさえ掴めば、誰にでも出来る分野だという… twitter.com/i/web/status/1…
    about 1日 ago via Twitter Web App

アーカイブ

PAGE TOP