自分用メモ。使える用途は限定的でもいけてんじゃねと思うWPプラグイン2個

最近忙しさにかまけてブログを更新放置しておりますよ。
まあそれはそれで仕方ないといいつつ、自分なりによいものを見つけたのでメモ。
まあただのWordpressのプラグインです。
こいつはいいなって思えるものが2つあるので紹介します。

1.カテゴリごとの記事の表示順を制御するプラグイン「AStickyPostOrderER」
とある案件でTOPページとかに表示する記事の表示順を時系列ではなく任意で選びたいという要望があったのでいつもならテーマ側で制御したいところですが調べてみるとけっこう厳しい感じだったのでプラグインに任せる事にして見つけたのがAStickyPostOrderER。

使い方は簡単でサイドメニューのツール→AStickyPostOrderERをクリック
次に表示させたい順を該当するカテゴリから選択するとそのカテゴリ内の記事リストが出るので各項目の画面右端にあるテキストボックスに数値を入力して表示順を制御できるという感じ。

けっこう簡単で要望もクリアできてすっきり。
インストールは以下URLから直接でもいいし、プラグインディレクトリに追加されてるのでAStickyPostOrderERって検索してもおｋ
http://wordpress.org/extend/plugins/astickypostorderer/

2.カテゴリごとの日付アーカイブを表示するプラグイン「Archives for a category」
続いてもカテゴリ関係ｗ
このプラグインは日付アーカイブのリストを表示する際に特定のカテゴリのみを出力するためのプラグイン。
WPの構成によってはアーカイブのリストが必ずしも全て見えて欲しくない場合もあるわけでその時とかArchives for a categoryは役立ちますね。

使い方も簡単。テーマファイルに

って書いて任意のカテゴリIDをふってあげればおｋ
特定のカテゴリのみの日付アーカイブを出力する機会もそうないと思うけどあった場合に役に立つと思います。
ただ注意点があって日付アーカイブの特性上パーマリンクがデフォルトの?=idじゃない場合は出力しないらしいので設定→Kwebbleをクリックして Disable canonical URLs. にチェックを入れて更新しましょう。これでパーマリンクの値が変わってても正常に出力するようになります。

インストールは残念ながらプラグインディレクトリに登録されてないっぽいので直接以下からダウンロードしてFTPでうｐ
http://kwebble.com/blog/2007_08_15/archives_for_a_category

使い方に癖がある2つのプラグインだけど、用途限定でかなり便利になるので知っておいて損はないと思います。

参考記事
投稿記事の表示順を変更できるプラグイン「AStickyPostOrderER」
カテゴリーごとの日付アーカイブを表示する WordPress プラグイン – 「Archives for a category」

WordPressのエディタで改行を無効化するプラグイン

今日は久々にWordpressのプラグインネタ。
今日仕事の時にWordpressでちょこちょこっとやってたら、こんな事につまずきました。
それはエディタを切り替えたら改行とかがおかしくなったという事。
Wordpressの改行がエディタであんまり具合がよくないというのは分かってたんですが、ブログを書く程度ならまあルールで吸収できるんですが今回の場合はちょっとどうしようもなかったのでプラグインにお願いしました。
今回助けてもらったプラグインがPS Disable Auto Formattingというプラグイン。
WordpressのHTMLエディタで自動整形する機能を無効化してくれるプラグインです。
これを有効化するとHTMLエディタで改行してもpやbrが出力されずにエディタ内でのbrが反映されるようになります。
これでbrを多用するであるとか、細かい調整とかを全てコントロールする事ができるようになるのがいい感じです。

WordPressのフォーラムにある説明文を引用

「HTML編集モードでコードを記述したら、改行が消えた。。。」
「正しいコードを書いたのに、貼り付けたら入れ子構造がおかしい不正なコードになってしまっている。」
「ビジュアルモードとHTMLモードを切り替えると改行が消える」
などなど、HTMLモードでの編集は大変気を遣う必要があります。

PS Disable Auto Formattingは、これら自動整形に起因する問題を解決するだけでなく、ビジュアルエディタでの編集をも可能にし、よりWordPressの使い勝手を向上させます。

また、すでに作成済みの記事がある場合への対応として、一括整形処理機能を搭載しています。
本プラグインを有効化すると、元来段落や改行を付加していた処理が行われなくなるため、作成済みの記事の表示が変わってしまいます。これを簡単に修正するための機能が一括整形処理機能で、最終更新時刻が指定時刻以前となっている全ての公開・下書き・レビュー待ちの記事内容を段落・改行付きに整形します。

機能

投稿・コメント・抜粋・説明、各エリア毎の自動整形停止
HTMLモード利用時のp, brタグ除去回避
作成済み記事に対する一括整形処理

との事。
適用したら過去記事が未整形になってしまって表示が崩れるところを回避するための一括整形処理があるのはうれしいです。
とはいえいきなり実装も怖いので僕のどうでもいいテスト環境で実験しましたがきちんと一括整形もされていたので安心しました。
念の為バックアップを取ってからプラグインの有効化をした方がいいとは思います。

インストールは簡単でPS Disable Auto FormattingはWordpressのプラグインディレクトリに登録されてるのでプラグインの新規追加ボタンからPS Disable Auto Formattingで検索すれば出てきますので、あとはインストールして有効化するだけです。

基本的には整形してくれる前提でpやbrが入る事を想定してコーディングしてるので特にこれまでの分にどうこうという話でもないんですが、今後の案件とかでCMSとしての利用色は強い場合などには役に立ちそうです。

あと、このプラグインをもにょもにょしてる時に思ったんですが元々からWordpressにHTMLとか書いてあるからタグ打つ感じで対応しようとしてるのに自動整形されて自分で書いたHTMLが無効化されるのってどうなんやろって思いました。
それなら最初からHTML・ビジュアルという2つじゃなくてHTML・改行自動変換・ビジュアルとかの3つのパターンのエディタを用意してくれたらそもそもプラグインで対応する必要もなかったのにと思うわけです。
ということで次回のバージョンアップにこういう変更があるとうれしいなという超個人的な意見でしたｗ

ブログの高速化？WPプラグインで画像を外注化

今日はまたWPのプラグインの紹介なんですけど、その前に最近考えてるサイト・ブログの高速化について少しまじめに書きます。

サイトやブログを表示する時にFlashのローディングのパーセンテージが進まなくてイライラしたり、動画の読み込みが遅くてイライラする事があるんですがそんなリッチコンテンツなんかないのにサイトが重かったりすると「何でこんな普通のサイトなのにこんなに遅いねん！」って余計イライラしませんか？
僕はけっこうイライラしますｗ
これには色々原因があるんですが主に
・読み込んでる画像が重い
・サーバーに負荷がかかって処理に時間がかかっている
という2つが主な原因である場合が多いです。
要は重い画像やトラフィック増によるサーバーレスポンス低下がだいたい遅くなってる犯人だという事です。
（もちろん異論は認めますｗ）

そこでその原因を外に持っていけばアクセスが増えたりしてもブログやサイトが安全に運用できるよね！っていうのが今回の趣旨です。
前置きが長くなりましたが本編はここから。

画像を外注化（別サーバーに置いておく）するメリット
・画像のデータをブログの本体のサーバーに置かないのでサーバー容量を圧迫しない
・画像データが別サーバーから読み込まれるので本体のサーバーのサーバーレスポンス低下を招きにくい
・その結果「サーバーが落ちにくい」「アクセスが多くなっても安定してサイトやブログが表示される」
・SEOの面でも効果的（サイトの表示スピードの件で）
・移転する時もらくちん（ここがけっこう重要）

上記のようなメリットが考えられるので画像は外部のサーバーに置いておくのがいいと思います。
そこで考えるのが「どこに置くか」
今回は大御所のFlickrとPicasaにします。
これには理由があってFlickrやPicasaのような大手サービスは「サーバーが安定していてまず落ちる事がない」というのが1番大きな理由です。
せっかく画像を外注化してもそこがだめでは話になりませんからねｗ
ただ、外に置くのにその影響で管理する手間や作業工数が増えるとかえって負担になるのでそこをできるだけ減らして楽にかつ簡単に運用するためにWPのプラグインを使用します。
今回紹介するプラグインはこの2つ
・WordPress Media Flickr
・Picasa Express x2

では実際に僕が使用している方法を紹介します。

WordPress Media Flickr
こちらは主に息子達の写真を貼り付ける時に使っています。Flickrの有料アカウントを持っているので容量を気にせず撮った写真をガンガン放り込んでブログ用のやつだけ公開設定にしてsetにまとめています。
アップロードしたらFlickrが勝手にリサイズしてくれるのでサイズとかも気にせずどかどか入れれるのがいい感じです。
インストールはWordPress Media Flickrから手動でもいいですし「Wordpress Media Flickr」で検索して自動インストールでもどっちでもいいと思います。
好きなほうでやってくださいｗ

実際の埋め込み手順
プラグインをインストールしたら下の画面のようなアイコンが出ます。
Flickrに画像を放り込んで準備ができたらアイコンをクリックします。

Media Flickrアイコンをクリック

するとlightboxでギャラリーが出てくるので埋め込みたい画像をクリック

lightboxでギャラリーがでてくるよ

あとはサイズを選んで挿入ってするだけ

サイズを選んで挿入

僕の場合は500pxで埋め込んでます。
続けて他の写真を挿入ってするとどんどん画像を埋め込んでいきます。
でここが少しポイントなのですが少しでも作業効率をよくすることが大切だと思うんです。
だってそれが手間になってめんどくさいからブログしないってなったら本末転倒ですからね。
で、ブログを書く時に僕は実際こういう手順をしています。

1.写真をFlickrやPiucasaにアップロード
2.大枠の記事を書く
3.画像を一気に埋め込む（このとき場所はどこでもいいです。一番上でも一番下でも好きなところにドカンと挿入します）
4.テキストエディタに埋め込んだ画像タグをカット＆ペースト
5.テキストエディタで不要なタグを一括削除したりAltやtittle、リンク先URLの調整
6.調整済みのタグを記事内の適切な箇所にコピペする

という感じです。実際には息子達の写真は妻に撮影してもらってるので妻が撮影した画像をFlickrにアップしてもらっている間にこっちは記事の下書きをしているんですけどね。ブログを複数人で運用する場合の作業分担もできるので作業の効率もいいと思っています。
で、その埋め込んだ画像なんですがプラグインで埋め込むと不要なタグがどうしてもでてきます。
気にしなければいいところではありますが僕はすごく気になるのでテキストエディタでさくっと一括削除してやります。
これがブラウザで入力でする時に比べて作業スピードが格段に違いますのでかなり作業効率がいいです。
こだわりたい方はぜひ試してみてください。

余談ですが旅行先などでの移動中にはポメラでブログの記事を下書きしたりする事もあります。
画像と記事を別のタスクにするとどんな場所でもブログを書く準備ができて快適になってきますよ。

Picasa Express x2
こちらもインストールはPicasa Express x2から手動でもいいですし「Picasa Express x2」で検索して自動インストールでもお好きなほうでどうぞ。
Picasaは有料アカウントではなくて無料アカウントなんですが、こちらは画面のキャプチャとかの画像用で（息子達の写真以外ですね）使うので1024 MBも容量あればまず足りなくなる事はないでしょう。
これまではWP入れてるサーバーにアップしてましたが上記のような事を色々考えて外に出す事にしました。
ちなみにこの記事の画像はPicasaに入れてます。
運用手順は以下のとおり

インストールするとPicasaのアイコンが出てくるのでこれをクリック

Picasaのアイコンをクリック

Picasaの方で公開用のギャラリーを用意しておき、画像はそこに入れておきます。

ギャラリーを選択

画像を選んでInsertをクリック

あとはFlickrの時同様に画像をどんどん挿入してテキストエディタで編集すればOK。
こんな感じで用途別に画像を保管するエリアを分けて運用する感じにしています。
これでアクセスが増えてもサーバーに負担が増えにくくなったので快適にブログを運用できますね。
まあこのブログがそんなにアクセス増えることもないんですけどｗ

勢いで書いてたらえらい長文になってしまいました。
最後まで読んでいただいてありがとうございます。

WPの入力支援プラグイン「AddQuicktag」

ちょっと便利なWPのプラグインを見つけたので紹介します。
今回紹介するプラグインはWPのエントリ画面で入力支援をしてくれる機能を追加できる「AddQuicktag」っていうプラグイン。
使い方によってはかなり便利です。
まずはインストール。
今回はFTPとか使うのめんどくさかったのでプラグインディレクトリからの追加。
まずはプラグインの新規追加から「AddQuicktag」で検索

するとこんな感じで結果に表示されるのでインストールを実行。

はいこれでインストールは完了。
おれはFTPでインストールしたいんだよ！っていうこだわりがある人はこっちから手動ダウンロードしてください。
AddQuicktag

インストールが完了したので設定を開始。
プラグインの中からAddQuicktagを確認して設定をクリック

するとこんな画面が出るのでラベル名とかタグとかを設定します。（自分でCSS当てた要素とかを入れます。）

するとエントリ画面上部にさっき追加した要素がボタン化されて置いてあります。
これをクリックするとさっき登録したタグが自動で挿入されるっていう仕組み。

以前紹介したMTの入力支援プラグインCustomEditorButtonのWP版みたいな感じですね。
これならHTMLとか詳しくないお客さんにもこっちで指定した構造の記事を書いてもらいやすくなって仕事にも使えるっていうけっこういい感じの代物です。
気に入った方は自己責任で入れてみてね！

WPでphpのreadfileが読み込まない不具合を回避する方法

今日は少し仕事で困った事があったので忘れないようにメモ。
まず前提としてページ内にあるサブナビだけをサイト内の共通要素として使用したかったのでいつも使っているphpのreadfileで対応しようとしたわけです。
ただ今回はその埋め込む対象が静的なHTMLファイルではなくWPのページ部分に追記する場合だったのがそもそもの事の発端です。

いつもやってる方法(一応メモ)
htmlファイルでもphpが読み込めるように.htaccessに「AddHandler php5-script .html」と記述しphpを動作させるようにします。
今回の場合はサーバーがヘテムルだったのでこんな感じでおｋ。
もちろんphpのバージョンも既存の環境にあう設定です。
次に読み込むファイルを作成。今回はサブナビなのでsubnavi.htmlとでもしておきます。
subnavi.htmlには以下のみを記載するとします。

めにゅー
めにゅー
めにゅー

で、埋め込む側のファイルに絶対パスで
<? readfile("http://xxx.cm/subnavi.html"); ?>

と記載。すると埋め込みを指定したページにsubnavi.htmlの記述が反映されて埋め込み完了。
動作も確認してきちんと埋め込まれている事が確認できました。

と、ここまではいつもどおりにうまく行ってたんですがWPのページ内にこの記述を埋め込むとなぜか反映されない・・・・・。
ためしに埋め込んだページと全く同じ記述の静的なHTMLファイルを作りアップロードしてみると反映されている・・・。
という訳でこの時点でもうお手上げでした。
同じ記述をしているのにHTMLファイルとWPのページ内では動作が違うなんて・・・プログラムがよくわかんない僕ではここでお手上げです。
これは困ったと思いTwitterで愚痴っているとふとアイデアが浮かびました。(ここからが本題ですｗ)

「あのプラグインを使えばreadfileと同じような動作をWP上で実現できるんじゃね？」

そのプラグインというのがContact Form 7です。
このContact Form 7というプラグインはその名のとおりWP上で簡単にフォームが設置できるようになるプラグインなのですが、
このプラグインを使ってサブナビを実装しちゃいましたｗ

使い方は簡単でプラグインの設定画面から新規でフォームを作成し、フォームの部分にsubnavi.htmlに記述してある

めにゅー
めにゅー
めにゅー

をまるコピすればおｋ。
あとはプラグインで指示されたコピペする記述をWPのページ内に貼り付けるだけ。
結果からいうとこっちの実装の方がWPでは簡単ですね。
フォームとかでめんどくさい時とかにたまに使ってたこのプラグインがこんな形で有効活用できるとは思ってもいませんでした。

これを応用すればサイト内のちょっとした共通要素をまとめて管理できる素晴らしいプラグインにはやがわりです！
もちろんフォームにも使えるのでカバーできる範囲がとっても広い。
これからはインストール時の基本メニューに決定です！

Twitter公式「Twitter Button」のちょっとまとめ+あるふぁ

先日Twitterの公式ツイートボタン「Twitter Button」がリリースされたので早速試してみました。
まずは実験という事ででろぐに実装してみる事にしましたがTwitter上でWordpressのプラグインTweetButtonが紹介されていたので早速入れてみました。
このプラグインはWPのほかのプラグインと同様にダウンロードしてきてWPのプラグインディレクトリにフォルダごとアップしてから、管理画面にログインしてプラグインの有効化をすれば使用できます。
まあ導入は至って簡単です。
導入後の画面がこちら

前からあるTOPSYのツイートボタンの横に同じような体裁でボタンが追加されました。
ためしにボタンを押すとこんな感じに。

Twitterにログインしているとボタンをクリックするとそのままツイートできる感じです。
まあ便利。
短縮URLはt.coが使われます。

でもよく考えると本家版を使っていなかったのでついでに調べてみました。
http://twitter.com/goodies/tweetbutton
こっちを使うとボタンの表示やツイート内の表示テキストURLや言語の選択などがカスタマイズでき、あとオススメフォローユーザーのアカウント表示までコントロールできます。
使い方次第ですが、例えばキャンペーンサイトなどに表示させてハッシュタグを埋め込んだり、意図的にRTを促進させたり、運営者のアカウントのPRが出来たりするのでけっこう便利かも。無料で利用できるので導入しやすいですし。
実装したいだけならWPのプラグインとかで簡単にできていいと思いますがカスタマイズしたいなら公式の方を使った方がいいような気がします。
あくまで個人的な意見ですけどね。

おまけ
このTwitter Buttonの事を調べていたら知らなかった少し便利な事が分かったので追記します。
それはTwitterのロゴやアイコンや公式のボタンがあるということです。(ボタンは今回のTwitter Buttonの事ではなく単純な画像の分ですよ)
Twitterロゴとアイコン
Twitterボタン
利用シーンによりますが使う場合はこっちを使った方がいいかも。
もちろん利用する場合は利用ガイドラインをしっかり把握した上で使うのは当然です。

お気に入りのMT用入力支援プラグイン2種

今日は為になる事も紹介しようと思いましたので僕がけっこう気に入って使っているMT用の入力支援タイプのプラグインを2種類紹介します。

MTをブログやCMSで使う機会が多い人には特にそうだと思うんですが、よく使うタグとかクラス・Idなどを簡単に出したり、定型文を自動で読み込ませたりするとだいぶ作業効率が上がるよなーなんて考えてる人には最適なプラグインです。

まず1個目が「CustomEditorButton」です。
インストールの仕方は解凍したデータを階層を保持してそれぞれMTのpluginsディレクトリとmt-static/pluginsにアップロードするだけ。

アップロードするとシステムメニューにボタンという項目が追加され、自分で登録した項目をMTの入力画面でボタンにしておく事ができるようになります。

こんな感じで追加されます。

ボタンの追加や編集はシステムメニューのボタンから行います。
たとえばこんなコードを登録しておくと自分で作ったcssでレイアウトをしたりするといった事が簡単にクリックひとつでできてしまうという優れものです。
str = ‘<div id="xxx" class="xxxx">サンプル</div>’;

これで部品的に使う要素をまとめておけば更新が楽になるので作業効率もアップ！

で2個目が「NewEntryTemplate」。
さっきのCustomEditorButtonが入力画面に追加する時に「たまに使う」項目用だったのですがこっちは「常に使う」場合用です。
たとえば署名とかそんなの。
インストールの仕方はこれまた簡単で、MTのpluginsディレクトリにアップするだけ。
設定の仕方はシステムメニューのプラグインからNew Entry Templateの「設定を表示」をクリックするだけ。
タイトルや本文など記入するエリアごとに定型文を設定できるので非常に便利です。

設定画面はこんな感じです。

余談ですが「こんなことならMTのテンプレいじれば余裕じゃね」という意見もあると思います。
はっきりいえばそれでも事足りるんですが<$MTEntryBody$>の独自タグの中に埋め込ませたい場合にはこれが手っ取り早いです。

この2つを使い分けるとある決まった形式の記事更新とかが格段に早くなるので使えそうな場合は使ってみてはどうでしょうか。もちろん自己責任でお願いしますｗ
ちなみにこの2つのプラグインはMTの3と4のバージョンなら大概いけるぽいですが5は微妙です。
実際に5に入れてないのでなんともいえません。
もし5を使われてる人はこれまた自己責任でお願いしますｗ

OpenPNEのTwitter、mixiエコーのようなつぶやきプラグイン

先日元会社の先輩のOさんからOpenPNEの面白い情報を教えてもらったので忘備録もかねてブログに投稿しようと思います。
今回紹介するのはOpenPNEでTwitter、mixiエコーのようなつぶやき機能を追加できるプラグインです。
まずOpenPNEを知らない方の為に軽く説明するとOpenPNEはオープンソースのSNSソフトウェアです。
mixiやGREEのようなSNSを独自で構築したい人には手ごろなソフトです。
触ってみると分かりますがUIもmixiそっくりで、かなりとっつきやすいものです。
そんなOpenPNEがもひとつ魅力的になるプラグインが開発元の手嶋屋さんから発表されたとのこと。
OpenPNEで社内twitterを

これはアツイ。これにTwitterとの連携機能とかあるともっと良いツールになりそうですね。
まだ細部まで見てないのでわかんないですがとても面白い情報をもらえてテンションが上がりました。
Oさんありがとうございました！