EPISODE 02

非ITエンジニアが取り組むリモートワーク基盤構築の記録

Ulyssesからはてなブログに投稿する

Ulyssesは相変わらず気に入っていて毎日欠かさずに使っている。文章を書く作業に関しては特に課題や不満もでないので、引き続き活用していきたいと考えている。とはいえ、使っていくうちに欲は出てくるもので、次は書いた文章をブログに投稿したいと考えるようになってきた。

Ulyssesからはてなブログに投稿する手段を検討する

UlyssesのiOSアプリのアプリ内設定項目を確認すると、ブログ記事の投稿をサポートしているのは「Medium」、「WordPress.com」、「カスタム WordPress」で、はてなブログには対応していない。

今後もサポートされることも見込めないようなので、ユーザ側で対応する方法を検討してみる。

UlyssesからiOSのメールアプリに引き継いでメール投稿

はてなブログでは、ブログごとに「投稿メールアドレス」が発行され、メールから記事を投稿することができる。投稿用のメールアドレスの確認方法はブログ管理画面の設定>詳細設定で直接投稿するアドレスに記載されていて、ここには直接投稿するアドレスと、および下書き保存されるアドレスの二種類がが記載されているはずだ。投稿の目的に応じて使い分けることができる。

上記メールアドレス宛に任意のメールアドレスから送信すると、メールの件名は記事のタイトル、メールの本文は記事の本文、添付した写真は「はてなフォトライフ」にアップロードされ、記事の「先頭」に貼り付けされるという仕組み。

はてなブログの編集モードとUlyssesの関係

ブログの記法によってUlyssesからの書き出し方法は異なり、関係は以下の通りとなる。

はてな編集モード Ulysses書き出し
見たまま HTML
はてな記法 テキスト
Markdown 記法 テキスト

「はてな記法」に設定している場合は、メールアドレスの「@」の直前に「.hatena」をつけたメールアドレスに変更しておく。

Ulyssesからメールアプリを経由してブログに投稿する

上記前提でUlyssesからメールアプリに送る手順は、
Ulyssesアプリから共有アイコン>メールの送信の順にタップ

メールアプリにはUlysses本文の一行目が件名に入り、一行目からは後は本文に挿入される。

注意点として件名と本文一行目がどうしても重複してしまうため、メーラ側で削除するなどの作業は必要。また写真などの画像ファイルはUlyssesから引き継げないため、メーラ側で画像の添付作業を行う。

カテゴリの設定

カテゴリ設定を行うには一行目のタイトルの前に[]でカテゴリ名を括り記述する。ただしUlyssesでは[]をリンクとして認識してしまうため、[]の前に\(バックスラッシュ)を追記してエスケープしておく。
例)カテゴリ名をiPhoneにして、タイトルをテスト投稿とするケースではUlyssesの一行目に以下のように記述しておく。  
  \[iPhone] テスト投稿

メール投稿まとめ

Ulyssesからメールメールを利用して、はてなブログに投稿する際の作業手順は、
1)Ulyssesでブログ記事を作成
2)メールアプリに引き渡し、本文一行目を削除
3)メールアプリに画像を添付
4)宛先のメールアドレスを指定して送信

これで、記事の投稿もしくは下書きに保存されているはずだ。

メールによる投稿で良い点は、Ulyssesからメールアプリへの文章引き渡しが楽なこと、下書き、公開を明示的に選択して投稿できること。逆に若干面倒なのは画像の添付をメーラ側で行う必要があること、任意の位置に写真を貼り付けできないこと、投稿前にメーラーでテキスト編集を加える必要があること。

投稿時に若干の手間はあるがUlyssesアプリに特別な設定は不要なので、気軽に使うことができる。

UlyssesからiOSのはてなブログアプリに引き継いで投稿する

はてなブログにはiOSのブログ投稿アプリがあり、このアプリを使うことでブログ記事の編集からカテゴリの設定、写真の挿入、投稿までを行うことができる。ただしエディタとして優れた機能を持っているわけではないので、Ulyssesで記事を書いたとは編集した文章をコピーして、アプリにペーストするといった手順になる。

UlyssesからURLスキームを利用して文章を引き渡す

考え方としては、Ulyssesをブログ投稿アプリの代わりにするが、Ulyssesで書いた文章をUlyssesアプリからの直接投稿はできないので、はてなブログアプリを経由して投稿するといったアプローチ。はてなブログアプリはURLスキームをサポートしているので、このURLスキームを上手く使えば、Ulyssesで編集した文章を引き渡すことができるはずだ。

新しい記事を作成するためのURLスキームは
hatenablog:///new?title=&body=
となっていて、titleが記事タイトル、bodyが記事の内容となる。ここにUlyssesで編集した文章を代入すれば、はてなブログアプリ側で認識するという想定。

Workflowアプリと、はてなブログアプリの連携

利用したのはWorkflowアプリで、記事投稿までの手順は以下の通り。

1)UlyssesからExtensionを呼び出して文章をWorkflowアプリに引き渡す

2)文章の一行目をタイトルに設定する
3)文章の一行目を削除する
4)URLスキームにタイトルと記事本文を入れる
5)URLスキームで、はてなブログアプリに引き渡す

6)写真をはてなブログアプリの任意の場所に貼り付けて投稿する

手順を書くと長いように感じるが、実際には2)〜5)はWorkflowアプリでの処理となるので手作業は1)と6)のみになる。

記事のカテゴリ設定は、メールアプリでの投稿同様で、一行目のタイトルの前に[]でカテゴリ名を括り記述する。ただしUlyssesでは[]をリンクとして認識してしまうため、[]の前に\(バックスラッシュ)を追記してエスケープしておく。

例)カテゴリ名をiPhoneにして、タイトルをテスト投稿とするケースではUlyssesの一行目に以下のように記述しておく。  
  \[iPhone] テスト投稿

メール投稿同様に一行目を本文として認識するけど、Workflowアプリではその点を考慮して一行目を削除するフローにしてある。写真の投稿はUlyssesからの引き継ぎができないため、はてなブログアプリ側で任意の位置に貼り付ける。

作成したフローは以下にシェアしておく
https://workflow.is/workflows/9677996d11364d7eb6a9c30b605db62c

Workflowを使うメリットは、はてなブログアプリへのデータ引渡しが自動化されること、はてなブログアプリで写真の貼り付けが任意の場所に設定できること。デメリットは、Ulyssesアプリで、Workflowアプリ、はてなブログアプリと3つのアプリケーションを連携する必要があること。

今後の課題

Ulyssesアプリから数タップで、はてなブログへ投稿するというのが理想だけど、そこまではできていない。もう少し深掘りすれば、はてなブログのAPIを利用して、写真をはてなフォトライフに投稿 > 写真のURLを取得 > 記事の投稿まで自動化するといったフローも実現できそうな感触。
その他、YouTube動画、App Storeアプリ、Instagram、過去記事の貼り付時に必要なテキスト処理も、Workflowアプリを利用すれば可能なはずなので、あわせて検討していく予定。

はてなブログ

はてなブログ

  • 株式会社はてな
  • ソーシャルネットワーキング
  • 無料

Workflow: Powerful Automation Made Simple

Workflow: Powerful Automation Made Simple

  • DeskConnect, Inc.
  • 仕事効率化
  • ¥360

Ulysses

Ulysses

  • The Soulmen GbR
  • 仕事効率化
  • ¥3,000