MarsEdit – the blog editor for WordPress, Tumblr, Blogger and more.
カテゴリ: ソーシャルネットワーキング
価格: ¥4,000(記事更新現在)
MarsEditのプレビュー画面を、自分のブログと同じデザインにカスタマイズする方法を紹介。
デフォルトのプレビューって味気なくし文字小さい
これが初期設定時のプレビュー画面。まあ記事を書く分には、これでも別に困ることはない。
しかし読みやすさなどを考慮すると、どこで改行すべきか、段落を入れるべきか、全体の原稿量が多すぎないか、といった事を考えつつ修正を行う必要がある。
それには、このデフォルトのプレビュー画面からではイメージしにくい。実際のブログデザインと同じ状況で確認しないといけない。
プレビューをカスタマイズする方法
このプレビュー画面の下に「Edit Template」とあるのでここをクリック。
これがデフォルトのプレビューを表示させるためのHTMLになる。
- #weblogName# = ブログ名
- #title# = 記事のタイトル
- #body# = 記事本文
- #extended# = 記事本文の続き
これらの要素が必要になる。
ブラウザでプレビューに使いたいブログのページのソースを表示してコピーする。
テキストエディタなどにペーストして、先ほどの#body#など、表示させたい要素を配置する。
そして先程のテンプレートのソース部分にコピペすれば完成。
右下の「Save Changes」をクリックすれば反映される。
どこに#body#などの要素を入れたらいいかわからない場合は、#タイトル# #本文# などと入力して1つ記事を作成して更新するといい。
そのページをコピペして、それぞれの要素と差し替えればOKだ。更新した記事は完了したら削除しておこう。
注意事項
TwitterやFacebook等のソーシャルボタン、そしてGoogle AdSense等の外部サービスのソースが入っているとプレビュー画面を表示すると非常に動作が重くなります。
必要なのは本文の配置イメージだけなので、それらのソースは根こそぎ排除しておきましょう。
Analyticsのソースも無駄にカウントしてしまうので削除しましょう。
カスタマイズ完了後のプレビュー画面がこちら。グレーの四角い部分は本来アドセンスが配置される部分。グレーの画像データを作って配置してみた。
改行位置やテキストのボリューム等、しっかり確認できる。
MarsEdit – the blog editor for WordPress, Tumblr, Blogger and more.
カテゴリ: ソーシャルネットワーキング
価格: ¥4,000(記事更新現在)