MarsEditのプレビューでブログと同じ表示にする設定(主にFC2ブログ用)


MarsEditのプレビューでブログと同じ表示にする設定(主にFC2ブログ用)についてです。厳密には同じ表示ではなく似た表示となります。

 

今回紹介するのはFC2ブログ用ですが、他のブログでも使えるかもしれません。なおスタイルシート(CSS)についてある程度の知識が必要です。

 

ネットでググって出てくる設定はほとんどがワードプレス用で、FC2ブログのようなブログサービスには直接対応していないものばかりなので今回紹介することにしました。参考にしてみてください。

 

 

設定方法(主にFC2ブログ用)

 

1. ブラウザでFC2ブログの設定画面から「テンプレートの設定」を開きます。


2. 表示されている「スタイルシート編集」にカーソルを置き、全て選択しコピーします(コマンド+A→コマンド+C)。

180503 0003

 

3. MarsEditで「Edit Preview Template」からプレビューのテンプレートを開き、標準のテンプレートの下記の#extended#</div>の後に<style> </style>を追記します(下記の12〜13行目)。

<head>
<title>#weblogName#: #title#</title>
</head>
<body style="margin:0; background-color:#FFF;">
<div style="padding:10px 20px; color:#DDD; background-color:#333; margin:0;">
<span style="font-size:2em;”>#title#</span>
</div>
<div style="padding:10px 20px;">
#body#
#extended#
</div>
<style>
</style>
</body>
</html>


4. 追記した<style> </style>の中に2.でコピーしたものを貼り付けます。

 

5. 貼り付けただけではうまくいかない場合があるので、クラス属性などの箇所を除去していきます。

 .entry_body h1 {

  ↓(entry_body属性を除去)

 h1 {

 

 

このようにすることで、プレビュー画面でブログに近い表示になりますね。

180503 0005

 

 

 



↓この記事が参考になったら拍手(どなたでも可)、ツイート、いいね、はてブ、Pocket、をお願いします。今後のブログ作りに役立てたいので。

関連記事

プロフィール

てぃー

Author:てぃー
詳しい自己紹介:こちら
Twitter:@teapipin


Instagram:@teapipin

follow us in feedly 
にほんブログ村 IT技術ブログへ にほんブログ村 PC家電ブログへ
現在の閲覧者数:

ブログ内検索
今日のアクセス数の多い記事
カレンダー

09月 | 2018年10月 | 11月
- 1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31 - - -
過去記事ダイジェスト
お知らせ
ツイッター分析の分析結果が引用された研究が学会賞を受賞!!


ツイッター分析の分析結果が新潟大学教育学部の論文に引用
教育の実証研究の場でも高く評価!

ツイッター分析の分析結果が和歌山大学防災研究教育センターの論文に引用
防災の研究において評価!

2015年版ツイッター分析(世界編)が始動!
今回は世界の国別・言語別ツイートを分析!

ツイッター分析の分析結果が慶應義塾大学有名教授の研究論文などに引用
文系の研究までも制覇!

Interval Timer EX
有名雑誌「Mac Fan 2015月2月号」に「インターバルタイマーEX」が3度目の掲載!ポモドーロテクニックに有効!

自作Macアプリ3部作が2014年 Vector 年間ダウンロードランキング Mac トップ100にすべてランクイン

TimeCalcを公開しています!
時間計算、年齢計算、学歴欄作成など。

ツイッター分析の分析結果が人工知能の研究に!
ブログが学会発表で引用されました。

今まで開発したiPhoneアプリのソースコードを公開しています!
勉強に役立ててください。


2013年 Vector 年間ダウンロードランキング Mac トップ100に「デジカメ変更日を撮影日に一括変更 for Mac」と「インターバルタイマーEX」がランクイン

Interval Timer EX
有名雑誌「Mac Fan 2013月4月号」に「インターバルタイマーEX」が2度目の掲載!!

リアルタイムツイッター地図
リアルタイムツイッター地図を公開しています!
位置情報付きツイートをリアルタイムに表示します。

新たなツイッター分析としてイベントツイート分析を行っています!

2012年8月1日(水)開催の「Twitter勉強会」で発表
ツイッター調査:約173万ツイートを調査して分かったTwitterの利用動向 #twtr_hack from teapipin


Interval Timer EX
有名雑誌「Mac Fan 2012月3月号」に「インターバルタイマーEX」が掲載!!



 

はてなブックマークの人気記事