WEB漫画マンガ/絵本専用Comicテンプレート：漫画を中央に表示させる

★ 漫画を中央に表示させる

大事なお知らせ FC2ブログ非公開変数の領域変更により、一部ページナビが表示されない等テンプレートに不具合が出ております。ユーザーの皆さまにはご迷惑をおかけして恐縮ですが、 2012.11.10.以前にDLしたテンプレートをご利用の場合は、一旦テンプレートを削除、もしくは名前を変更した上で、再DLして御利用くださいますようお願い申し上げます。詳しくは

不具合解消のための再DLのお願い

投稿した漫画（画像）を中央に表示させる方法は二つあります。
（１）スタイルシートに、中央表示の指定を追加する。
（２）記事を投稿するごとに、漫画の前後を中央表示のタグで囲む。

（１）の方法は全ての記事の表示をまとめて指定できるのでかなり省力です。同じテンプレートを使っている限り、記事本文に投稿した漫画は自動的に中央に配置されます。しかし、その場合、追記は平常左寄せ表示ですが、記事本文に文章がある場合はそれも中央寄せで表示されてしまいます。また、テンプレートを変更した場合、変更したテンプレートにも同じカスタマイズを施さないと、画像は元通り左よせに表示されてしまいます。

（２）は、漫画を投稿する度にひと手間かけなければならないので、（１）に比べると少々面倒です。しかし、漫画だけを中央寄せにすることができますし、テンプレートを変更しても漫画はそのまま中央寄せで表示されます。

どちらでも、お好みの方法をどうぞ～

（１）スタイルシートでまとめて指定する

［菅理画面］⇒［環境設定］⇒【テンプレートの設定】をクリックして
［テンプレートの管理］ページを開く

PCテンプレート [ テンプレート名 ] 適用中
[ テンプレート名 ] のテンプレート名変更
テンプレート名のHTML編集
テンプレート名のスタイルシート編集　　　　　　　　　こんなふうに上から順番に並んでいます。

［スタイルシート編集］部分をカスタマイズします。

スタイルシートの末尾に以下のＡ.　Ｂ．Ｃ．のいずれかを追加します。

全てのページの記事本文を中央寄せにする

Ａ.　全てのページで記事本文部分を中央寄せにする場合は以下だけでOKです。

.entry_comic {text-align:center;}

漫画掲載カテゴリは中央寄せ、それ以外のカテゴリは左寄せ(通常表示)にする場合

カテゴリ番号は［カテゴリの編集］画面のカテゴリ一覧リストの一番左、#　をクリックすると表示される番号がそれですが、カテゴリページのアドレスからも確認できます。
http://comictemplate.blog.fc2.com/blog-category-〇〇.html
〇〇がそのカテゴリのカテゴリ番号です。

Ｂ.　ほとんどが漫画掲載カテゴリの場合、全体を中央寄せに指定してから、
漫画以外のカテゴリだけを左寄せに指定します

.entry_comic {text-align:center;}
div.kakusi漫画以外のカテゴリ番号 .entry_comic {text-align:left;}

Ｃ.　漫画掲載カテゴリの方が漫画以外のカテゴリより少ない場合は、
漫画カテゴリだけを中央寄せに指定します

div.kakusi漫画のカテゴリ番号 .entry_comic {text-align:center;}

漫画カテゴリが複数ある場合は、漫画カテゴリ番号のクラス名を列挙します。
以下はカテゴリ番号１から５までが漫画カテゴリの場合の例

div.kakusi1 .entry_comic, div.kakusi2 .entry_comic, div.kakusi3 .entry_comic,
div.kakusi4 .entry_comic, div.kakusi5 .entry_comic {text-align:center;}

この時、カテゴリ番号を親カテゴリ番号にすると、その親カテゴリに属する全ての子カテゴリの記事本文は中央寄せで表示されます。
上の例でも、もし、カテゴリ番号１から４までが親カテゴリ番号６の子カテゴリの場合は以下でOKです。

div.kakusi5 .entry_comic, div.kakusi6 .entry_comic {text-align:center;}

【更新】をクリックする。

（２）記事を投稿するごとに中央表示のタグで囲む

漫画を中央寄せにするには、以下のように画像タグの前後を、
<div style="text-align: center">～</div>で囲めばOKです。

<div style="text-align: center"><img border="0" alt="ss_kadeb.jpg" width="幅" height="高さ" src="画像アドレス" /></div>

手打ちでタグを書き込むのが面倒な場合は　WYSIWYGテキストエディタを使えばカーソルの操作だけで中央表示にできます。
WYSIWYGテキストエディタは「通常モード」でなければ稼働しないので、「簡易モード」にしている場合はオフにします。

記事編集ページ上部の簡易モードのONをダブルクリックして OFF にします。

ツールバーも通常モードになりWYSIWYGテキストエディタのボタンWが表示されるのでクリック。

▼WYSIWYGテキストエディタの編集画面に変わります

▼画像の上にカーソルをおきクリックしてから、中央揃えボタンをクリック

▼画像が反転し中央に移動します。

これでOKですが、このまま保存すると、次に編集画面を開いた時もW
YSIWYGテキストエディタの変種画面になってしまうので、
もう一度Wをクリックして通常の編集画面に戻してから

【記事を保存】をクリック

初期設定を通常モード（簡易モードOFFの状態）に変更する場合は
【環境設定】⇒【環境設定の変更】⇒【その他の設定】⇒【初期ページ設定】
⇒【簡易モード】【簡易モードを初期設定にしない】 ⇒【更新】
※「簡易モード / 通常モード」に切り替わらない場合はブラウザのCookieを削除してからブラウザを再起動してから再度試します。詳しくは