知的生産

画像35枚で解説!モブログ歴9年の私のモブログ全手順

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

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

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


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

1 モブログの全手順

(1) ネタの管理

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

NewImage

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

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

NewImage
WorkFlowy: Note, List, Outline

WorkFlowy: Note, List, Outline
開発元:FunRoutine INC
無料
posted withアプリーチ
HandyFlowy

HandyFlowy
開発元:Michinari YAMAMOTO
無料
posted withアプリーチ

(2) HandyFlowyからPressSyncへ

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

PressSync - for WordPress

PressSync – for WordPress
開発元:Hiroaki Hayase
無料
posted withアプリーチ

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

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

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

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

NewImage NewImage

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

NewImage

(3) 記事に画像を挿入

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

NewImage

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

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

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

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

Skitch: 撮る。描き込む。共有する。
開発元:Evernote
無料
posted withアプリーチ

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

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

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

NewImage

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

NewImage

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

NewImage

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

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

NewImage

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

NewImage

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

NewImage

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

NewImage

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

NewImage

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

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

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

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

Canva-ポスター、ポストカード、招待状、挨拶状のデザイン
開発元:Canva
無料
posted withアプリーチ

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

NewImage

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

NewImage

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

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

NewImage

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

NewImage

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

NewImage

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

NewImage

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

NewImage

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

NewImage

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

NewImage NewImage

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

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

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

NewImage

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

NewImage

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

NewImage

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

NewImage

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

NewImage

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

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

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

NewImage

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

NewImage

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

WorkFlowy→HTML(Blog Editor) – WorkFlowy

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

NewImage

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

NewImage

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

NewImage

3 おわりに

いかがだったでしょうか。かなり細かい手順を画像をたくさん使って説明してきました。

これまで、少しでも効率的にモブログができるよう試行錯誤し、基本的には、この手順で落ち着いています。

これからも、もっと効率的な方法があれば、いろいろ試して、今の方法をアップデートしていこうと思っています。

なお、長年モブログで培った知見や考え方は、以下の電子書籍にまとめましたので、ぜひお読みください。


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

以上です。

本記事は参考になりましたか?
もし、少しでも参考になったことがあれば、フォロー&シェアしていただけるとうれしいです!!


また、「1分で読める書評ブログ」も運営していますので、興味があれば、ぜひご覧ください。

ABOUT ME
小田やかた
小田やかた
二人の子どもを持つ共働きサラリーマンパパ。現在、小学生と保育園児の子育てに奮闘中です。 本ブログは、PhoneとPCでの情報管理、文章作成、タスク管理がメインテーマのブログです。WorkFlowy、 Evernote、たすくまなどのアプリを使って知的生産のある暮らし(新しい価値を生む暮らし)を目指しています。 『アウトライナーのレシピ 〜思考・情報整理・文章作成がはかどる20の使い方〜』と『モブログの極意 〜モブログからモバイル知的生活へ〜』をKDPで出版。
関連記事