wordpressでプラグインを使わずに投稿画面にショートコードボタンを設置する方法

パソコンではショートコードを覚えさせるcliborというソフトを使っていて、さほど不便さは感じなかったのですが、最近タブレットでwordpressを編集する事が多く、いちいち<span style=”color:#ff0000;”>～などと書くのがとても面倒に感じていました。

そこでAdd tagなどというプラグインの導入を考えたのですが、プラグインはなるべく使いたくないので、いっそのことfunction.phpに追記して、管理画面でのみ呼び出しする事に。。

こんな感じになり、h3以降の写とか太とかが私が書き足した項目です。

例えば画像に装飾するためのショートコードは、「写」に入れているのですが、貼りつけしたい写真を選択して「写」を押すと、写真の前後に<span class=”×××”>　写真　</span>という感じで、装飾のためのコードが挿入されます。

超便利！！これcliborより断然簡単じゃないですか。

Andoridにsimeji入れて、マッシュルームの拡張機能で～とか考えたけど、simejiって色々セキュリティーの面で不安だし、いや、大丈夫とは言ってるけどやっぱり不安だし・・ということで、そういう人はいっそのことfunction.phpに直接書き込みましょう！

書き方は簡単で・・

//クイックタグ
function add_my_quicktag() {
?>
<script type=”text/javascript”>
QTags.addButton(‘ID’, ‘ボタンのラベル’, ‘開始タグ’, ‘終了タグ’);
</script>
<?php
}
add_action(‘admin_print_footer_scripts’,’add_my_quicktag’);

こんな風に書くだけです。

参考までに私が実装している一部のコードを公開させていただきますと・・

//クイックタグ
function add_my_quicktag() {
?>
<script type=”text/javascript”>
//QTags.addButton(‘ID’, ‘ボタンのラベル’, ‘開始タグ’, ‘終了タグ’);
QTags.addButton(‘huto’,’太’,'<span class=”b”>’,'</span>’);
QTags.addButton(‘ABC0′,’発’,'<a href=”#ABC”>’,'</a>’);
QTags.addButton(‘ABC1′,’着’,'<p id=”ABC”>’,'</p>’);
QTags.addButton(‘haikei’,’背景’,'<span style=”background-color:#f5f5f5″>’,'</span>’);
QTags.addButton(‘moji’,’赤字’,'<span style=”color:#ff0000;”>’,'</span>’);
</script>
<?php
}
add_action(‘admin_print_footer_scripts’,’add_my_quicktag’);

こんな感じで、上から太文字、ページ内ジャンプの発リンク、ページ内ジャンプの着地点、背景灰色で囲む(コードを囲むのに実装しているやつです)、文字下に赤い線、赤文字となっております。

これは私が勝手に追記したものなので、自分でお好きなショートコードやCSSコードを実装してください。

ちなみにIDというのは任意で勝手に決めて大丈夫ですが、同じ名前が２つにならないように、0や1などと語尾につけてください。

ボタンのラベルに入れた言葉が、そのまま実装ボタンになるので分かりやすく短いものにした方が、投稿画面がごちゃつかなくていいのではないかと思います。

私はこのコードをfunction.phpの最後に書き加えました。

function.phpは崩れると真っ白になり、ブログが表示できなくなります。編集する際は、必ずバックアップを取ってからにしてくださいね。

私はデスクトップに一時ファイルというフォルダを作り、そこにfunction.phpのバックアップを置いて、デスクトップに直でダウンロードしたほうのファイルを、TeraPadで編集して、それを戻しています。

もし壊してしまっても慌てずに、一時ファイルというフォルダの中身をftpクライアントで即アップロードしたら、元に戻るので大丈夫。

子テーマ使っていてもfunction.phpを壊してしまうと真っ白になって表示エラーを吐いてしまうので、本当に繊細。繊細すぎてトラウマなるほど繊細ｗｗ

function.phpは壊れた際は、追記した場所を削除しても戻らない事があります。１にも２にもバックアップが大事です！