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

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

記事タイトルやプラグインタイトルを画像にする (lightframe)

当サイトが配布している共有テンプレート「lightframeシリーズ」において、記事タイトルやプラグインタイトルを画像にするカスタマイズを紹介します。

スタイルシートの末尾に以下を加えてください。

/* 記事タイトル */
.ently_title {
background-image: url("画像URL");
}

/* プラグイン1 */
.plugin1_title {
background-image: url("画像URL");
}

/* プラグイン2 */
.plugin2_title {
background-image: url("画像URL");
}

/* プラグイン3 */
.plugin3_title {
background-image: url("画像URL");
}



これでlightframeシリーズの記事タイトルやプラグインタイトルを画像にすることが出来ます。

関連記事
[ 7628 ] 記事タイトル自体をリンクする方法
はじめまして。
この素晴らしいテンプレートを使わさせていただいています。
早速ですが質問させて頂きます。
lightframeシリーズでは、記事タイトルの文字がリンクになっていますが、文字ではなく記事タイトル欄?記事タイトル画像?をリンクさせるにはどうすればいいでしょうか?
説明が下手で申し訳ないですが、ご教授お願いします。
[ 2010/01/01 21:26 ] [ 編集 ]
[ 7634 ] > なしさん
スタイルシートの末尾にこれを加えてみてください。

.ently_title a {
display:block;
width:100%;
}
[ 2010/01/01 23:12 ] [ 編集 ]
[ 7637 ] >>いたお様
大変素早いご回答ありがとうございました。
とても参考になりました!
[ 2010/01/01 23:27 ] [ 編集 ]
[ 7645 ] > なしさん
参考になって良かったです^^
[ 2010/01/02 22:51 ] [ 編集 ]
[ 7821 ]
記事タイトルの横に画像をつけるというのはできますか?

画像 記事タイトル
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄
としたいのですが><
[ 2010/01/10 22:40 ] [ 編集 ]
[ 7823 ] > まーくnさん
こちらの記事を参考にしてください。

記事タイトル前にアイコン画像を飾る
http://10plate.blog44.fc2.com/blog-entry-109.html
[ 2010/01/10 22:46 ] [ 編集 ]
[ 7824 ]
テンプレート気に入っております。
有難うございました。
[ 2010/01/10 22:47 ] [ 編集 ]
[ 7825 ]
何度もすいません。
私のブログはstandardでした><
アドバイスいただけたらうれしいです。
[ 2010/01/10 22:54 ] [ 編集 ]
[ 7826 ] > まーくnさん
記事の中にstandardの場合も載っていますよ。
[ 2010/01/10 23:05 ] [ 編集 ]
[ 8029 ]
記事タイトルの大きさは何×何pxでしたか?

自分で探して、見つからなかったので質問いたしました。

すみませんがよろしくおねがいします
[ 2010/01/25 15:35 ] [ 編集 ]
[ 8031 ]
>>ちぃー兄さん
このブログノテンプレートでは、デフォルトで11ptになっています。
[ 2010/01/25 18:21 ] [ 編集 ]
[ 8035 ] > ちぃー兄さん、tskillさん
> ちぃー兄さん
記事タイトル一杯に背景画像を設置したときの大きさを知りたいのでしょうか?記事タイトルのフォントサイズや記事幅をデフォルトのままなら縦30px 横525px ぐらいです。

> tskillさん
いつもありがとうございます^^
[ 2010/01/26 01:14 ] [ 編集 ]
[ 8047 ]
説明不足でしたが、そうです。

tskillさん、いたおさん回答ありがとうございます。
[ 2010/01/26 21:02 ] [ 編集 ]
[ 8055 ] > ちぃー兄さん
参考になって良かったです^^
[ 2010/01/27 00:17 ] [ 編集 ]
[ 8129 ]
記事のタイトルが太字になってるいんですが、細文字にするにはどうすればいいでしょうか?お願いします><
[ 2010/01/31 02:41 ] [ 編集 ]
[ 8139 ]
>>なおさん
.ently_title {
font-weight: normal;
}
を加えてみてください。また、太字になっているというわけではないので、
.ently_title {
font-size:14pt;
}
の値を変えることで解消されるかもしれません。
[ 2010/01/31 16:08 ] [ 編集 ]
[ 8165 ] > なおさん、tskillさん
> なおさん
tskillさんのおかげで解決できたようですね。良かったです^^

> tskillさん
いつもありがとうございます^^
[ 2010/02/01 22:49 ] [ 編集 ]
[ 8267 ]
記事タイトルなんですが、画像を順番に表示したいです。

▽参考画像▽

http://blog-imgs-34.fc2.com/l/o/v/lovecon845/midashi_bg.jpg
[ 2010/02/07 15:29 ] [ 編集 ]
[ 8268 ] ありがとうございます。
はじめまして。
テンプレート使用させてもらいました。
カスタマイズなども非常にわかりやすく助かります。m( )m
[ 2010/02/07 22:57 ] [ 編集 ]
[ 8272 ] > ROXASさん、デジタル爺さん
> ROXASさん
特定の記事だけタイトル画像を変えるなら可能ですが、順番に違う画像となると難しいです。お役に立てず申しわけありません。

> デジタル爺さん
お役に立てて良かったです^^
[ 2010/02/07 23:55 ] [ 編集 ]
[ 8456 ]
デフォルトの状態で、プラグインタイトルの大きさは何×何pxでしたでしょうか?

こんなことで質問してすみません。
[ 2010/02/18 14:40 ] [ 編集 ]
[ 8467 ]
>>つばじさん
縦18px,横217px だと思います
[ 2010/02/19 00:05 ] [ 編集 ]
[ 8485 ]
ありがとうございますm(・ω・m)

[ 2010/02/20 10:52 ] [ 編集 ]
[ 8557 ]
いつもお世話になっています。
この方法で変更してみたのですが、コメント、コメント投稿、トラックバック、カテゴリの変更はどうすれば出来るのでしょうか?
[ 2010/02/27 06:40 ] [ 編集 ]
[ 8559 ] ネドさん
スタイルシートの以下の部分です

/********************************************* ▼ コメント ▼ */
~略~
.comment_title {
/* background-color:#000000; */ /* 背景色 (タイトル) */
background-image: url("画像URL");

赤色部分を追加してください。背景色はコメントアウトしました。コメントとコメント投稿はこの場所で指定しています。

トラックバックは
~略~
/*************************************** ▼ トラックバック ▼ */

.trackback_block_title {
/* background-color:#000000; */ /*背景色 (ブロックタイトル)*/
background-image: url("画像URL");

最後のカテゴリの変更というのがどこを指しているのかがちょっと文面ではわかりません。コメントいただけますか?
[ 2010/02/27 14:49 ] [ 編集 ]
[ 8563 ]
カテゴリ・検索・月別ナビゲーションの事でした。
教えていただいたやり方で同じように変更してみたら出来ました!
いつもお世話になってしまい申し訳ありません。ありがとうございました。
[ 2010/02/27 16:03 ] [ 編集 ]
[ 8564 ] ネドさん
うまくいってよかったです(^O^)
[ 2010/02/27 16:13 ] [ 編集 ]
[ 8853 ] 承認待ちコメント
このコメントは管理者の承認待ちです
[ 2011/08/09 19:19 ] [ 編集 ]
コメントの投稿









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

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

いたお

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

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

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

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

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


△ ページトップへ戻る