最新版エディタ（標準）のアレンジ　Ameblo Writer ver.4　配色オプションを充実

Ameblo Writer の導入方法

最新版エディタ（標準）のアレンジを導入するのはそう難しくなく、時間もかかりません。また、適さない場合は簡単にアンインストールできます。

導入は以下のページを参照して行ってください。

Ameblo Writer ver.4 の更新内容

「通常表示」タブの横に「表示モードの変更」ボタンがあります。「通常表示」の背景色が黒（ブラックモード）になり、写真等を主にする暗背景色のブログスキンの実際の表示に近い環境で、原稿編集を行えるものです。

このブラックモードに合せて、編集枠全体の背景色をダークグリーンにして、眩しさを抑えた編集環境のスキンをデザインしてみました。

また、編集画面内の枠線や罫線は、標準のままではアレンジした編集画面内で見え難くなりがちです。そこで、これらのエッジ部分の配色を纏めて変えられる様に整理しました。

フォント・配色・枠線のオプション

● フォントオプションのセクション

　　オプション指定のないデフォルトは、MSPゴシック 14pxです。

　　セクション2 （コード2）　編集枠内の基本フォント　メイリオ 14px

　　セクション3 （コード3）　編集枠内の基本フォント　メイリオ 16px

● 配色のオプション

　　オプション指定のないデフォルトは、ブルーグレイです。

　　セクション4 （コード4）　ウインドウ背景色　ダークグリーン

● 枠線のオプション

　　オプション指定のないデフォルトは、ライトグレイです。

　　セクション5 （コード5）　枠線・罫線　グリーン

　　セクション6 （コード6）　枠線・罫線　ダークグレー

これらのオプションは好みに組み合わせる事が出来ます。

　▪セクションの適用先の選択形式を「次で始まる URL」とすれば「有効」

　▪セクションの適用先の選択形式を「ドメイン上の URL」とすれば「無効」

これを切替えて「保存」を押すと、そのセクションの「有効」「無効」が決定されます。

全く利用しないオプションは「セクションの削除」でコードを削除しても構いません。セクションの削除に拠る処理速度の向上は、判るほどではありません。

その他のセクションの内容

セクション7 （コード7）「記事の編集・削除画面のヘッダー補正」

「ブログ管理」の「記事の編集・削除」のページのヘッダー部に、編集画面の修飾が適用されるので、これを修正するものです。 ver.3までは「適用先」のURLを新規・更新を分けて2行で指定していましたが、今回から1行で共用できる表記にした結果、「記事の編集・削除」画面が適用先に含まれる結果になりました。しかし、1行表記の運用上の便をあえて採りました。このセクションが無くても実害はありませんが、「記事の編集・削除画面」のヘッダーの配置が少し乱れたままになります。

セクション8 （コード8）「別ウインドウ表示のプレビュー画面の修復」

プレビュー画面の対策コードで「別ウインドウ表示」対応のコード。（文末参照）

セクション9 （コード9）「新タグ編集エディタ　ver.4 専用追加オプション」

「新タグ編集エディタ」にもアレンジ適用を可能にします。

Ameblo Writer ver.4 のデザイン

下はスタイルのダウンロード時の状態です。

最初は、「セクション1（基本CSS）」「セクション2（メイリオ14px）」「セクション6（枠線ダークグレー）」が有効です。

下は、編集枠を「ブラックモード」に切り替え、「セクション1（基本CSS）」「セクション2（メイリオ14px）」「セクション4（ダークグリーン背景）」「セクション5（枠線グリーン）」を有効にした状態です。

「セクション4（ダークグリーン背景）」は、「HTML表示」の編集枠も「ブラックモード」と同様にアレンジしました。元の「ブラックモード」では「HTML表示」編集枠は白背景ですが、アレンジでこちらも黒背景としています。これは、黒背景のHTML編集画面に馴れた人に特化したもので、また、眩しさを抑えた画面を求める場合にも、適しているでしょう。

　眩しさを抑える工夫　

今回に導入したダークグリーンのウインドウ背景色のデザインは、細かな部分までアレンジを徹底しています。 ver.4の各セクションの内容を参考にすれば、最新版エディタ（標準）の表示要素の細部までアプローチが出来ます。独自のスキンアレンジを必要とする人には、アレンジすべき要素を知るための便利な地図となるでしょう。

◎アメーバロゴ・編集アイコン・右サイドバータブなど、暗色背景では予想外に眩しく、それらの明るさを抑えています。

◎以下の様に各種のダイアログの配色も、暗色背景に合せています。