忍者ブログ

Customize in Ninja Blog

NINJAブログを使いこなそうと始めたブログ。

2017.05│ 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

[PR]

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

コメントや最新記事にNew&Upマークをつける

最新記事リストやコメントにNew&Upマークをつけてみました。

最新記事は3日以内ならUp画像が表示され、コメントとトラックバックはNEW画像が表示されてます。

これをテンプレートのHTMLにつけることも可能ですが、とりあえずプラグインで使う方法を説明しておきます。

参考サイト:一定期間だけNEWの文字を表示する―javascript例文辞典

まずjavascriptを設置します。設置する場所はNewマークを表示させたいプラグインのHTMLのところで大丈夫です。
もしテンプレートHTMLのほうに設置するなら、このスクリプトは<body>~</body>の間ならたぶんどこでも大丈夫なハズのスクリプトなのでどこでもいいと思います。(自信ないですが・・・)
気になるなら、分かりやすくしておくためにも<body>のすぐあとぐらいが適当なのでは?と思います。
コメントと最新記事両方にマークをつけたいというときでもスクリプトはひとつでいいので、どちらかにスクリプトを入れておいてください。
個人的にはプラグインHTMLにスクリプトを設置しておくコトをオススメします。
テンプレートを変更してもソースを移す必要がないので楽ですよ~
<script type="text/JavaScript">
function newupMark(u1, u2, u3, u4) {
delDay = 3;
oldDay = new Date(u1 + "/" + u2 + "/" +u3);
newDay = new Date();
u3 =(newDay - oldDay) / (1000 * 24 * 60 * 60);
if(u3 <= delDay) {
if(u4 == "new") document.write("<img src='New画像のURL' border='0'>");
if(u4 == "up") document.write("<img src='Up画像のURL' border='0'>");
}
}
</script>

dlDay = 3; の数字が何日間マークを表示させるかを指定しています。ここでは3日になってます。
この色で指定したところに画像を入れるようになってますが変わりに「New!!」のように文字を入れることもできます。

これをどこか一箇所に入れたら、今度は実際にNew&Upマークを入れたいところにもスクリプトを入れます。
ここでは、最新記事のところにUpマークをつけたのを例とします。

<!--plugin_entry-->
<div class="plugin_data">
<a href="<!--$plugin_entry_link-->">
<!--$plugin_entry_title-->
<script>
newupMark(<!--$plugin_entry_year-->,<!--$plugin_entry_mon-->,<!--$plugin_entry_day-->,"up")
</script>

</a>
</div>
<div class="plugin_data_date">
(<!--$plugin_entry_mon-->/<!--$plugin_entry_day-->)
</div>
<!--/plugin_entry-->


青く表示したものがUpマークを表示するところです。
基本構造は
<script>
newupMark(年,月,日,"up")
</script>
となってます。「年」のところにはそれを表示する忍者ブログの変数が入り、「月」、「日」も同様です。
最後の「"up"」の部分はここにはUPマークを表示させるという意味になります。ここを「"new"」にするとNewマークが表示されることになります。

ってぐあいでマークを表示したいところにスクリプトを設置するのですが、よくわからないって方は、一応それぞれのスクリプトを用意しておきましたのでコピーして使ってみてください。

注:ソースをコピーするとき文字化けに注意してください。時々化けます。

・プラグインの最新記事でNewマークを表示する
<script>
newupMark(<!--$plugin_entry_year-->,<!--$plugin_entry_mon-->,<!--$plugin_entry_day-->,"new")
</script>

・プラグインの最新記事でUpマークを表示する
<script>
newupMark(<!--$plugin_entry_year-->,<!--$plugin_entry_mon-->,<!--$plugin_entry_day-->,"up")
</script>

・プラグインの最新コメントでNewマークを表示する
<script>
newupMark(<!--$plugin_comment_year-->,<!--$plugin_comment_mon-->,<!--$plugin_comment_day-->,"new")
</script>

・プラグインの最新コメントでUpマークを表示する
<script>
newupMark(<!--$plugin_comment_year-->,<!--$plugin_comment_mon-->,<!--$plugin_comment_day-->,"up")
</script>

・プラグインの最新トラックバックでNewマークを表示する
<script>
newupMark(<!--$plugin_trackback_year-->,<!--$plugin_trackback_mon-->,<!--$plugin_trackback_day-->,"new")
</script>

・プラグインの最新トラックバックでUpマークを表示する
<script>
newupMark(<!--$plugin_trackback_year-->,<!--$plugin_trackback_mon-->,<!--$plugin_trackback_day-->,"up")
</script>


テンプレートでは独自タグを表示する部分にあわせて変えて使ってください。
一応自分のブログでは確認はしましたが、Winのみの確認です。
何か変だなぁと思った方、できれば教えて下さい<(_ _)>
PR
*COMMENT-コメント-
▽無題
ありがとうございます!助かりました!
もしよければ、この記事を中国語に通訳してみんなに教えたいんです。
▽これで一目でわかるnew
昨日はカレンダー曜日表示についてお知らせをありがとうございました。
このニューとアップ、早速やってみました!!
プラグインのほうに入れても何故か出てきませんでしたので、HTMLの<body>のすぐあとに入れてみたら、表示できました♪

注:このコメントはキャッシュをもとに再現したものです。
本来の日時は、「2006-05-02-Tue 18:15:48」です。
△Re:これで一目でわかるnew
こんばんわ~
カレンダーのほうはどうもすいません。

>このニューとアップ、早速やってみました!!
アイコン、かわいくて分かりやすいの入れてありますね~

>プラグインのほうに入れても何故か出てきませんでしたので、HTMLののすぐあとに入れてみたら、表示できました♪

プラグインのほうに入れると私のブログでもどうも調子が悪いのです。
kisatoさんのトコでもそうなりますか・・・

のすぐあとなら、大抵は大丈夫ですね。
でも、テンプレを変えると表示できなくなるとゆー落とし穴が。。。
テンプレ、もし変える事があれば、スクリプトも移動してやってください<(_ _)>

このレスは再現したものです。
本来の日時は「2006-05-02-Tue 20:30」となります。
*COMMENT FORM-コメント投稿-
  • この記事へのコメント投稿フォームです。
 
Name:
Title:
Mail:
Url:
Color:
Decoration: Vodafone絵文字 i-mode絵文字 Ezweb絵文字
Message:
Pass: ※編集時に必要です。
Secret:  ※チェックすると管理者へのみの表示となります。
*TRACKBACK-トラックバック-
  • この記事のURLとトラックバックURLです。
  • 必要に応じてご使用くださいませ。
この記事のURL▼
この記事のトラックバックURL▼
■Search
■About

●このブログについて
忍者ブログを使いこなそうと始めたカスタマイズサイト。分からないことばかりで四苦八苦しています。 変なところあったらぜひ言ってくださいませ(*- -)(*_ _)ペコリ
なお、このブログで実験もしています。 常に実験しているので、崩れとかありましたら教えてくださるとうれしいです。⇒BBS

●姉妹サイト・その他
 徒然倶楽部 →こちらは記事の内容を下に移転&閉鎖しました。
 現在は十六夜's Blogがメインブログになってます。
 Alphaの小部屋・・・BOOKLOGで作った本棚
 Mixi・・・参加中のSNS
 十六夜-the sixteeth night-・・・現在作成中のメインHP

●リンクについて
このブログはリンクフリーです。こんなブログでよろしければぜひリンクしてやってください♪
リンクバナー

●RSS
このブログのRSSはこちら▼
RSS 0.91
RSS 1.0
RSS 2.0

●環境推奨
動作状況:Windows XP SP2
ブラウザ:主にFirefox 他IE、Opera等
解像度:1024*768

●FireFox
私が普段利用しているブラウザ。 拡張機能のWeb Developerをいれるとテンプレ作成にとても便利なブラウザになります。自分の使いたい機能をいろいろインストールしてアレンジしてます♪
ダウンロードは▼からどうぞ

●Pingoo!
忍者ブログのPing送信先は10件まで。 それでもいろいろなところにPingを送りたいという場合にオススメなPing一括送信サイトです。ここ1件に送るだけでいろいろなところに送ってもらえます♪

●クリックで救える命がある

■Calendar
04

06
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
■CM&TB
●コメント

●トラックバック
Scrollbar ONorOFF
■Thanks
テンプレートを作成するに当たってよく利用させていただいているサイト様です。
■QRcode
QRコードをクリックするとメールフォームが開きます。
メールフォームでPCから携帯にこのブログのURLを送ることができます

もし、携帯電話で表示されきれない~とご不満の方はこちらのアプリを導入してみることをお勧めします。

無料体験できるのでぜひお試しください♪
■Template
○公開したテンプレのプレビュー

ブルーチャイナ
詳細
ブルーチャイナ
詳細
Gray2block
詳細
China
詳細
Gray
詳細
JapanBlue
詳細
碧
詳細
蒼
詳細
○公開された携帯用テンプレのプレビュー

The Leaf
詳細
○忍者ブログで共有化中のテンプレ

Alternation-緑×白-
記事番号で背景色が交互に変わるちょっとおもしろテンプレ。
パンくずナビも付いてます♪

The Leaf
初の携帯用テンプレート。さわやかな感じに仕上げてみました
絵文字使用。トップページにカテゴリー表示アリ。

ブルーチャイナ
涼しげなチャイナ風左右メニューテンプレ。
China」の色違いのような感じですが、配置は違いますのでご注意ください。
※このテンプレのピンク版もあります。共有化していないので記事内よりお持ち帰りください。
ピンクチャイナ

Gray2block
ノート風テンプレ「Gray」の2カラム版です。
China
かわいい系の3カラムテンプレート。イメージはチャイナ風♪
同じ配置の青バージョンも作成しました。こちらは共有化してないので記事内よりお持ち帰りください。
China-BlueVer-

Gray
灰色のノート風罫線テンプレ。追記開閉式の3カラムです。

JapnBlue
サッカー日本代表ユニフォームなテンプレ。追記開閉式
※このテンプレには2カラムバージョンもあります。
JapanBlueの2カラム版

碧-midori-
淡いパステルグリーンのテンプレ。追記開閉式


画像使用なしの5ブロックテンプレ。

Scrollbar ONorOFF

○広告




■Recommend
ルナエンバシージャパン

ストレイシープがなんだかかわいくて好き(^-^*)

■Visiter