ブログ内で、自作の書き物を縦書き表示したくて Twitter で @mono_log さんや @cotets さんに参考になるサイトを教えていただきました。
 
参考サイト
nehan
これが縦書きブログの大元である組版エンジン!涅槃(ねはん)であります。

縦書きたい2ーブログに挿入する縦書きコラムの作成/蛙の庭
こちらは、制約のあるブログサイトでも縦書きが出来る方法を紹介しています CSS をいじれるサイトなら縦書き出来そうですね。

最後に縦書き文庫の開発日誌
その中でも私はカンタン!縦書きブログの作り方を参考にメイン(もしくは、シングル)テンプレートにコードを書き込みました。
 
それでは早速、縦書き表示をしてみましょう!
ちなみにこれは Twitter 上でのやり取りの中でおふざけで書いた物であり、フィクションです。

ホワイト家の一日

 その日、お父さんは焦っていた。
 iPhone4 の予約開始日なのをすっかり忘れていたのだ。しかも、母さんの手伝いをする約束をしていた。家を抜け出してソフトバンクショップをめぐるがどこも人が一杯で予約が出来ない。
(父)「時間が無いのに……」そんな時電話が掛かってくる。
(母)「あなた、牛乳買いに行くのに何時間かかっているんですか?」
(父)「いや、売り切れててね。他の店に行ってるんだ」
(母)「まあ、そうなんですか?気を付けて行ってらっしゃい。」

 今のiPhone を手に入れてから一年ってない、ばれたら怒られてしまう。
(父)「折角せっかく一年以内でも買える様にしてくれたのに……」直ぐに予約できる所を求めて再び走り出す。

[家]
(娘)「ただいま~!今日は、お店が凄い混んでて大変だったよ。あれ、お父さんは?」
(母)「牛乳買いに行ってるわよ。」
(娘)「へ~、珍しいじゃない。」

 その頃お父さんは、北海道まで来ていた。
[北海道]
(父)「ここで直ぐ予約出来るか?」
(ショップのお姉さん)「はい、直ぐ出来ますよ。」
(父)「じゃあ、32 Gのホワイト!」
(ショップのお姉さん)「予約は黒のみになりますが。」

[家]
(兄)「予想外です!」
(娘)「お父さん遅いね。」

[北海道]
(父)「何だと?白じゃなきゃダメだ!」

[家]
(母)「どうせ、新しいiPhone の予約でもしてるんでしょう。」
(娘)「え~、そんなの私に言えばいいのに!でも黒だけだよ?」
(母)「お父さんはそういう人なのよ……」

 机の上には、iPhone4 白バージョンの特別予約券が置いてあった。「父の日ーお父さん何時もありがとうございます。」と書いてある。

読みづらい文章を最後まで読んでいただいた方には、感謝いたします。まあ、内容はどうしようもない物ですが、縦書きにした時にどの様に映るかはわかっていただけたと思います。
 
最後にiPhone用設定ですが、わたしは WordPress.org の wptouch プラグインを使用しております。そちらの single.php 内にコードを入れるのですがヘッダータグが省略されているので、get_header()の次の行にコードを入れました。

iPhoneに最適化する方法は、カンタン!縦書きブログの作り方のコメント欄を参考にしていただければと思います。
 
この作業の為にコードを考えてくださった縦書き文庫さんには、大変お世話になりました。
感謝の気持ちを込めてありがとうを伝えたいです。
 

Tags: , ,

7 Responses to “ブログ縦書きテスト2[iPhone対応完了]”

  1. 鈍がめ より:

    ☞: ブログ縦書きテスト2[iPhone対応完了] http://ma2mars.org/?p=9543

  2. cotets rss より:

    ★★★★ma2mars ブログ縦書きテスト2[iPhone対応完了] http://bit.ly/dv7Dah

  3. R_atmark より:

    ★ma2mars ブログ縦書きテスト2[iPhone対応完了] http://bit.ly/dv7Dah

  4. TOMIKUN より:

    ☆iPhone☆ ブログ縦書きテスト2[iPhone対応完了] http://dlvr.it/1qPSc

  5. 縦書き完成おめでとう [GRShare] ブログ縦書きテスト2[iPhone対応完了] http://j.mp/aTqZUe

  6. お、完成おめでとう♬ RT @kuracyan: 縦書き完成おめでとう [GRShare] ブログ縦書きテスト2[iPhone対応完了] http://j.mp/aTqZUe

  7. 鈍がめ より:

    @cotets 参考までに http://ma2mars.org/?p=9543