AIUEO Lab2

1年のうち250日は夕飯を作る主夫が、iPhoneや料理、気になったものを紹介するブログです。

iPhoneだけでブログは書ける!はてなブログにおける私のモブログ環境

photo credit: Janitors via photopin cc

12月に入ったので、ブログも年末の準備を始めます。お正月は実家に帰るけど、更新は途切れさせたくない。

でも、ブログのためにパソコンを持っていきたくないので、iPhoneでのモブログ環境をあらためて整えてみました。

そしたら、なんと “もしかしてパソコンで書くよりも楽ちん?!” という状況に。

私の「はてなブログ」における、現在のモブログ環境をメモしておきます。

スポンサーリンク

使用するアプリと役割

アプリ 役割
Drafts4 文章作成
するぷろーら  リンク作成・参考資料の検索
Textwell アイキャッチ画像、リンクタグ取得など
Picport  記事内の画像アップロード・タグ取得


記事作成の流れ

  1. Drafts4でザッと導入部分の文章を書く
  2. 参考リンクなどを貼りたい場合はtextwellに移動。textwellの内部ブラウザで検索し、リンクタグの取得。(リンクの見せ方をブログカードにしたい場合は、するぷろーらを使用)
  3. 自分で撮った写真はpicportでFlickerにアップロード。アップロードと同時にFlickerのタグを取得。
  4. アイキャッチ画像はtextwellでPhotoPinの画像を検索し、タグを取得して貼り付け。
  5. 出来上がった文章を、textwellから「はてなブログ」アプリの下書きに保存

※追記:picportはアプリストアになくなってしまいました…

Drafts4

Drafts4はキーボードをカスタマイズできる高機能メモアプリ。時間ごとに履歴を取ってくれたり、Javascriptが使えたりと、いろいろできるアプリです。

外部の記事紹介などがなく、自分の考えなどを書く場合はこのアプリだけで文章部分は完成。

使い方は以前書いたので、こちらを参考に。

iPhoneで文字選択時のイライラを解消してくれる「Drafts4」は最強のメモアプリ - AIUEO Lab2
iPhoneで長文を作成するとき、コピーやペーストの作業にイライラしたことありませんか?入力済みの文字を選択して、コピーして、貼り付けたいところにペースト……パソコンではマウスやキーボ...

Drafts

Drafts

  • Agile Tortoise
  • 仕事効率化
  • 無料

Textwell

textwellもDrafts4と同じく高機能メモアプリ。textwellで文章を作成すればDrafts4はいらないけど、Drafts4の方がカーソルの移動が早かったり、メモの保存という観点から優れているので併用しています。

アクションを登録することで、リンク取得や検索などさまざまな機能を自分好みに追加できます。

textwellに私が登録しているアクションは下記。説明の下にあるボタンを押せばアクションが登録できます。

Textwell

Textwell

  • Sociomedia
  • 仕事効率化
  • ¥370

Drafts4に戻る

urlスキームを使ってDrafts4に移動するアクション。

Import Textwell ActionDrafts4を開く

外部リンク紹介

検索したい言葉を入力してこのアクションを起動させると、内部ブラウザでYahoo!検索してくれます。目当てのサイトが表示されたら、ブラウザを閉じることでリンクタグを取得。

cssで綺麗に成形されたイメージ付きのリンクタグを作ってくれます。

  • TextwellのBlogQuoteをYouTubeやTwitterに対応させてみた(森杉版)
  • Import Textwell ActionBlogQuote

    自分のブログ内の記事紹介

    上のアクションは外部リンクの紹介でしたが、こちらは自分のブログ記事を貼り付けたいときのアクション。

    成形されたリンクは、外部リンクと背景色が違います。

  • 自分のブログを検索してリンク取得するTextwellアクション BlogLinker - W&R : Jazzと読書の日々
  • Import Textwell ActionBlogLinker

    カエレバの使用

    Amazonや楽天などの商品紹介リンクを取得してくれるカエレバ。textwellのアクションから検索して、タグ取得までできます。

  • Textwellでカエレバを使ってアマゾンの商品紹介をするアクション Kaereba - W&R : Jazzと読書の日々
  • Import Textwell ActionKaereba

    AppHTMLWeb

    AppleStoreにある、iPhoneやMacのアプリ、音楽などの紹介リンクを取得してくれるAppHTMLWeb。はてなブログは純正のアプリで使えるけど、お好みで。

  • これは凄い! AppHtmlWebがPHG対応版になりました - W&R : Jazzと読書の日々
  • Import Textwell ActionAppHtmlWeb

    PhotoPinからアイキャッチ画像取得

    Flickerの中からクリエイティブコモンズの画像だけを表示してくれるPhotoPinで画像を検索し、タグの取得までできるアクション。

  • TextwellでPhotoPinのアイキャッチ画像を取得する PhotoPinTaker - W&R : Jazzと読書の日々
  • Import Textwell ActionPhotoPinTaker

    Flickr画像の貼り付け

    Flickrを公開設定にしている人はこちら。Flickrの画像からタグを取得できます。

  • untitled - Flickr にある写真をウェブページに貼り付けるための HTML を生成する Textwell アクション「Flickr Code」を完全リニューアル
  • Import Textwell ActionFlickr Code

    新たに画像をアップロードするなら、こちらの方が便利。

  • TextwellにFlickrの写真を埋め込むのが楽になる Shares for Flickr
  • ブログプレビュー

    実際の表示をプレビューできるアクション。

    外部cssの指定もできるので、自分のブログ表示に合わせることもできます。

  • TextwellでHTMLタグをプレビューしながら編集できる BlogView
  • Import Textwell ActionBlogView

    はてなブログに下書き保存

    メモの1行目をタイトル、それ以下を本文として「はてなブログ」の下書きに保存してくれるアクション。

  • Textwellから、はてなブログへ。 「はてなブログ に下書き保存」 - #ChiroruLab
  • Import Textwell Actionはてなブログ に下書き保存

    他のtextwellアクションはこちら

    自作したアクションをたくさん公開してくれています。上で紹介したアクションもほとんどこちらから登録したものです。自分に合うアクションを使わせてもらいましょう。

    Textwell用の自作アクション集
    ...

    するぷろーら

    こちらはリンク取得に便利なブラウザアプリ。WordPressを使っているならブログエディタのするぷろと合わせて使うと便利です。

    ここでは、はてなブログのリンク取得について。

    リンクを取得したいサイトを検索して開き、あらかじめ登録したカスタムタグをタップするだけで、タグを取得してくれます。

    するぷろーら X

    するぷろーら X

    • Gachatech
    • 仕事効率化
    • ¥610

    私が登録しているカスタムタグは下記。

    はてな記法ブログカード

    [!url!:embed]
    
    [!url!:favicon:title]
    

    はてな記法テキストリンク

    [!url!:favicon:title]
    

    ShareHTML左大ポップアップ

    これはカスタムタグじゃなくて、ブックマークレットとして。ブログカードでリンクを紹介したくないときに使用。

    javascript:(function(){var d=document,e=d.createElement('script'),url='http://dl.dropbox.com/u/2271551/javascript/sharehtml.js';if(!url.match(/\?/))url+='?t='+(new%20Date()).getTime();url+='&out='+'popup'+'&cnt='+'100'+'&sts='+'%3Cbr%3E%3Cspan%20style=%22color:%20#808080;font-size:%2080%25;%22%3E'+'&ste='+'%3C/span%3E'+'&cts='+'%3Cbr%3E%3Cstrong%3E'+'&cte='+'%3C/strong%3E'+'&fmt='+'%3Ca%20href=%22$%7Bposturl%7D%22%20target=%22_blank%22%3E%3Cimg%20class=%22alignleft%22%20align=%22left%22%20border=%220%22%20src=%22http://capture.heartrails.com/150x130/shadow?$%7Bposturl%7D%22%20alt=%22%22%20width=%22150%22%20height=%22130%22%20/%3E%3C/a%3E%3Ca%20style=%22color:#0070C5;%22%20href=%22$%7Bposturl%7D%22%20target=%22_blank%22%3E$%7Bposttitle%7D%3C/a%3E%3Ca%20href=%22http://b.hatena.ne.jp/entry/$%7Bposturl%7D%22%20target=%22_blank%22%3E%3Cimg%20border=%220%22%20src=%22http://b.hatena.ne.jp/entry/image/$%7Bposturl%7D%22%20alt=%22%22%20/%3E%3C/a%3E$%7Bpostselect%7D$%7Bmemo%7D%3Cbr%20style=%22clear:both;%22%20/%3E%3Cbr%3E';e.charset='utf-8';e.src=url;e.id='bmlt';d.body.appendChild(e);})();
    

    送信後の処理に登録したスキーム「Flicker2HTML」

    javascript:(function(){var%20d=document,e=d.createElement('script'),url='http://dl.dropbox.com/u/290961/js/flickr2html.js';if(!url.match(/\?/))url+='?t='+(new%20Date()).getTime();url+='&out='+'drafts4'+'&api='+'78e59a65f121aab7a4b9312bb4937776'+'&scs='+'288'+'&typ='+'M500'+'&fmt='+'%3Ca%20href=%22$%7BpageURL%7D%22%20title=%22$%7Btitle%7D%20by%20$%7Busername%7D,%20on%20Flickr%22%20target=%22_blank%22%3E%3Cimg%20class=%22flickr_photo%22%20src=%22$%7BimgURL%7D%22%20alt=%22$%7Btitle%7D%22%20$%7Bwidth%7D/%3E%3C/a%3E';e.charset='utf-8';e.src=url;e.id='bmlt';d.body.appendChild(e);})();
    

    各アプリのurlスキーム

    それぞれのアプリにurlスキームを登録しておくことで、ホーム画面に戻ることなくアプリ間の移動ができるようになり、記事作成のスピードがあがります。

    アプリ urlスキーム
    Drafts4 drafts4://
    textwell textwell://
    するぷろーら slplorer://

    あとがき

    複雑に見えるけど、一回設定してしまえばサクサク記事を書くことができるようになります。この記事もiPhoneだけで書いています。

    画像の編集をのぞくと、ブログ記事作成に使用するのはここに書いたアプリだけ。

    これで、年末年始にパソコンを持って移動する必要はなくなりそうです。