新着記事に「New」をつける

今回はブログの記事タイトルの横に新着マーク(「New!」など)を表示させる方法です。

新着記事のタイトルの横に「New」マークがついているブログありますよね(#^.^#)
↓ こんなふうに…。
(それぞれの画像をクリックしてください。サンプル表示されます。左は「new!」を文字だけで表示、右は画像で表示してあります。)
new!_moji    NEW_gazou
これは「テンプレートの設定」画面で「HTML編集」を触ると簡単にできます。

<head>~</head>の間に以下(どちらか)を貼り付けます。
(よくわからない場合は</head>の直前に貼り付ければよいと思います。)

赤の太字の数字「24」は、このマークを表示させる時間です。
この場合は24時間表示されるという意味です。
12時間表示の場合はこの「24」の数字を「12」に変更します。
【文字で表示させる場合】

<script type="text/javascript"><!--
function nw(u1,u2,u3,u4) {
var today=new Date();
var nt=24; var c=new Date(u1,u2-1,u3,u4);
if (today-c<3600000*nt) {
document.write('<font color="#ff0000" size="x-small;">new!</font>')}
}
--></script>
この例では「ff0000」の部分が文字色、「x-small」は文字の大きさ、「new!」が表示させる文字ですので、お好みでこの部分を変更してください。

【画像で表示させる場合】

<script type="text/javascript"><!--
function nw(u1,u2,u3,u4) {
var today=new Date();
var nt=24; var c=new Date(u1,u2-1,u3,u4);
if (today-c<3600000*nt) {
document.write('<img src="http://blog-imgs-32.fc2.com/x/x/x/xxxxooo/12345.gif" border="0">')}
}
--></script>
こちらは、青字の部分が表示させる画像をアップロードしたURLになります。

次に下記を新着マークを表示させたい場所に貼り付けます。
<a id="<%topentry_no>" name="<%topentry_no>"><script type="text/javascript">
nw(<%topentry_year>,<%topentry_month>,<%topentry_day>,<%topentry_hour>)
</script>
HTML編集の中からタイトル部分を探し出します。

09071003.gif
私の今使っているテンプレートだと赤く囲んだ部分の直前に↑を挿入するとタイトルの前に表示され、青く囲んだ部分の直後に↑を挿入するとタイトルのあとに表示されます。

09071004.gif
テンプレート作者さんの違うテンプレートもほぼ同じで、このテンプレートの場合でもこの赤や青色で囲んだ部分の直前、直後に挿入すると表示されます。


関連記事

コメントの投稿

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

鍵コメ2009/07/11(Sat) 00:18様

うまくできてよかったです♪
もう一つの方は後日記事にしますね(#^.^#)

鍵コメ2009/07/11(Sat) 10:46様

こんにちは。
そちらのブログに秘密コメントでコメント入れましたのでご覧くださいね。
もしまだ不明の点があればご連絡ください。

済みません

こんにちは

れんさん出来ましたよ!有り難うございます
・・・・ただ私のお願いのテーマとは違っていました、私が教えて頂きたかったのは、
例えばれんさんのブログ画面の左側にプラグイン有りますよね、
そこに『お気に入り」のにリンクされたブログ名が並んでいますね、その中に上から6番目に「いきまっしょ~い!」と言うブログ名の右にUPのマークがでていますね、これが表示されれば記事の更新が分かりますので便利だと思いお願いした次第です・・・私の説明不足で済みませんでした・・・UPの表示の仕方をお願いします

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

ニュータイガー8様

今日その記事を書いてみました。
外部サービスに登録しなければ、この機能が使えませんが、よろしければ参考にしてみてくださいm(__)m
**コメントを投稿**

コメントの投稿

Private :

トラックバック


この記事にトラックバックする(FC2ブログユーザー)

プロフィール

れん

管理人:れん
写真は下手の横好き。
そのせいか、画像編集ソフトで写真を弄ぶのも大好き♪
思いついたことを気の向くままに書いています。
カレンダー
11 | 2016/12 | 01
- - - - 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
最新の記事
最近のコメント
カテゴリ
月別アーカイブ
12  11  10  09  08  07  06  05  04  03  02  01  12  11  10  09  08  07  06  05  04  03  02  01  12  11  10  09  08  07  06  05  04  03  02  01  12  11  10  09  08  07  06  05  04  03  02  01  12  11  10  09  08  07  06  05  04  03  02  01  12  11  10  09  08  07  06  05  04  03  02  01  12  11  10  09  08  07  06  05  04  03  02  01  12  11  10  09  08  07  06  05  04  03  02  01  12  11  10  09  08  07  06  05  04  03  02  01  12  11  10  09  08  07  06  05 
お気に入り
リンクしてね♪
トラックバック
記事について
フリーソフト・WEBアプリなどの紹介記事は紹介した時点のものです。
バージョンアップ、その他で使用方法などが変更されている場合があります。
また,紹介時点ではフリーだったものが有料になっているものもあります。
記事には日付が表示されていますのでご確認ください。
あまり古い記事は参考にならない場合も多いと思います……(T_T)
ブログ管理MENU
いらっしゃいませ~
検索フォーム
メールはこちら
こちらのメールフォームもご利用ください。
アイコンをクリックするとメールフォームが開きます。
返信の必要な場合には必ずメールアドレスをご記入下さい。
メールはこちら
月間アクセスの多い記事 
ブログパーツ
月間リンク元ランキング
スポンサードリンク
おすすめ
・楽天市場
・eBOOKOFF
・FUJICOLORプリントおとどけ便
・インターネットで「デジカメプリント」
・ジャパネットたかた
・住信SBIネット銀行
・楽天銀行
・OLYMPAS ONLINE SHOP
・Yahoo!ショッピング
・上海問屋


楽天トラベル株式会社

デル株式会社

エプソンダイレクト株式会社

ホームセンターのコメリドットコム

プレミアム バンダイ

太る原因
FLAG COUNTER
Free counters!
このページのトップへ