きまぐれAWA's Life

アクセスカウンタ

zoom RSS CSS(小技編) トラックバック領域をすっきり♪

<<   作成日時 : 2009/03/01 13:24   >>

ブログ気持玉 0 / トラックバック 0 / コメント 13

今回はトラックバック領域のカスタマイズです。
『自分のブログにトラックバック記事作成』のトコロですがこれって使いますか?


画像



ここの入力フォームから記事を書いたトラバは今まで受けたことはありません。
なので、全く不要だと判断してこの入力フォーム部分を表示しないようにしたいと思います。

なお、受けたトラックバックは表示されますのでご安心を(ん)






トラックバック領域をすっきり♪


以下の文字列を追加します。
追加する場所はどこでもOKです。
『トラックバック、コメント領域』にまとめておくと整理がしやすいでしょうか(ん)



/* トラックバック フォーム */
#trackback_form{
display:none;
}





『トラックバック用URL』〜『自分のブログにトラックバック記事作成』が全て非表示になります。

画像



-------------------------------------------------------------------------

【追記】 2009/09/08
『トラックバック用URL』を表示するデザイン指定のやり方についての記事をアップしました。
CSS(小技編) トラックバック領域をすっきり 【その2】

-------------------------------------------------------------------------






ちょっとひと工夫♪


トラックバックのタイトル部分もすっきり表示にしてみますね(にこ)


トラックバックとコメント領域はまとめてデザイン指定がしてありますので、
こちらを個々に指定できるようにします。

変更するポイントは『見出し』と『一覧ヘッダセル』です。 CSS 全体Map 
デフォルトはこのようになっています。

/* 見出し */
#blog #trackback h2,
#blog #comment h2{
}

/* 見出し補足(トラックバック・コメント件数など) */
.supple{
}

/* 一覧ヘッダセル */
#blog #trackback th,
#blog #comment th{
}



こちらをこのように変更します。

/* 見出し (トラバ) */
#blog #trackback h2{
}


/* 見出し (コメント) */
#blog #comment h2{
}


/* 見出し補足(トラックバック・コメント件数など) */
.supple{
}

/* 一覧ヘッダセル (トラバ) */
#blog #trackback th{
}


/* 一覧ヘッダセル (コメント) */
#blog #comment th{
}



後はトラックバックの見出し、一覧ヘッダセルに任意にデザインしてをすればOKです。


/* 見出し (トラバ) */
#blog #trackback h2{
background-image: none;
background-color: #FFFFFF;
border:none;
}


/* 見出し (コメント) */
#blog #comment h2{
}


/* 見出し補足(トラックバック・コメント件数など) */
.supple{
}

/* 一覧ヘッダセル (トラバ) */
#blog #trackback th{
background-color: #FFFFFF;
border-left: none;
border-right: none;
border-bottom:1px #0099FF solid;
}


/* 一覧ヘッダセル (コメント) */
#blog #comment th{
}



画像



こちらはデフォルトのテンプレートでの設定になります。
テンプレートによって指定の仕方が変わりますので注意してください。

基本的にデフォルトで指定してある画像や背景、罫線を消す指定をしてあります。
デザインはお好みで行ってくださいね(にこ)


デザイン指定で使用する文字列についてはこちらを参考にしてください。(ん)

CSS(活用編) スタイルシートで使用する文字列集





それでは、今回はこのくらいで(にこ)

|ω・)ノシ See you♪

|彡 サッ




■ ブログをいじっちゃおぅ♪ 〜 ブログのレシピ 〜 ■



テーマ

関連テーマ 一覧


月別リンク

ブログ気持玉

クリックして気持ちを伝えよう!
ログインしてクリックすれば、自分のブログへのリンクが付きます。
→ログインへ

トラックバック(0件)

タイトル (本文) ブログ名/日時

トラックバック用URL help


自分のブログにトラックバック記事作成(会員用) help

タイトル
本 文

コメント(13件)

内 容 ニックネーム/日時
しばらくぶりです。またお世話になります。
そうなんです。ここ、使わないですよね。
管理画面以外で記事を書くことなんて
まずないです。
とても参考になります。ありがとうございます。

ところで、これを使って削除してしまうと、
トラックバック用URLも削除されてしまいます。
ブログによってはTB用URLでないとTBが送れない仕様も
あるかもしれないので残しておきたいのですが、
なにか方法はありますか?
よろしくお願いしますm(_ _)m
NORI
URL
2009/09/07 10:36
NORIさん、いらっしゃいませ(にこ)
お久しぶりです(ぺこ)

この方法だとトラックバックURLが消えてしまうので、
何か良い方法はないかな〜なんて考えていたトコでした(気まずい)
なんとか思い通りっぽく出来たのでお試しください。

CSS編集にて、以下の文字列をどこでもいいので書き込みます。

----------------------- ここから ---------------------------

/* トラックバック フォームフィールド (非表示設定) */
/* フォームフィールド全体を非表示 */
#trackback_form{visibility: hidden; }

/* トラックバック用URLを表示 */
#trackback_form .tbkurl{visibility:visible;}

/* トラックバック記事作成セルを非表示 */
#trackback_form td{display:none;}

----------------------- ここまで ---------------------------

ただ、トラックバックURL部分からコメント領域まで少し余白が出来ちゃいますが、目を瞑ってください(はず))
mairis
2009/09/07 12:43
あ、出来上がった感じはコメント欄の上をみてくださいね(にこ)ノ
mairis
2009/09/07 12:45
早速やってみました。
おぉっ、イイ感じです!(拍手)
余白は全然気になりません。
これでコメントフォームの存在が
以前より分かりやすいので、
コメントの数が増えるといいなぁ(わぁ)
ありがとうございました。
NORI
URL
2009/09/08 02:02
>NORIさん

お疲れさまで〜す(にこ)ノ
うまく出来てホッとしてます(ん)
ちょうど途中まではCSS編集にかかってて行き詰まってたトコでした(笑)
NORIさんのおかげでやる気が出たので一気にできました(ひょえ))
ありがとうございま〜す(ぺこ)
mairis
2009/09/08 10:49
わ〜い(わら)
以前から ジャマだと思ってましたが、
消す事が出来ました(拍手)
ありがとう(@ぺこ)
URLは・・私には必要ないかな(うひょー)
ひろたん
2011/02/22 13:18
ひろたんさん、いらっしゃいませ(にこ)
お疲れ様でした(にこ)ノ
割と自分には必要ないかな〜ってものまでついてたりしますよね。
必要なものは残しつつシンプルなのが一番かと(ぐらさん)b
mairis
2011/02/23 10:08
以前 ブログを広げる でお世話になりまして有難うございました
今回はトラックバックを消すも解りやすい説明で消すことができました
有難うございました 
ここまでできたのですが
私にはトラックバック(0件)
タイトル(本文)ブログ名/日時も必要がなく
消したいのですが 何処かに消す方法も掲載されているのでしょうか?
お教え願いします
よしの
2012/07/04 14:15
よしのさん、いらっしゃいませ(ん)

トラックバック欄をごっそり見えなくするには以下の文字列を新規で書き込んでみてください。

#trackback{display:none;}


この文字列でごっそり見えなくなります。
ただ、トラックバックがついても相手方のブログの詳細等が見えなくなりますので指定する場合はご注意下さい。
mairis
2012/07/05 00:27
お蔭さまで 見えなくすることができました
有難うございました(ぺこ)
これからも教えて戴くことがあるかと思いますが
その節は宜しくお願いします(ぺこ)
よしの
2012/07/06 11:25
>> よしのさん
おつかれさまでしたっ(にこ)ノ

P.S.
絵文字の件ですがもうしばらくお待ちください(ぺこ)
サーバーが復活しないんです(気まずい))
mairis
2012/07/06 18:23
いつもお世話をおかけしてます
絵文字は 慌てていませんので お時間のとれたときでかまいません
無理を言ってすいませんでした(ぺこ)
よしの
2012/07/08 01:58
>> よしのさん
なかなか復活しないので別のサーバーに参考ページをアップロードしました(気まずい)
メッセージの方にアクセス方法を送付しましたのでご確認下さい(ん)
mairis
2012/07/08 12:14

コメントする help

ニックネーム
URL(任意)
本 文
  現在の閲覧者数:

* ぱにゃステ *

『ぱにゃステ』 customized by mairis
 
 
ふぉろーみー

CSS(小技編) トラックバック領域をすっきり♪ きまぐれAWA's Life/BIGLOBEウェブリブログ
文字サイズ:       閉じる