WordPressの投稿画面で編集できない時の対処法

WordPressの投稿画面で、内容の編集ができないという障害があったのでメモ。

症状としては、コンテンツ編集で使われているTinyMCEが無反応になるというものでした。
検証していくと、IE9であることが原因であることがわかりました。Windowsのバージョンは関係無いようです。

IE9は描画の解釈が今までと違うようで、IE9の標準モードではなく互換モードで表示する必要があるという感じでした。

WordPressの管理画面にテーマなんてものがそもそもないので、特定のファイルを直接弄る必要があります。でも手順はとても簡単。

  1. wp-admin/admin-header.phpをエディタなどで開く
  2. 20行目あたりに「<meta http-equiv=”X-UA-Compatible” content=”IE=EmulateIE8″>」を追記

IEで見た時に「このページは互換モードで描画してね」という一文をヘッダに追記してやることで、TinyMCEがちゃんと動いてくれるようになりました。

WordPressのメール通知に外部サービスを使う

障害対応でちょこっと引っかかったのでメモ。

自宅や自社サーバでWordpressを構築した場合、パスワードの再発行やコメント通知に使用されるメール通知に昔は同じサーバ内のPOPやSMTPを使用していたかと思います。
最近はYahooやGmailなどの外部サービスがメインになってきたことから、従来のメール通知が使えなくなってきました。

今回はメール通知の送信先にYahooやGmailのSMTPサーバ使えるようにする設定をメモします。

ちなみに今回の記事は 「メール投稿」の話ではありません。メール投稿はちゃんと設定項目があるのでそこに適切な値を入れればいいのですが、メール通知は設定項目がないので、プラグインを使用して設定することになります。

作業環境は「Wordpress 3.0.5」です。PHPが古いようで、最新版が使えませんでした。

手順はさほど難しくありません。

  1. WP Mail SMTPをダウンロード
  2. ダウンロードしたZIPを解凍して「wp-content/plugins」にフォルダごとアップロード
  3. WPのプラグイン管理画面を開いて「有効化」をクリック
  4. 有効化リンクがあったところに「設定」がでるのでそれをクリック
  5. 以下の項目を記入(Yahoo!メールの場合)
    From Email:送信のベースとなるメールアドレス
    From Name:Fromに表示される名前(「Wordpressから通知です」とか)
    メーラー:「WordpressのすべてのメールをSMTP経由で送信する」にチェック
    SMTP Host:ptnsmtp.mail.yahoo.co.jp
    SMTP Port:465
    Encryption:「SSLを使用する」にチェック
    Authentication:「はい:SMTP認証を使用します」
    Username:Yahooメールのユーザ名
    Password:Yahooメールのパスワード
  6. 「変更を保存」をクリック 
  7. テストメールの送信でFrom Emailと違うアドレスを入力して送信できるかテストする

これでメール通知ができるはずです。

プラグインについては、WP Mail SMTPのほかにCimy Swift SMTPというものもあったのですが、実際に送信しようとすると「mail()が有効になっていない」とのメッセージが出たので使えませんでした。

Flickrの写真セットをスライドショーにする

まず最初に、Wordpress.comではEMBEDやOBJECTタグを用いた動画ファイルの直接表示が出来ません。

そのかわり、あらかじめ用意されたShortcodeというものを使って決められたサービスから表示させる方法があります。

Shortcodeの一覧はこちら:Shortcodes « Support — WordPress.com

Flickrはスライドショーの機能はあるものの、外部埋込みのコードは提供されていません。むりやりコードを抽出することはできてもWordpress.com自体にタグ埋込みの対応をしてないので、外部サービスを利用してShortcodeを取得する必要があります。

一連の手順は以下の通り。

  1. Flickr側でスライドショーにしたいSetsをあらかじめ作成しておく
  2. Slideへアクセスし、まずはアカウントを作成
  3. 上部の「Create」ボタンから「Create slideshow」を選択
  4. スライドショー制作画面が表示されるので、画面中程にある「画像や写真を追加」から、「Flickr」タブを選択
  5. スクリーンネームにFlickrのスクリーンネームを入力(Flickr画面右上の「Sidned in as …」にあるID)
  6. OKをクリックすると、「使いたいFlickrセットを選択」とでるので、先ほどFlickrで作成したSetsを選択
  7. プレビューが表示されたら、そのまま「Done」をクリックする
  8. slideの画面下部に流したくない写真を消したり、並び替えができる。
  9. 「保存(コード取得)」ボタンをクリック
  10. 「SAVE Slideshow」ボタンをクリック
  11. コード取得の画面ではLivedoor・FC2・MySpace・Xangaしかないが、Livedoorでもいいのでとりあえずそのコードをコピー
  12. Wordpressの投稿画面(HTML表示)に貼りつけ

これでスライドショーが添付されます。実はわざわざShortcodeを探さなくても、Wordpress.com自体がSlideに対応しているので、HTMLのコードを載せても投稿時に自動的にShortcodeに変換してくれるようです。
HTMLコードをShortcodeに変換すると以下のようになります。

[slideshow id=1441151880785275941&amp;w=426&amp;h=320]

「w=426」や「h=320」は幅と高さです。この数値を変えればサイズを変更することができます。実際にShotecodeを埋めこむとこんな感じになります。

slideというサービスは便利は便利なのですが、なぜかスライド用Flashの動作が結構重いです。1ページあたりにスライドを多用するとPCのパフォーマンスに影響が有るかもしれません。

普通にWordpress.comがFlickrスライドショーに対応してくれたらいいんですけどねぇ。

WordPress.comに移行しました。

名前も新しく「cozy attic」にしました。落ち着ける部屋から落ち着ける屋根裏部屋みたいな。でも実は屋根裏部屋って直射日光だし意外と過酷な部屋やで、みたいな。

BlogサービスはWordpress.comを使用。前からWordpressは使っていたので管理画面とかにまったく違和感なく移行できましたが、通常版より安定して使いやすいサービスが実装されています。

特徴としては、

  • カスタムテーマは作成できない

    • CSS編集はできるけど、基本的に用意されたテーマを使用する
  • サイドバーに予めTwitterやFlickr、Tumblrなどの外部サービスが用意されている
  • カスタムテーマが使用できない分、Google Analyticsが使えないが、Google Webmaster ToolsやYahoo、Bing用のツールが用意されている
  • OpenIDまである
  • 一応容量サービスで独自ドメインとかが利用出来るみたい
  • メール投稿のアドレスは有効化した時点で自動的に生成される

等々、機能が多く実装されています。

一応海外サービスなのでレスポンスがBlogger並に重い時がありますが、marutaのように時たま表示すらされないということはないし、XML-RPCにバッチリ対応してるので必要ならブログエディタを使用することができます。

なんせ固定ページがあるので、Linux関連のまとめとかが作り易いのがいいですね。

テスト投稿

Wordpress.comの新規投稿画面からWrite Areaで書いた場合の投稿テストです。

Wordpress.comのHTML画面で編集する場合、実は完全なプレーンテキストではなく、
改行すると自動で<br />タグが付加されますが、どうでしょうか。

どうやら無事に投稿はできるようです。ただし、ビジュアルエディタを一回でも有効にすると強制的に整形されてしまうようです。

ビジュアルリッチエディタさえ使わなければ、今までの手法で投稿できそうですね。