病的溺愛シンドローム

クイックタグ(任意のタグを挿入するボタン)を追加する – AddQuicktag

Posted on 2009年02月5日 | 6 Comments | Clip to Evernote

WordPressの投稿画面で任意のタグをボタン1つで簡単に挿入したい。
wp-includesjsにあるquicktags.jsを編集するという手段もあるけど、
もっと簡単にできたらいいな。

そんな時に便利なプラグインが「AddQuicktag」だ。

インストールは簡単。
プラグインディレクトリに登録されているので、
「プラグイン」→「新規追加」からブラウザアップロードしてもいいし、
その機能が使えなくてもプラグインディレクトリにFTPでアップロードするだけ。
管理画面から有効化したら「設定」→「Add Quicktag」を開く。


AddQuicktag設定画面。クリックで拡大。

AddQuicktag設定画面。クリックで拡大。

「クイックタグの追加と削除」のところ。
ラベル名はボタンに表示される名前なので長すぎず分かりやすいものを。
開始タグ、終了タグに使いたいタグを入力して「更新」を押して反映させる。
終了タグがないタグは、終了タグのところは入力しなくてもOK。
1行ずつ「更新」を押して追加していく。
(「更新」を押すと入力欄が1行増える)

「クイックタグの設定の出力」のところでは、多分追加した設定を保存できるのだと思う。
が、これはあたしの環境では動作しなかったので未確認。

「クイックタグの設定の読み込み」のところでは、上記出力で保存しておいたものをインポートできるのだろうと思う。
上記と同様に未確認。

「Uninstall option」のところは、AddQuicktagをアンインストールしたいときにポチっと押すと、全ての項目がクリアされる。

登録したボタンは投稿画面のHTMLタブの方(ビジュアルエディタではない)に追加される。


AddQuicktagでボタンが追加された

AddQuicktagでボタンが追加された

昨日導入した「iG:Syntax Hiliter」のタグをAddQuicktagで登録してみた。
quicktags.jsを編集するとかやらないで、初めからこれ使えばよかった…。
とっても簡単。とっても便利。


コードを見やすく表示させる – iG:Syntax Hiliter

Posted on 2009年02月4日 | 3 Comments | Clip to Evernote

WordPressでコードを見やすく表示させたい。
行番号が必要なときは番号も付けたいし、
ずらずら長いコードは色分け(ハイライト)して表示された方がいいし、
面倒なときは言語指定なしで簡単に表示させられたら便利だし、
プラグイン独自のタグを忘れちゃったりするからボタン一つで入力したいし、
複数行のコードは見やすく行ごとに色を変えて表示できたらいい。

というわがままを叶えてくれるプラグインを発見。

iG:Syntax Hiliter

素敵なことに「MMRT daily life」さんのところで日本語版が配布されている。

説明に書いてあるようにダウンロードしたファイルをプラグインディレクトリにアップロードして有効化。
管理画面の設定から、どんな風に表示させるか設定できる。

  • コードBOX内の”コード”を別ウィンドウで開くリンクをつける
  • コードの原文の表示方法を新しいウインドウで開くか
  • コード言語を表示させるか
  • コード内のコメントを強調表示するか
  • 行番号を表示するか
  • 行番号の色を交互に変えるか
  • 行番号の色を2つ。カラーピッカー付き。

という設定項目がある。

タグを手入力したくないあたしのような人のために、クイックタグも設定できる。
マニュアルは英語なので簡単に説明すると、

  1. wp-includesjsにあるquicktags.jsを開く。
  2. プラグインに付いていたMANUAL.htmlの「6. QUICKTAGS」の部分を開く。
  3. 「add the following lines」の下にあるボックス内のコードをコピー。
  4. quicktags.jsの136行目辺り(moreタグの設定が終わったところ)を探して、);の後に改行してペースト。
  5. 保存してアップロード。

これで投稿画面のボタン群にActionScript、 ASP、 C、 C++、 C#、 CSS、 DELPHI、 HTML、 JAVA、 JavaScript、 MySQL、 PERL、 PHP、 PYTHON、 RUBY、 SMARTY、 SQL、 Visual Basic、 VB.NET、 XML、CODEのボタンが追加される。

コード貼り付ける場所はmoreの後じゃなくても、自分の使いやすい場所でOK。
ボタンが出現しない場合は、ブラウザのキャッシュをクリアしてみると表示されるかも。
ボタンが表示されるのはビジュアルエディタの方じゃなくて、HTMLの方なので、HTMLのタブを選択すること。

quicktags.jsを書き換えるの怖いんだけど…って場合は、
クイックタグを追加できるプラグインを利用するという手段もある。
ビジュアルリッチエディタとの併用不可というのをどっかで見たので、あたしは試してない。
WordPressのアップデートでquicktags.jsも上書きされちゃうかも?という不安を解消するには、そういうプラグインを探してみてもいいと思うんだけど。

これでボタン1つでコードを表示させるタグを入れられるようになった訳だが、
このブログではコードBOXがはみ出して、サイドバーと重なっていたので、
ig_syntax_hilitecssにあるsyntax_hilite_css.cssでサイズを変更。
このブログのフォントが白いもんだから、文字色も追加。

※注意!
コードを記入した後、ビジュアルエディタに切り替えないこと。
ビジュアルエディタでコードの入った投稿を開いた瞬間に<>の中身が消えたり、<とかに変更されたりする。
記事をビジュアルエディタで書き上げた後に、HTMLに切り替えてコードをペーストしたら、そのまま投稿ボタンを押そう。


昨日PHP Hilight Stringプラグインを紹介したばかりだけど、
iG:Syntax Hiliter 日本語版を使うことにした。
また1つ導入しているプラグインが増えたわけだが、今度は何を入れようか?w


コードを表示させる – PHP Hilight String

Posted on 2009年02月3日 | 4 Comments | Clip to Evernote

WordPressでPHPなどのコードを表示させたいときに、
<>を全角で書くなんていう手段でやっていたのだけど、
やっぱりコピペで使える状態で表示させたいなと。

そんなわけでコードを表示させられるプラグインを探してみた。

今回試したのはPHP Hilight Stringプラグイン。
(プラグインに表示されてる名前は「PHP Highligh String」、プラグインのホームページに書いてある名前は「PHP HilightString」。スペルが違うけども、どちらが正しいのかは不明。)

ダウンロードしたzipをそのままブラウザアップロードで
インストールまでやっちゃおうとしたんだけど失敗。
解凍してプラグインディレクトリにFTPでアップロードしたら大丈夫だった。

一緒に入っているhighlight.cssを開いて、使用中のテーマのstyle.cssにペースト。
これをやらないとスタイルが適用されないので注意。
ハイライトされる色はここを自由に変更できる。

[code lang=”言語”]表示したいコード[/code]
と記入することでコードが表示される。
([]は半角で)
言語(phpなど)は必ず小文字で記入すること。

色分け可能な言語は
php,cpp,css,diff,dtd,javascript,mysql,perl,python,ruby,sql,xml,java
で、色分けが必要ないときは
[code]表示したいコード[/code]  ([]は半角で)
だけ記入すればOK。

行番号を付けたいときは、
[code lang=”言語” -数字]表示したいコード[/code]  ([]は半角で)
と、始めたい行番号を指定する。
0にすると行番号は表示されない。

今回このプラグインを選んだのは、アップロードして有効化するだけで使える簡単さと、スタイルを簡単にいじれるから。

コードを表示させられるようになった筈なので、早速少し前の記事を修正してみた。
(フィードに新しくない記事が配信されてるのはそのせい)
無事に半角<>も表示されて、コピペで使えるようになった。

ふと思ったのだけど、このプラグインでコードを表示させるように記事を書いたら
もう他のプラグインに乗り換えできないな。
プラグインを削除したら[code][/code]の中身が消える予感…。
他のプラグインに合わせて全記事さらって[code]修正するのも大変だし。
でもまだ他のプラグインも気になってるから過去の記事を修正するのはやめておこう。


WordPressの豊富なプラグイン 4000個突破!

Posted on 2009年02月2日 | 5 Comments | Clip to Evernote

WordPress | 日本語」で2009 年 1 月 28 日にWordPress.org 公式ブログの記事、「Thank a Plugin Developer Day」を訳したものを見たところ…

WordPress のブログは平均してだいたい 5 個のプラグインをインストールしています!本日、私たちのプラグインディレクトリで利用可能になったプラグインが 4000 個を超えました。

だそうで。

プラグインディレクトリに登録してないプラグインも結構あるから、
それを含めたら凄い数なんだろうな。
プラグインディレクトリにあるものだけで4000個って!( ゚Д゚)ヒョエー
あたしが知ってるプラグインなんて数えるほどしかないというのに。
もっといろんなプラグインを探してみたくなった。

ってか、平均5個って、みんなそんなに少ないの?
あたしが入れてるプラグインって………多い方なの?
知らなかった。
現在アクティブになってるプラグインで30個あるんだけども。
入れすぎ?あ、そう?w

1 月 28 日を正式な「プラグイン開発者に感謝する日」にすることを宣言します。

ということなので、遅ればせながら利用しているプラグインのサイトを回ってみた。
殆どが日本語ではないので、殆ど読むことはできなかったのだけど、
心の中で深く感謝しますm(_ _”m)ペコリ

そして、次の 4000 個に乾杯。

乾杯!


お気に入りのFirefoxアドオン – その4

Posted on 2009年02月1日 | 9 Comments | Clip to Evernote

その1その2その3と18個紹介したのでその続きの5個。
この記事で今入れてるFirefoxアドオンの紹介はひとまず終わり。
今回のシリーズで全23個のFirefoxアドオンを紹介できた。
また新しいアドオンを見つけてきたら紹介するかもしれないけどね。
ちょっと1個ネタっぽいものが混じってるけど(・ε・)キニシナイ!!

→ 続きを読む


ADgger

堅実に儲かるアフィリエイト