最近はMacが目の前にあってもモブログしてしまうほど環境が整いつつあります。そんななかで欠かせないのがRowlineエディタです。多彩なURLスキームをサポートすることにより外部からのブログパーツ流し込みが可能で、ライン毎に編集、前後の入れ替え、プレビューまでこなす多機能HTMLプレビューエディタです。
Rowline 1.1.1
ビジネス
App Storeで詳細を見る
このRowlineエディタがプレビューに際し、カスタムCSSによるHTMLプレビューに対応していましたのでご紹介します。ご存知の方にとっては何を今さらな訳ですが。
普通のプレビューとカスタムCSSプレビューの比較
カスタムCSSのプレビューとは、要するに自分のブログのテーマに近い形でプレビューができるということです。
左がカスタムCSS指定した場合、右が指定しない場合のプレビューの比較です。フォントサイズ、見出しデザイン、クラス指定による画像のセンタリングなどが適用されているのがわかります。
サンプルをもう一つ。ShareHtmlによるフレーム部分をクラスで指定していますので適用されていることが分かります。またblockquoteのデザインもカスタマイズしており反映されていることが分かります。
カスタムCSSの設定方法
設定アプリにあるRowline設定からCSS URLを指定するだけです。
自分のブログのテーマに使われているCSS URLを確認するには、自分のブログをブラウザから表示し「ソース表示」から、例えば以下のスタイルシートの指定している箇所を探し出し、hrefの中にあるURLをコピーします。
<link rel=”stylesheet” href=”https://daisukeblog.com/wp/wp-content/plugins/wptouch/themes/custom/style.css” type=”text/css” media=”screen” />
設定アプリにあるRowlineを選択します。
先ほどコピーしたスタイルシートのURLを貼り付けます。
あとはプレビューするだけです。
こんな機能があったなんて驚きでした。普段はRowlineでほとんどの編集を行い、するぷろへ流し込んでいますが、このカスタムCSSによるプレビューによってさらに制度の高いドラフト作成が可能になりました。いやはや恐れ入りました。
Rowline 1.1.1
ビジネス
App Storeで詳細を見る
Posted from するぷろ for iPhone.