画像35枚で解説！モブログ歴9年の私のモブログ全手順ーいつもていねいに

このブログ「いつもていねいに」を書いている 小田やかた です。
プロフィールはこちら、Xのアカウントはこちらです。

ブログの記事の９割はモブログで書いているモブログ歴9年の私がモブログの全手順を紹介します。（iPhoneユーザーのため一部iOSのみのアプリの紹介もありますが予めご了承ください。）

なお、本記事は、2019年4月に出版した以下の電子書籍『モブログの極意〜モブログからモバイル知的生活へ〜』の内容を補う目的で公開しています。

モブログの始め方や続け方の工夫、考え方を余すことなく書いた本ですので、もしモブログにご興味があれば、ぜひ、ご覧ください。また、モバイルな「知的生活」の送り方について、まるまる1章分を使って書いています。

モブログの極意: モブログからモバイル知的生活へ

1 モブログの全手順
2 HandyFlowyの機能拡張スクリプトの登録方法
3 おわりに

1 モブログの全手順

(1) ネタの管理

ブログのネタは、アウトライナーの「WorkFlowy」（HandyFlowy）に書き留めストックしています。執筆中の原稿と一緒に管理しています。（以下の画像は、ネタや書きかけの記事をHandyFlowyで管理している様子）

ストックしたネタは、定期的に見返して、行（トピック）を上下に動かしながら、似た内容を近くに寄せたり、インデント（右に移動）して階層化したり、下の階層に追記したりしながら、断片的なネタから考えを深めて少しずつ記事にしていきます。

HandyFlowyは、キーボードの上にあるボタンでトピックを上下左右に動かすことが簡単にできます。

WorkFlowy: Note, List, Outline

開発元:FunRoutine INC

無料

posted withアプリーチ

HandyFlowy

開発元:Michinari YAMAMOTO

無料

posted withアプリーチ

(2) HandyFlowyからPressSyncへ

ストックしたネタをもとにWorkFlowy（HandyFlowy）で記事の原稿を書き、書き終えたら推敲します。推敲後、WordPressへ投稿できるiOSアプリ「PressSync」で公開しています。

PressSync – for WordPress

開発元:Hiroaki Hayase

無料

posted withアプリーチ

HandyFlowyからPressSyncへのデータの移動はスムーズです。

HandyFlowyで推敲後、以下の画像のとおり、HandyFlowyで該当の記事を最上位に表示させ、HandyFlowyの「機能拡張スクリプト」から「WF2BlogEDeluxe4PressSync」を発動させます。

※最上位に表示させる方法は、該当のトピックの文頭にある黒丸をタップします。

※機能拡張スクリプトの登録方法は次項で解説します。

すると「PressSync」が起動し、タイトル欄にはHandyFlowyの最上位の内容が表示され、本文欄にはHandyFlowyで書いた記事の原稿に自動でHTMLタグが付与された形の原稿が表示されます。

(3) 記事に画像を挿入

記事に画像を入れる場合は、ここで「保存」→「下書き」とタップして、いったん、PressSyncを閉じます。

もし、PressSync以外のブログ投稿アプリをお使いの場合は、HandyFlowyの「機能拡張スクリプト」の「WF2BlogEDeluxe4CopyToClipboard」を発動させます。（※機能拡張スクリプトの登録方法は次項で解説します）すると、クリップボードにHTMLタグが付与された形の原稿が保存されますので、お使いのブログ投稿アプリを起動し、ペーストします。

次に記事に入れる画像を加工し、PressSyncにアップロードします。

私は、画像の加工には「Skitch」を使っています。

Skitch: 撮る。描き込む。共有する。

開発元:Evernote

無料

posted withアプリーチ

ここでは、例として、iPhoneの画面のスクリーンショットを撮った後、Skitchで加工し、PressSyncにアップロードする流れを解説します。

スクリーンショットを撮ったあと、写真アプリを起動します。というのは、Skitchは写真アプリから起動させることができ、Skitchから写真を選択するより、手順が効率的なのです。

写真アプリで該当の画像を選択後、右上の「編集」をタップします。

右下の丸の中に点のあるアイコンをタップします。

するとSkitchが表示されますので、タップします。

Skitchでは、以下の画像のとおり、画面をスワイプすると矢印を書くことができます。矢印だけではなく、右下のアイコンをタップするとモザイクや枠、テキスト入力に切り替えることができます。

加工が終わったら右上の「完了」をタップします。

あとは、PressSyncを起動し、画像を挿入したい場所でカメラアイコンをタップします。

「画像を挿入」のメニューの中から「ローカルライブラリから選択」をタップします。

写真アプリ内のアルバムが表示されるため「Camera Roll」を選択します。

該当の画像を選び「Done」をタップすると本文に画像のコードが挿入されました。これで記事内に画像が表示されます。

(4) アイキャッチ画像を挿入

次にアイキャッチの画像を作ります。

私は「Canva」を使っています。

Canva-ポスター、ポストカード、招待状、挨拶状のデザイン

開発元:Canva

無料

posted withアプリーチ

Canvaを起動後、右上の「…」をタップし「カスタムサイズのデザイン作成」をタップします。

サイズはお好みですが、私は「幅560 高さ315」としています。

右下の「＋」をタップし、表示されたメニューから「画像」をタップします。

キーワードで検索します。ここでは「スマホ」と検索しています。検索結果のうち、「無料」とあるもの以外は有料になります。

画像を選択すると、白いキャンパスに画像が表示されます。

ここからは画像サイズを変えたり文字を入れたりできます。まずは四隅をドラッグして画像を拡大します。

次に「テキスト」を選択し、文字を入れます。

フォントや色をカスタマイズできます。

完成したら、右上の矢印のアイコンをタップします。すると「マジックを起こしています」と表示されます。マジックの意味はよくわかりませんが、共有できる状態にしているようです。

すると共有メニューが表示されますので「PressSyncにコピー」をタップし、「アップロード」をタップします。

これで今作った画像がPressSyncにアップロードされました。

今度は、再びPressSyncを起動させます。

さきほど下書き保存した記事を選び、左下の「投稿オプション」をタップします。

「アイキャッチ画像」をタップします。

さきほどCanvaで作った画像が表示されますので、それを選択します。

あとは、「カテゴリー」「タグ」「スラッグ」を入力します。スラッグとは、記事のURLのことです。本ブログで言えば、「https://teineini.net/★★★」の★にあたる部分です。すべて入力し終えたら右上の「セット」をタップします。

右上の「保存」をタップし「公開」をタップすれば、ブログの記事が公開されます。

2 HandyFlowyの機能拡張スクリプトの登録方法

前項のHandyFlowyの機能拡張スクリプトの「WF2BlogEDeluxe4PressSync」と「WF2BlogEDeluxe4CopyToClipboard」の登録方法を解説します。

ただし、この機能はHandyFlowyのアプリ内課金が必要です。設定画面から購入の手続きをします。（画像は購入後の画面）

また、設定で「インストール制限の解除」をオンにしておく必要があります。

スマートフォンのブラウザで以下のアドレスにアクセスします。

WorkFlowy→HTML(Blog Editor) – WorkFlowy

「Deluxe version」の内容を表示させ（＋をタップすると表示）「WF2BlogEDeluxe4PressSync」の下にあるリンク形式のURLをタップします。

すると「HandyFlowyで開きますか？」と聞いてきますので、「開く」をタップし、登録しますかと聞かれますので「登録」をタップすれば登録完了です。

クリップボードに保存する「WF2BlogEDeluxe4CopyToClipboard」は、同様に「Deluxe version」の内容を表示させたあと、「Copy to Clipboard」の中の「WF2BlogEDeluxe4CopyToClipboard」の下にあるリンク形式のURLをタップすれば登録できます。