FC2ブログのテンプレート工房

カスタマイズが簡単な共有テンプレートを配布しています。テンプレートをカスタマイズして自分だけのオリジナルブログを作りませんか?

タイトルを中央に配置する

初期値ではタイトルは左寄せになっています。
これを中央に配置する方法を紹介します。

スタイルシートの次の部分を編集してください。

/* ヘッダーレイアウト */
#header {

text-align: left;

}


leftをcenterに書き換えるとタイトルが中央に配置されます。

/* ヘッダーレイアウト */
#header {

text-align: center;

}


rightにすると右寄せになります。
お好きなようにカスタマイズしてください。



<02/08追記>
タイトル横に画像を含むテンプレート(fullmoon_howling, white_eagle等)は上記の方法だけでは中央に配置されません。これらのテンプレートでタイトルの中央配置をしたいときには2つの方法があります。


■画像を取り除いてタイトルを中央に配置する方法

上記処理を施した後にHTMLのヘッダーに関する記述を次のように書き換えます。

<!--▼▼▼▼ ヘッダー(タイトル部分)▼▼▼▼-->
<tr><td id="header">
<h1><a href="<%url>"><%blog_name></a></h1>
<h2><%introduction></h2>
</td></tr>
<!--▲▲▲▲ ヘッダー(タイトル部分)▲▲▲▲-->



■画像はそのままにタイトルを中央へ配置する方法(完全な中央にはならない)

スタイルシートに次の記述を加えます。

h1 {

text-align:center;

}

h2 {

text-align:center;

}


画像の分、中央には寄り切れませんが画像を消す必要はありません。


お好みの方法でカスタマイズしてください。
関連記事
[ 184 ]
ライトカラム、レフトカラムの各タイトルを真ん中に表示したい場合はどこをいじればいいのでしょうか?コメントとかのことです。よろしくお願いします
[ 2006/02/20 10:23 ] [ 編集 ]
[ 187 ]
環境設定→プラグインの設定→設定の変更→タイトル文の文字位置→中央

これで各プラグインのタイトル表示位置を中央にできますよ。
[ 2006/02/22 04:05 ] [ 編集 ]
[ 192 ] >ひよこさん & 通りすがりさん
回答が遅くなってしまって申し訳ありません、ひよこさん。通りすがりさんのアドバイスのおかげで解決できたようですね。

有難う御座います。通りすがりさん。
とても助かりました。
せめて貴ブログに挨拶を…と思ってもURLを残すことなく去っていく。カッコ良すぎます^^
またいつか現れてくれることを楽しみにしていますよ。そのときは是非URLを残してくださいね。
[ 2006/02/26 04:20 ] [ 編集 ]
[ 424 ] 返信ありがとうございます
ダウンロードじゃなくてこのブログのテンプレートを使いたいんですけど、検索してもでてきませんでした。どうすればいいですか・・・・?
[ 2006/06/17 20:01 ] [ 編集 ]
[ 426 ] > Aliceさん
こんばんは、Aliceさん。
FC2ブログに登録すると共有テンプレートをダウンロードできるようになります。テンプレート選択画面で「standard」というキーワードで検索すると私のテンプレートが表示されます。
わざわざ私のテンプレートを探してもらえるなんて感激です!是非とも見つけてくださいね。解からないことがあればなんでも聞いてください。
[ 2006/06/17 20:39 ] [ 編集 ]
[ 2387 ] 質問です。
上記の様にcenterに変えてみたのですが、スタイルシートの方のプレビュー画面ではセンターに来るのですが、更新を押してテンプレートの設定の方のプレビュー画面では左端になったままです。ブログの確認をしても左端のままで困っています。お返事待ってます。
[ 2007/06/27 03:11 ] [ 編集 ]
[ 2397 ] > アタナシアさん
テンプレートは何をお使いでしょうか?
[ 2007/06/28 03:23 ] [ 編集 ]
[ 2528 ] 管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
[ 2007/07/14 00:43 ] [ 編集 ]
[ 2998 ]
タイトルは左や真ん中、右だけではなく
右斜め上などはできないんでしょうか?
[ 2007/12/21 23:03 ] [ 編集 ]
[ 3084 ] お願いします!!
ブログの素材屋さんのcatpink_001のテンプレを利用
させて頂いているのですが、サイズを大きくして
タイトル画像を中央にすることは出来たのですが
タイトル文字を中央にすることが、どうしても、出来ないので、教えてください。よろしくお願いしします。
[ 2008/02/03 11:49 ] [ 編集 ]
[ 3087 ] ゆかぴさん
そのテンプレート作者様にお聞きするのがよろしいかと思います。
ブログの素材屋さん↓
http://nanakumo.blog44.fc2.com/
[ 2008/02/04 01:37 ] [ 編集 ]
[ 3089 ] ありがとうございました
ブログの素材屋さんにお尋ねしてみます。
お手数お掛けしました。
[ 2008/02/04 08:09 ] [ 編集 ]
[ 3225 ]
いたおさんのテンプレートの
standard_wide_whiteのブログの名前・説明を左寄せの仕方が、
上の説明ではよく分からなかったので、よかったらそれの書き込み方を教えてください;
お願いします
[ 2008/04/17 01:55 ] [ 編集 ]
[ 3563 ] タイトル位置を下げることは可能ですか?
こんにちは。
テンプレート、便利に使わせていただいております。
タイトルのことで質問がありまして、どちらに書込みしたらいいかわからなかったので、こちらにコメントさせていただきます。
タイトルの位置を若干下げることは可能でしょうか?
やり方がわからなく、困っておりました。
御指南いただければと思います。
どうぞよろしくお願いいたします。
[ 2008/10/23 12:56 ] [ 編集 ]
[ 3584 ] 管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
[ 2008/11/16 17:52 ] [ 編集 ]
[ 4006 ] タイトルが変わってしまいます!?
いわおさん。先ほども質問しながら、再度、申し訳ありません。

現在、「templ8_3kuro」を活用させていただいているのですが、記事アップ後、「続きを読む(私の場合「MORE」にカスタマイズさせてもらってます)」をクリックして、「追記の編集」部分を見る(開くと)、ブログタイトルの前に、記事タイトルが記載された表示になってしまいます。

(たとえば、ブログタイトル「お気楽、味のほどしらず。」の前に、記事タイトル「グルメって、なんだろう?」入り、ブログタイトルが「グルメって、なんだろう?お気楽、味のほどしらず」になってしまいます)。

私、なにか余計なことをしてしまったでしょうか?どうにか、この事態を解消したいのですが、方法を教えていただけないでしょうか?何度も、スミマセン。
[ 2009/04/29 22:17 ] [ 編集 ]
[ 4015 ] > Ajinciさん
そのテンプレートは私のテンプレートを元にGUIDING-STARさんがカスタマイズしたものです。

ブログSEO(記事ページごとにブログタイトルを記事タイトルに変える)
http://10plate.blog44.fc2.com/blog-entry-164.html

このカスタマイズが施されているようなので、この記事の逆を試してみてください。
[ 2009/04/30 00:34 ] [ 編集 ]
[ 5010 ] 後ろとずれてしまいます
突然すみません。
タイトルを中央に配置してみたのですが、ブログの本体(?)の部分とかみ合いません。少し右にずれたように見えます。
というよりブログがサイドバーの分だけ左に配置されているように見えます、どうすれば良いでしょうか?
[ 2009/07/19 18:22 ] [ 編集 ]
[ 5018 ] > まもさん
URLを教えてもらえますか?
[ 2009/07/20 00:08 ] [ 編集 ]
[ 5551 ] 画像タイトルの場合は・・・
standard_blueを使用さしてもらっているんですが、画像のタイトルを中央に配置するには、どうしたらいいですか?
ちょっと、ずれてしまいます。

もし、記事とかであったら悪いんですが、お願いします。
[ 2009/08/20 19:28 ] [ 編集 ]
[ 5561 ] > ライドラさん
カスタマイズの過程で必要な部分を消してしまったようです。赤い箇所を加えてください。

<!--▼▼▼▼ ヘッダー(タイトル部分)▼▼▼▼-->
<tr><td id="header">



</td></tr>
<!--▲▲▲▲ ヘッダー(タイトル部分)▲▲▲▲-->
[ 2009/08/20 22:25 ] [ 編集 ]
[ 5572 ]
そうだったんですか。
ありがとうございました。
[ 2009/08/21 09:04 ] [ 編集 ]
[ 5579 ] > ライドラさん
修正したようですね。解決して良かったです。
[ 2009/08/21 19:05 ] [ 編集 ]
[ 6304 ] 管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
[ 2009/09/30 17:35 ] [ 編集 ]
[ 6310 ] ありがとうございました!
いたおさん、こんばんは!

お忙しいところ、お返事ありがとうございました。
早速変更してみました。
思ったとおりに変更できて感激でした!

ほんとうにありがとうございました。
これからもよろしくお願いいたします<(_ _)>
[ 2009/09/30 22:56 ] [ 編集 ]
[ 6311 ] > Chocoさん
お望み通りになって良かったです^^
[ 2009/09/30 23:12 ] [ 編集 ]
[ 7214 ]
お世話になります。
standard_monotoneをベースにカスタマイズを
楽しませていただいております。

ヘッダーについて質問なのですが、
ブログタイトルとサブタイトルは最初の状態では
左寄せの上下中央に表示されますよね?
これをヘッダーの高さを変更した上で
左寄せ&上寄せにしたいのですが、
どのようにすれば良いのか教えていただけないでしょうか。
上部の余白が消せなくて困っています。

当方のブログURL
http://woodbook0523.blog15.fc2.com/

現状#header内に 
text-align: top;
height: 300px;
の2行を追加しております。

宜しくお願いいたします。
[ 2009/11/29 07:22 ] [ 編集 ]
[ 7222 ] > WoodBookさん
スタイルシートにこの設定も加えてみてください。

#header {
vertical-align: top;
}
[ 2009/11/29 22:58 ] [ 編集 ]
[ 7225 ] ありがとうございました
早速ご回答いただきありがとうございました!
無事解決しました。
感謝です!!
[ 2009/11/29 23:44 ] [ 編集 ]
[ 7234 ] > WoodBookさん
解決して良かったです^^
[ 2009/11/30 22:38 ] [ 編集 ]
[ 8613 ] 承認待ちコメント
このコメントは管理者の承認待ちです
[ 2010/03/11 16:22 ] [ 編集 ]
[ 8656 ]
はじめまして!

1つ質問なんですけど、
ブログタイトルや紹介文を
消す事ゎできますか??

もしできたら教えて下さい(><)

できなかったら、タイトルのサイズを
小さくする方法でも大丈夫です!
[ 2010/04/10 10:26 ] [ 編集 ]
[ 9038 ] 質問です。
超初心者です!FC2ブログについて。「lotus」というテンプレートを使用しているのですが、左寄りになってしまいます。
真ん中に移動したいのですが、どこをどう直したらいいのかわからないので教えてくだい。

URLは
http://rosensteindiary.blog.fc2.com/
です。

よろしくお願い致します。
[ 2012/03/01 13:41 ] [ 編集 ]
[ 9041 ] > コハクさん
これはFC2の公式テンプレートのようですね。私が作成したテンプレートでないものは詳しくないのでちょっとわかりません。

ソースをのぞいて見たのですが、それぞれのパーツごとをpositionで絶対配置するという複雑な構造だったのですぐにはわかりませんでした。

申しわけありませんがFC2ユーザーフォーラムに聞いてみてください。
http://blog.fc2.com/forum_community/
[ 2012/03/02 00:51 ] [ 編集 ]
コメントの投稿









管理者にだけ表示
※現在カスタマイズに関するサポートを休止中です。
表示が崩れる場合は表示が崩れる原因の調査手順をお試しください。
その他の問題はFC2ユーザーフォーラムにお問い合わせください。
トラックバック
この記事のトラックバックURL

ブログ内検索1
プロフィール

いたお

Author:いたお
更新は非常にマイペースです
現在休止中です

当サイトはリンクフリーです。

いたおの他の運営サイト
カレンダー
08 | 2023/09 | 10
- - - - - 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
なんでもスクロール
このように
縦に長く伸びた
プラグインを
スクロールバーによって
一定の長さに
抑えることが
出来ます。

※スクロールさせる文字やプラグインのHTMLをここに
今日の日付入りカレンダー

08 | 2023/09 | 10
- - - - - 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
ユーザータグ


△ ページトップへ戻る