Home > Mac, iPhone > BackPackをiPhone向けにするiBackPack

BackPackをiPhone向けにするiBackPack

11月 9th, 2008

昨日ご紹介したBackPack。惜しむらくは携帯電話との連携…と思っていたのだが、「Backpack でプロダクティブになる10通りの使用例」という(一年以上前の)記事に自分の Backpack ページの URL のあとに /mob と入力すると、携帯電話でもみれるような Ajax のコードのないページが見られます。とある。おお。

で、早速試したが、機能的にかなり物足りない。iPhoneからだと標準のページでも、並び替え以外のほとんどの機能が使えていた(ちょっと見にくいけどね)こともあるけれど、さすがにこれはちょっと。

さらに調べてみると、iPhone向けにカスタムCSSで見た目を変えてくれるiBackpackというのがあった。自分のBackPackでiPhone向けにしたいページに移動してDividerを挿入。挿入位置はページ内のどこでも大丈夫だけれど、一番上にしておくと表示が早いとのこと。で、Dividerのタイトルにリンク先に記載されているHTMLコードをペーストするだけ。ライセンスはCreativeCommonsのby-nc-sa

実際にやってみた。iPhoneで表示させるとこんな感じ。

iBackPack1 iBackPack3

PCで表示中はこんな感じになる。

iBackPack

「iBackPack」の文字列が邪魔な方は、コードからaタグごと除去してもOK。自作CSSを使いたいという人は、コード中のCSSへのリンクを自分で作ったCSSに割り当てればいいだろう。

それから、iPhoneのホーム画面にアイコンを追加する際、そのままだとウェブページのサムネイルがアイコンとして追加されてしまうけれど、これをBackPackのアイコンで登録する方法もあった。

Adding a Custom Backpack Icon to Your iPhone Home Screenという記事がそれだが、iBackPackと同じようにDividerにコードを登録してから、該当のページをiPhoneでホーム画面に追加するだけ。このコードはアイコンをアップしたURLをリンクタグで指定してるだけというシンプルな仕組み。自作のアイコンを使う場合は、それをどこかにアップして、リンクタグのなかのURLをアップ場所に替えるだけ。

Chipt Productions, LLによる、Mac OS XのDashBoardウィジェットもある。個人的にはウィジェットはあまり使っていないけれど、一応ご紹介。

BackPack Widget

  1. No comments yet.
  1. No trackbacks yet.