iPhoneでソースコードを表示する方法。もちろんお代はいただきません。

iPhoneでネットサーフィン(死語？)してると、「おや？どうやってんだ？」ってソースコード見たくなる時ありませんか？でもスマホサイトだとなかなか見られない…でもブックマークレット使えば見られます。

スマホサイトはソースコードが見られない！？

ふふーんと時間を潰していて、ふっとソースコードを見たい！と思いましたがどうやってみるんだ！？どうもiPhoneはデフォルトではスマホサイトのソースコードを見ることができない模様。じゃぁどうやるんだと…有料のものもありますが、本業でなんやらするわけでもないんで、無料でなんとかできる方法を探ってみました。

iPhoneアプリで見る

iSource Browser

開発元:Gamu apps

無料

posted withアプリーチ

「iSource Browser」なるアプリを発見しました。まぁ、使い方とかここでは特に触れるまでもないかと。URL入力してボタンぽちーってするとソースが表示されます。

んが、いちいちサイト見ていて「ソースみたい！」って思ってURLコピーしてアプリ立ち上げて貼ってーって正直めんどくさいっす。なんで次のブックマークレットで対応がいいかと思います。1回目の設定はめんどくさいですが、2回目からは快適。

ブックマークレットで見る

bookmarkletをsnoopyというサイトで公開されています。ここからいただきましょう。感謝。ブックマークレットも３ステップなんで、言うほどめんどくさくないです。

Snoopy | View-source bookmarklet for iPad, iPhone and other mobile devices

>Snoopy is a bookmarklet for snooping on web pages. It's intended for use on mobile browsers (such as Mobile Safari on t...

snoopy.allmarkedup.com

手順１：ブックマークレットの中身をコピーする

Snoopyサイトに行ってソースをコピーします。下の画像の赤枠を全選択してコピーしてください。

手順２：ブックマークレットの箱をつくる

safari下部の帯にある、共有ボタンを押してください。

からのーブックマークを追加。

で、ブックマークする。ちなみにどこをブックマークしても問題ありません。後で中身変えますから。さっきスクリプトをコピーしたsnoopyサイトをブックマークしておけば手間を省けます。

ちなみにこの際、名前はわかりやすいものにしておくと手間省けます。まぁ後で編集できるので必須ではありませんが。

手順３：ブックマークレットを編集して作る

先ほど作った箱を編集します。今度はiPhone下帯のブックマークボタン押してください。

からのー、さっきのブックマークを選びます。

で、さっきコピーしたスクリプトを、ペしてください。画像の下の部分です。上の部分は、ブックマークレットの機能がわかるように命名すると後々幸せになれます。

使い方

ソースコードを見たいサイトに行き、ブックマークレットをタップするだけ！簡単便利！

まとめ

有料アプリもあるみたいですが、本気じゃない人ならば今回ご紹介の範囲内でなんとななるのではないでしょうか。ただ、昔は「ソースを表示」ってボタンがsafariにあった気がするんですが…気のせい？