« 子どもと「BigDogごっこ」をした。 | 最新のページに戻る | Twitterの使い方がわかってきた »

■ iPhone/touch用のページを作成しました

iPhoneほしい!!!

けどX01HTの支払いがあと9ヶ月残っている!!!

というわけでここは我慢。

きっと待ってれば新しいバージョンのiPhoneが出るでしょ。そのうち32GBバージョンが出て、8GBのやつは値下げしたりとか。そのへんまで待つつもり。

iPhoneもケータイとしての機能に難が、とかいろいろ言われてるけど私には問題なし。だって、わたしが欲しいのは携帯電話ぢゃなくて、「無線LANとか無くても、いつでもどこでもネットにつなげる端末」なんだから。

X01HTにはお世話になったけど、なるたけ電話回線使わないようにして気を遣いながらネットに繋いだりするのはもう止めにしたい。月3000円(つまり基本料金980円と割賦金)くらいで抑えるようにこれまでなんとかしてきた。

iPhoneもはやく寝モバに耐えうる通信速度になってほしい。無線LANぢゃなくて3Gでニコ動とか見られるようにしてほしい。電話できなくていいから3Gでつなぎ放題で月3000円とかにしてほしい。もしくは新幹線の中でも岡崎でも幡豆の山の上でも日本中どこでも無料の無線LANが使える時代が来るとかそういうんでもいい。マクドナルドの無線LANがタダになるくらいじゃお話にならない。

21世紀にもなって、そんな貧相でもの悲しい状態に耐えなければならないことに激しく疑問を抱きつつも、そして自分の経済状況もあり、とにかくいまはiPhoneを買えないので、代償行為的にこのブログのiPhone/touch用のページを作成してみました(ここまで前置き!!!)。こちらから:iPhone/touch用のページ

cremadesigniPhoneテンプレート for MTを使わせていただきました。当ブログはmovable typeを作って製作してますので、iPhone用のテンプレートで別のindex.phpとエントリーのファイルを生成するようにしたというわけです。

基本的にiPhoneテンプレート for MTのデフォルトのまんまで、iPhoneからコメント書き込みはできませんが、これまでのコメントは読めるようにしておきました。

こんな長文わざわざiPhoneで読むかっつう問題はありますが、ごてごてした部分を取り除いて文章だけになると、意外に読めるかなと。ぜひ活用してみてください。問題点など気づいたら教えてください。ちょっと文字が大きすぎる気がしてます。よろしくお願いします。

以下はテンプレート変更部分についての自分用のメモです:

  1. ファイルの拡張子がphpなので、各テンプレートの第一行目を以下のように変える。
    <? echo('<?xml version="1.0" encoding="<$MTPublishCharset$>"?>') ?>
    
  2. アーカイブファイルの構造がデフォルトと違っているので、個別のエントリへのリンクを以下のように変える。
    <a href="<$MTBlogURL$>i/permalink/<$MTEntryID pad="1" $><$MTBlogFileExtension $>" target="_self">
    <$MTEntryTitle$>[<$MTEntryDate language="ja" format="%b月%e日" $>]</a>
    
  3. アーカイブファイルの構造がデフォルトと違っているので、前後のエントリへのリンクを以下のように変える。
    <MTEntryPrevious><p class="previousEntry">
    <a href="<$MTBlogURL$>i/permalink/<$MTEntryID pad="1" $><$MTBlogFileExtension $>">
    « 前の記事へ</a></p></MTEntryPrevious>
    
  4. iPhone用個別ページのテンプレートで以下を加えて、コメントを表示する。
    <MTEntryIfAllowComments>
    <MTIfNonZero tag="MTEntryCommentCount">
    <MTComments>
    # <$MTCommentAuthorLink spam_protect="1"$> <$MTCommentBody$>
    </MTComments>
    </MTIfNonZero>
    </MTEntryIfAllowComments>
    
  5. アーカイブマッピングの設定をデフォルトから変えてあるので、「iPhone用個別ページ」のアーカイブマッピングを追加して、以下のように設定する。
    ../i/permalink/<$MTEntryID pad="1" $><$MTBlogFileExtension $>
    
コメントする (4)
# 徳生 健太郎

おおちゃんとiPhoneできれいにでたぞ。お見事!
でも字体は確かに少々デカめに見える。
(テンプレートにフォントタグいれて小さめにすればいいだけではないのかな。あるいは貴殿PC版ブログでのフォント指定(がもしあれば)がiPhoneのSafariにヘンに反映されているのかも)

あと、Safariのユーザーエージェントを見て自動的に/i/のページにリダイレクトするとかできるともっとかっこいいと思う!iPhoneのUA文字列のサンプルはこんな感じ:

Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1A543a Safari/419.3

# pooneil

>>Safariのユーザーエージェントを見て自動的に/i/のページにリダイレクトする
なるほど。そのほうがスマートだね。http://allabout.co.jp/internet/javascript/closeup/CU20080715A/ のjavascriptを使ったやり方を見て入れてみました。よければ試してみて。
if(navigator.userAgent.indexOf('iPhone')!=-1){location.href='http://pooneil.sakura.ne.jp/i/';}

# 徳生 健太郎

@pooneil: 試してみたけどだめだったよ。でもコード見たら、こうなってたよ?
if(navigator.userAgent.indexOf('iPhone OS 2_0')!=-1
僕のiPhoneはまだ3Gじゃないんで、だめでした。'iPhone'だけだとフィルター甘過ぎ?

# pooneil

しまった、参照元のサイトのコードのまんま('iPhone OS 2_0')になってた。直しておきました。


お勧めエントリ


月別過去ログ