[Mac] WordPressの投稿プレビューを簡単に一発確認する方法
WordPressでブログ記事の下書きを書いた時にプレビューを簡単に見る方法の解説です。
記事を書いていきなり公開するのではなく一旦下書き保存して確認、修正してから公開するという方も多いのではないかと思います。ただWordPressの管理画面ではなく外部ツールから投稿すると記事のプレビューがすぐに開けない事があり不便でした。そこでこの方法を考えました。
目次
Alfredを使う
やり方は色々とありますが自分のMac環境で汎用的に使いたかったのでAlfredを使うことにしました。ですのでこれはAlfredユーザー限定のTipsです。
設定方法
ホットキーでAlfredを開いて「Show Alfred Preferrences」を開きます。alをタイプすれば出てくるかと思います。
Alfredの環境設定画面で [Features] - [Web Search] を選択します。
右下の [Add Custom Search] ボタンを押します。
画像の様な形で入力します。
| Search URL | あなたのWPブログURL/?p={query}&preview=true | URLだけ変更 |
| Title | Alfredの検索画面に表示される文言 | 任意 |
| Keyword | このコマンドを呼び出すキーワード | 任意 |
| Validation | テスト用。横の[Test]ボタンで動作確認できる | 任意 |
その他 Encodeのチェックはあってもなくてもどちらでも良いです。
利用方法
ホットキーでAlfredを開いて、呼び出しキーワードと記事のID（PostID）を入力すれば標準のブラウザで記事のプレビューが開かれます。WordPresの管理画面を開く必要はありません。
なおWordPressの管理画面を開いておく必要はありませんがWordPressにログイン状態である必要はあります。事前にログインしてCookieがあればOKです。これはログイン状態で無いと非公開の記事は管理者以外は見れない為です。
Emacsでのやり方
Emacsのorg2blogから記事を投稿する場合は、変数 org2blog/wp-show-post-in-browser とブラウザ関係の変数を設定すれば可能です。例えばこんな感じで。
<span style="color: #5F7F5F;">;; </span><span style="color: #7F9F7F;">投稿後のブラウザ表示を尋ねる
</span><span style="color: #DCDCCC;">(</span><span style="color: #F0DFAF; font-weight: bold;">setq</span> <span style="text-decoration: underline;">org2blog/wp-show-post-in-browser</span> 'ask<span style="color: #DCDCCC;">)</span> <span style="color: #5F7F5F;">; </span><span style="color: #7F9F7F;">'showで常時、nilで無効化
</span>
<span style="color: #5F7F5F;">;; </span><span style="color: #7F9F7F;">--------------------------------------------------------------------
</span><span style="color: #5F7F5F;">;; </span><span style="color: #7F9F7F;">ブラウザ関係の設定例
</span><span style="color: #5F7F5F;">;; </span><span style="color: #7F9F7F;">--------------------------------------------------------------------
</span><span style="color: #5F7F5F;">;; </span><span style="color: #7F9F7F;">デフォルトブラウザをewwに外部ブラウザをFirefoxに
</span><span style="color: #DCDCCC;">(</span><span style="color: #F0DFAF; font-weight: bold;">setq</span> browse-url-browser-function 'eww-browse-url
<span style="text-decoration: underline;">shr-external-browser</span> 'browse-url-firefox<span style="color: #DCDCCC;">)</span>
<span style="color: #5F7F5F;">;; </span><span style="color: #7F9F7F;">FirefoxでなくChromeを使う場合
</span><span style="color: #DCDCCC;">(</span><span style="color: #F0DFAF; font-weight: bold;">when</span> <span style="color: #BFEBBF;">(</span>eq system-type 'darwin<span style="color: #BFEBBF;">)</span> <span style="color: #5F7F5F;">; </span><span style="color: #7F9F7F;">Mac
</span> <span style="color: #BFEBBF;">(</span><span style="color: #F0DFAF; font-weight: bold;">setq</span> <span style="text-decoration: underline;">browse-url-generic-program</span> <span style="color: #CC9393;">"/usr/bin/open"</span>
<span style="text-decoration: underline;">browse-url-generic-args</span> '<span style="color: #D0BF8F;">(</span><span style="color: #CC9393;">"-a"</span> <span style="color: #CC9393;">"/Applications/Google Chrome.app"</span><span style="color: #D0BF8F;">)</span><span style="color: #BFEBBF;">)</span><span style="color: #DCDCCC;">)</span>
<span style="color: #DCDCCC;">(</span><span style="color: #F0DFAF; font-weight: bold;">setq</span> browse-url-browser-function 'eww-browse-url
shr-external-browser 'browse-url-generic<span style="color: #DCDCCC;">)</span>
<span style="color: #5F7F5F;">;; </span><span style="color: #7F9F7F;">ewwで表示中のページをfを押すと外部ブラウザで表示
</span><span style="color: #DCDCCC; text-decoration: underline;">(</span><span style="color: #F0DFAF; font-weight: bold;">bind-keys</span> <span style="color: #DCDCCC; font-weight: bold;">:map</span> <span style="text-decoration: underline;">eww-mode-map</span>
<span style="color: #BFEBBF;">(</span><span style="color: #CC9393;">"f"</span> . eww-browse-with-external-browser<span style="color: #BFEBBF;">)</span><span style="color: #DCDCCC;">)</span>
ewwやw3mを使わず直接外部ブラウザにしたり色々変更可能です。ただ僕は毎回プレビューが表示されたりプレビューの確認が出るのは面倒なので通常は確認なしで運用しています。
その他
iTermからコマンドラインを使う方法などもありますね。