分享一个显示访客ip归属地及电子时钟+日历的wordpress博客边栏小工具

2018年8月10日19:34:59评论2 182 人看过打印本文

给大家分享一个高大上的博客边栏小工具,主要功能:集成访客地区显示到访次数记录电子时钟当前年月日英文显示。先上效果图吧。

分享一个显示访客ip归属地及电子时钟+日历的wordpress博客边栏小工具

CSS代码

新建CSS文件并取名main.css代码如下:

#hitimer_box{margin:0 0 1px;border:3px #ccc double;padding:.8em .5em;}
#hitimer_from,#hitimer_count{font-size:1.2em;font-weight:bold;margin:0 3px;}
#hitimer_clock,#hitimer_clock .datimer{width:100%;margin:0;padding:0;}
#hitimer_clock{background:#ccc;}
#hitimer_clock .datimer{margin:0;border:none;color:#000;font-size:12px;font-family:verdana;border-collapse:collapse;}
#hitimer_clock .datimer td{line-height:150%;text-align:center;border:1px rgba(255,255,255,.2) solid;padding:9px 0;}
#hitimer_clock .datimer td b{font-size:14px;}
#hitimer_clock td.toptime{font-size:32px;padding:4px 0;}
#hitimer_clock .ampm{font-size:14px}

js代码

第二步,新建JS文件并取名main.js代码如下:

/*
For: 问候和电子钟[ZBLOG-PHP插件]
Author: 尔今
Author Email: erx@qq.com
Author URL: http://www.yiwuku.com/
*/

document.writeln('<div id="hitimer_box">欢迎<span id="hitimer_from">外星球</span>的朋友,这是您第<span id="hitimer_count">N</span>次到访本站。</div><div id="hitimer_clock"></div>');
//COUNT
var ht_caution = false;
function ht_setCookie(name, value, expires, path, domain, secure) {
    var curCookie = name + "=" + escape(value) + ((expires) ? "; expires=" + expires.toGMTString() : "") + ((path) ? "; path=" + path : "") + ((domain) ? "; domain=" + domain : "") + ((secure) ? "; secure" : "")
    if (!ht_caution || (name + "=" + escape(value)).length <= 4000) document.cookie = curCookie;
    else if (confirm("Cookie exceeds 4KB and will be cut!")) document.cookie = curCookie;
}
function ht_getCookie(name) {
    var prefix = name + "=";
    var cookieStartIndex = document.cookie.indexOf(prefix);
    if (cookieStartIndex == -1) return null;
    var cookieEndIndex = document.cookie.indexOf(";", cookieStartIndex + prefix.length);
    if (cookieEndIndex == -1) cookieEndIndex = document.cookie.length;
    return (document.cookie.substring(cookieStartIndex + prefix.length, cookieEndIndex));
}
function ht_fixDate(date) {
    var base = new Date(0);
    var skew = base.getTime();
    if (skew > 0) date.setTime(date.getTime() - skew);
}
(function(){
	var now = new Date();
	ht_fixDate(now);
	now.setTime(now.getTime() + 365 * 24 * 60 * 60 * 1000);
	var visits = ht_getCookie("ht_counter");
	if (!visits) visits = 1;
	else visits = parseInt(visits) + 1;
	ht_setCookie("ht_counter", visits, now, "/");
	document.getElementById("hitimer_count").innerText=visits;
    document.getElementById("hitimer_box").style.borderColor=htmcolor;
    document.getElementById("hitimer_clock").style.background=htmcolor;
})();
//TIME
function ht_time(){
    var today = new Date();
    var hrs = today.getHours();
    var min = today.getMinutes();
    var secs = today.getSeconds();
    var alsohrs = today.getHours();
    var dayNumber = today.getDate();
    var year = today.getFullYear();
    var ampm="", zero="0";
    var month = today.getMonth();
    var weekday = today.getDay();
    var wdn = ["SUN","MON","TUE","WED","THU","FRI","SAT"];
    var mn = ["JAN","FEB","MAR","APR","MAY","JUN","JUL","AUG","SEP","OCT","NOV","DEC"];
    if (min<10) min=zero+min;
    if (secs<10) secs=zero+secs;
    if (hrs>12) hrs=eval(hrs - 12);
    if (hrs>=0 && hrs<1) hrs=12;
    if (alsohrs>=12 && alsohrs<24){
        ampm="P.M.";
    }else{
        ampm="A.M.";
    }
    tmp='<table class="datimer"><tr><td class="toptime" colspan="4">';
    tmp+=hrs+'<span id="blinker">:</span>'+min;
    tmp+='<span class="ampm"> '+ampm+'</span>';
    tmp+='<tr><td>Month<br><b>'+mn[month]+'</b></td>';
    tmp+='<td>Date<br><b>'+dayNumber+'</b></td>';
    tmp+='<td>Day<br><b>'+wdn[weekday]+'</b></td>';
    tmp+='<td>Year<br><b>'+year+'</b></td></tr></table>';
    document.getElementById("hitimer_clock").innerHTML=tmp;
    clocktime=setTimeout("ht_time()","1000");
}
function ht_blink(){
    var obj = document.getElementById("blinker");
    if (obj.style.visibility == "visible"){
            obj.style.visibility="hidden";
    }else{
        obj.style.visibility="visible";
    }
    eachsecond=setTimeout("ht_blink()","500");
}
ht_time();
ht_blink();
//AREA
var htprot = location.protocol;
var ht_jsload={head:document.getElementsByTagName("body")[0]||document.documentElement,Myload:function(B,A){this.done=false;B.onload=B.onreadystatechange=function(){if(!this.done&&(!this.readyState||this.readyState==="loaded"||this.readyState==="complete")){this.done=true;A();B.onload=B.onreadystatechange=null;if(this.head&&B.parentNode){this.head.removeChild(B)}}}},getScript:function(A,C){var B=function(){};if(C!=undefined){B=C}var D=document.createElement("script");D.setAttribute("type","text/javascript");D.setAttribute("src",A);this.head.appendChild(D);this.Myload(D,B)}}
try {
    ht_jsload.getScript(htprot+'//ip.ws.126.net/ipquery', function () {
        var htcity = "", htprovince = "";
        if(typeof(lo) != "undefined"){
            htprovince = lo;
        }
        if(typeof(lc) != "undefined"){
            htcity = lc;
        }
        if(htcity==htprovince) htprovince="";
        document.getElementById("hitimer_from").innerText=htprovince+htcity;
    });
} catch (e) {}
//若无十足把握,切勿修改以上代码,容易出错,有疑问请联系

调用

第三步,将调用代码放在你希望显示的地方,可以CSS代码为你喜欢的样式。

<div>我是标题<script type="text/javascript">document.writeln(unescape("%3Cscript src=\"<?php bloginfo('template_directory'); ?>/main.js\" type=\"text/javascript\"%3E%3C/script%3E"));</script></div>

 

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:2   其中:访客  1   博主  1

    • avatar 天赋网  1楼
      2018年8月15日 18:16 回复TA

      博主怎么不搞一个,好看看效果怎么样