SLUG'S UPPER title


FC2 共有テンプレート「SUP03」

SUP03(2カラム2色)03_1/03_2

sup03_1.jpg

sup03_2.jpg


  • 写真やグラフィック等大きめの画像を扱うブログ向けです。幅720pxまでの画像が収まります。
  • プラグイン3をフロントページのみ記事上部に表示します。全ページに表示させたい場合は追記よりカスタマイズの詳細をご覧ください。
  • プラグイン1,2は背景色により色分けされます。色味を統一したい場合はどちらか一方をご使用ください。


テンプレご利用案内的なもの


サーバ番号の無いブログアドレス(http://hogehoge.blog.fc2.com)の「Comment:件数」表示のバグ回避


公開後しばらくはソースの修正を頻繁に行います。お手数をおかけしますがこまめに最終更新日をご確認頂き、最新状態でのダウンロードをお願いします<(_ _)> 不具合などお気付きの点がございましたらコメ欄にてご指摘くださると幸いです。

UPDATE...

2015-09-03 HTML・CSS改正
TOP・BOTTOMをスムーススクロールに
全テンプレート共通修正箇所
2012-06-24 HTML・CSS改正
右下に固定ページナビゲーションを追加
配色微調整他ソース改善
2012-01-21 HTML・CSS改正
コメント欄等全体的にマイナーチェンジ
カレンダー装備
FC2既定の拍手ボタンとソーシャルボタンを横並びに
CSSの重複記述等ミス修正他ソース改善
2011-06-09 HTML修正
プラグイン設定での行揃え機能が無効になっていたのを修正
記事のカテゴリー表示に親カテゴリーを追加
2011-06-04 HTML訂正
Archiveのtitleミスを訂正(再DL or 書き換えをお願いします)
2011-05-24 HTML・CSS改正
タイトルが長文の場合に日付の下へ回りこんでしまうのを修正。
白ver.で前後エントリーへのリンクのクォートマーク画像が白になっていたのを黒に訂正。
背景色の変更・背景画像挿入に対応するよう日付のオーナメントをpng画像に変更。
ローカルバナーに対応するよう右サイドの内包幅を200pxに拡張。
月間アーカイブのデフォルト表示を排除。
その他フォント変更等の微調整。
2011-04-17 HTML訂正
コメントフォームのレーベル指定ミスを修正

カスタマイズ

※カスタマイズは自力で。質問にはお答えいたしませんのでご了承ください。


ヘッダに画像を置かない

CSS編集で以下の赤字部分を削除します。
#body_header{ ・ ・ background: url("http://blog-imgs-37.fc2.com/s/l/u/slugsupper/sup03_header_sample1.gif") no-repeat 50% 50%; border: 1px solid #333; border-top: none; }
旧Ver.は以下のプロパティになります。
/*========== Blog Header ==========*/ #body_header{ ・ ・ background: url("http://blog-imgs-37.fc2.com/s/l/u/slugsupper/sup03_header_sample1.gif") no-repeat; ・ ・ }


ヘッダを単色カラーにする

CSS編集で上記の赤字部分を以下のように書き換えます。例では黒色で塗りつぶされます。
/*========== Blog Header ==========*/ #body_header{ ・ ・ background-color: #000000; ・ ・ }


ヘッダの画像を差し替える

幅960pxの画像を用意し、ブログにアップロードします。 CSS編集で以下の赤字部分をアップロードした画像のURLに書き換えます。
/*========== Blog Header ==========*/ #body_header{ ・ height: 200px; ←ヘッダ高さ 変更可 background: url("http://blog-imgs-37.fc2.com/s/l/u/slugsupper/sup03_header_sample1.gif") no-repeat; ・ ・ }
画像の高さは任意です。画像の高さに合わせて青字部分を書き換えて下さい。デフォルトでは200pxになっています。画像が用意できるまでサンプル(BLACK / WHITE)をご使用いただいても構いません。


タイトル文字の色を変更する

ヘッダ画像に合わせてタイトルを見やすい色に変更して下さい。 CSS編集で以下の赤字部分を任意の色に書き換えます。例では黄色のタイトルになります。
#body_header a{ ・ ・ color: #ffff00; ・ ・ }
旧Ver.は以下のセレクタになります。
#body_header a:link,#body_header a:visited{ color: #ffff00; text-decoration: none; }


タイトル文字を非表示にする

CSS編集で以下のセレクタに「visibility: hidden;」を追加します。
.blog_title{ ・ ・ ・ visibility: hidden; }


説明文の色を変更する

ヘッダ画像に合わせて説明文を見やすい色に変更して下さい。 CSS編集で以下の赤字部分を任意の色に書き換えます。例では黄色のタイトルになります
.blog_description{ ・ color: #ffff00; ・ }
16進数カラーコードの生成はサイドバーのカラーピッカーをご利用下さい。WEBセーフカラーはVeign Color Reference Guide [PDF]等参照のこと


説明文を非表示にする

CSS編集で以下のセレクタに「visibility: hidden;」を追加します。
.blog_description{ ・ ・ visibility: hidden; }


プラグイン3をフロントページ以外にも表示させる

こちらをご覧ください


デフォルトのカレンダーがいらない

HTML編集で以下の範囲を削除します。
<!--========== FIXED CALENDAR START (delete if unnecessary) //==========--> ・ ・ ・ <!--==========// FIXED CALENDAR END ==========-->
FIXED CALENDAR STARTと書かれた行からFIXED CALENDAR ENDまでを全て削除。
関連記事
Tweet Hatena

Newer EntryFC2 共有テンプレート「SUP04」

Older EntryFC2 共有テンプレート「SUP02」

Comments
No title 
こんにちは。
そのテンプレを使わせていただいています。
ちょっとお聞きしたいのですが
・タイトルの文字体の変更のやり方
・タイトルの文字のリンク設定の解除
・右上の「Archive RSS Login」の部分の消し方
・検索窓「Search entries」の消し方
もしよろしければ上記について教えていただけないでしょうか?
よろしくお願いします。
Re: No title 
カスタムは許可してるだけで推奨はしてませんので説明のない部分は自力でお願いします。
文字化けでお困りかもしれないので以下だけお答えします(^^

> ・タイトルの文字体の変更のやり方
CSS編集で#body_headerのアンカー要素にフォント指定
No title 
ありがとうございました!
Re: No title 
あ .blog_titleに指定でよかった(^^; すんません
頑張ってください
管理人のみ閲覧できます 
このコメントは管理人のみ閲覧できます
Re: お願いいたします。 
おかしくなったテンプレートを一旦削除してもう一度DLしてください。DLは何回でもできますよ(^^
ぜんしゅうてきこころのこれから 
はじめまして何も分からないままの見切り発車で
ブログを始めちゃいましたが、初めに選んだテンプレートが見にくく
お宅様のが良かったので勝手に使わせていただきましたので
宜しくお願い致します。
Re: ぜんしゅうてきこころのこれから 
これはご丁寧にありがとうございます(^^
ところでこんな得体の知れないブログにプロバイダメールは打ち込まれない方が‥ うちは開示しない設定ですが公開されるブログもあります。捨てメアドとしてご用意されてるなら差し出口を叩いてすみません(^^;)ゞ
 
お世話になっております。
また、教えてください(^^)
コメント欄に、Email AddressとWebsite URLが
でないようにしたいと思います。

どのようにするといいですか?
 
テンプレート使わせてもらってます。
ヘッダー変えたり色々カスタムさせて貰ってるんですが、コメントカラーの変え方がわからないんです……グレーから白に変えたいんですが何処いじればいいですかね?
  • テンプレート配布記事では使用に関してのコメントを優先しますのでご質問・ご報告以外はスルーする傾向にあります。
  • テンプレートへの感想は共有DLページや拍手、ツイッターでいただければ有り難いです<(_ _)>
  • 各テンプレート記事に明記しておりますが カスタマイズについての質問はお受けしておりません のでご留意ください。
Follow
Hex Color Code
Add Spice
Audinst DAC付ヘッドホンアンプ HUD-mx1 【正規輸入品】ワコム Intuos Comic マンガ・イラスト制作用モデル Mサイズ 【新型番】2015年1月モデル CTH-680/S3Logitec HDDスタンド USB3.0接続 4TB対応 ガチャベイ HDDコピー機能付き LHR-2BDPU3 [フラストレーションフリーパッケージ (FFP)]FILCO Majestouch TenKeyPad USBテンキーパッド独CherryMX茶軸スイッチ ブラック FKB22MBTranscend SSD 1TB 2.5インチ SATA3 6Gb/s MLC採用 3年保証 TS1TSSD370S【日本正規代理店品】 Jabra ジャブラ Bluetooth4.0 モノラルヘッドセット 日本語音声ガイダンス対応 Jabra MINI ブラック MINI-U-BKZ-LIGHT LEDデスクライト Z-108LED B ブラック E26LED電球 昼白色Bauhutte (バウヒュッテ) ノートパソコン タブレット用 膝上パソコンデスク BLT-72 PC スマート ボード [ベッドでもソファでも、自由にパソコンを使える ラップトップデスク テーブル]BESTEK AC 充電器 USB コンセント 2in1 急速充電 アダプター 30W 最大6A USB 4ポート バッテリー チャージャー BTCPS017 (黒)【国内正規品】harman/kardon AURA ワイヤレススピーカー Bluetooth対応 ブラック HKAURAAPBLKJN

ESET ファミリー セキュリティ 3年版(最新版)

Hot Item