重磅推出PJBlog个性皮肤『千变万化』(博客背景切换功能)

William2009-05-07 01:20设计18,708次浏览36条评论

扫一扫手机看

完成新皮肤『千变万化』的制作，经过一段时间的调试，兼容了所有主流浏览器。

『千变万化』的各项功能在前面的文章中已经做了介绍了，这里就不多解释了。

这个修改是在2009.4.22 打了补丁的 PJBlog3.0 最终版 v3.0.6.170 上修改的，修改前强烈建议备份！

这套皮肤是在全静态下使用会有些错误，建议全静态用户不要使用，若想使用，换成半静态或者全动态！

好了，废话不多说，先看下效果，然后下面开始讲解安装过程！

PJBlog个性皮肤『千变万化』

百度网盘下载：提取码: c2rc

DownLoad

也可以在PJBlog论坛上面查看详情。地址：http://bbs.pjhome.net/thread-52722-1-1.html

方法一

一，下载文件，解压后打开【需上传的文件】，将 smooth.js 上传到 common 文件夹下；将images里面的图片放入博客根目录images文件夹下；将skins文件里面的5个文件上传到博客根目录下的skins 文件夹里面。

二，header.asp 里面：

1、加上这段代码：

<script type="text/javascript" src="common/smooth.js"></script>

加入的位置大家应该知道的，不知道的看看也就知道了。

2、在

background:#FF9F88 url(images/tips.gif) no-repeat 3px 4px;}

的后面加上


#MyStyleBox{
clear:both;
z-index:9999;
position:fixed;
_position:absolute;
left:0;top:0;
width:100%;
height:20px
}
#StyleBox{
margin:5px;
float:right;
list-style:none
}
#StyleBox li{
display:inline;
float:left;
padding-left:5px;
list-style:none}
#StyleBox span{
visibility:hidden;
height:10px;width:10px}
#StyleBox a{float:left;width:10px;
height:10px;border:1px solid #DDD;
background:#FFF;line-height:100px;
overflow:hidden}

3、在

<body onLoad="initJS()" onkeydown="PressKey()">

后面加入代码


<div id="MyStyleBox">
<ul id="StyleBox">
<li><a style="BACKGROUND: #204d90" href="#d2Vpc2F5XzI3">深海蓝</a></li>
<li><a style="BACKGROUND: #7e2090" href="#dnYx">罗兰紫</a></li>
<li><a style="BACKGROUND: #207b90" href="#dnYy">天空蓝</a></li>
<li><a style="BACKGROUND: #8f4321" href="#dnYz">玫瑰红</a></li>
<li><a style="BACKGROUND: #509020" href="#dnY0">祖母绿</a></li>
</ul>
</div>
<script type="text/javascript">
SetStyleBox();

三，footer.asp 里面。

在

<div id="foot">

后面加入代码


<a class="vtop" href="#" onfocus="this.blur();" onclick="goto_top(); return false">Top</a>

四，common文件夹下 common.js 的修改。

1、在

//转换AccessKey For IE

后面换行加入

vMenu()

2、在 common.js 的最后加上


getCookie_v=function(a){
var b=a+"=",c,d;
if(document.cookie.length>0)
{
c=document.cookie.indexOf(b);
if(c!=-1){
c+=b.length;
d=document.cookie.indexOf(";",c);
if(d==-1)
d=document.cookie.length;
return unescape(document.cookie.substring(c,d));
}else return('');
}else return('');
}

setCookie_v=function(a,b){
var c=new Date();
var d=new Date();
d.setTime(c.getTime()+1000*60*60*24*365);
document.cookie=a+"="+escape(b)+";path=/"+"; expires="+d.toGMTString();
}
function SetStyleBox(){
try{
var items = document.getElementById("StyleBox").getElementsByTagName("a");
var t = getCookie_v("SBox");
if(t=="") {
		ChangeStyle(items[0].href);
}else {
		ChangeStyle(t);
}
for(var j = 0; j < items.length; j++) {
		items[j].onclick = function(){
		setCookie_v("SBox", this.href);
		return ChangeStyle(this.href);
		}
		items[j].title = items[j].innerHTML;
}
}catch(e){}
}

function vChgMenu(obj) {
		var ar = new Array("#ffe1ba", "#f9ffba", "#c5ffba", "#fed6fb", "#c5fcfd");
		var v = document.getElementById("menu").getElementsByTagName("a");
		for(var i = 0; i < v.length; i++) {
				if(obj == v[i]){
						v[i].style.backgroundColor = ar[i];
						break;
				}
		}
}
function vMenu() {
		var v = document.getElementById("menu").getElementsByTagName("a");
		for(var i = 0; i < v.length; i++) {
				v[i].onmouseover = function() {
						vChgMenu(this);
				}
				v[i].onmouseout = function() {
						this.style.backgroundColor = "";
				}
		}
}
function ChangeStyle(s){
		var ss, str, ff = false, sp, le = 0;
		if(document.all){
				ss = document.styleSheets;
		} else {
				ff = true;
				ss = document.getElementsByTagName("link");
		}
		s = decode64(unescape(s.match(/[^\\\/#]+$/)));

		for(var i = 0; i < ss.length - 2; i++) {
				if(ff && ss[i].rel != "stylesheet")continue;
				str = "";
				le = ss[i].href.indexOf("skins");
				if(le < 0) continue;
				sp = ss[i].href.substr(le, ss[i].href.length).split("/");
				for(var j = 0; j < sp.length; j++){
						if(j == 1) {
								str += s;
						}else {
								str +=sp[j];
						}
						if(j!=sp.length - 1)
								str += "/";
				}
				ss[i].href = str;
		}
		return false;
}
var keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
  function decode64(input) {
	  var output = "";
	  var chr1, chr2, chr3 = "";
	  var enc1, enc2, enc3, enc4 = "";
	  var i = 0;
		 
		  if(input.length%4!=0)
		  {
					return "";
		  }
	  var base64test = /[^A-Za-z0-9\+\/\=]/g;
		  if (base64test.exec(input))
		  {
					return "";
		  }
	  do {
		 enc1 = keyStr.indexOf(input.charAt(i++));
		 enc2 = keyStr.indexOf(input.charAt(i++));
		 enc3 = keyStr.indexOf(input.charAt(i++));
		 enc4 = keyStr.indexOf(input.charAt(i++));
		 chr1 = (enc1 << 2) | (enc2 >> 4);
		 chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
		 chr3 = ((enc3 & 3) << 6) | enc4;
				 
				 output = output + String.fromCharCode(chr1);
		 if (enc3 != 64) {
						output+=String.fromCharCode(chr2);
		 }
		 if (enc4 != 64) {
						output+=String.fromCharCode(chr3);
		 }
		 chr1 = chr2 = chr3 = "";
		 enc1 = enc2 = enc3 = enc4 = "";
	  } while (i < input.length);
	  return output;
   }

五，找到comon下的library.asp文件，找到以下代码


Calendar = "<div id=""Calendar_Body""

在其后面加上

class=""month"&C_Month&"""

六，新建模块，模块标识：Topvv，模块名称：留空。排序为：0。如图：

新建模块

编辑HTML，写入下面代码


<ul>
<li><a onfocus="this.blur();" href="default.asp"><br/>网站首页</a></li>
<li><a onfocus="this.blur();" href="search.asp?searchType=Comments"><br/>最新评论</a></li>
<li><a onfocus="this.blur();" href="LoadMod.asp?plugins=GuestBookForPJBlog"><br/>最新留言</a></li>
<li><a onfocus="this.blur();" href="#Side_Search"><br/>内容搜索</a></li>
<li><a onfocus="this.blur();" href="tag.asp"><br/>标签云集</a></li>
<li><a onfocus="this.blur();" href="bloglink.asp">
博客链接</a></li>
<li><a onfocus="this.blur();" href="feed.asp" target="_blank" rel="noopener noreferrer">
博客订阅</a></li>
</ul>

七，最后是一些设置问题。

1、最好将默认的搜索的首页独享去掉，这个改不改影响不大。

2、日志分类管理 - 设置日志分类，选5个分类，让其位置设置为“同时”，其余为“侧边”。

3、可能有些朋友没有这么多的分类，我已经提供了顶部图片的PSD文件，你可以修改横行菜单的大小，以保证顶部的美观性。

方法二

如果上述修改的文件你没有修改过，在解压的文件夹里面打开　【已经修改过的文件】，将其直接对应上传覆盖就可以了。当然了，文件夹内该上传的文件还是要上传的。

说明：

制皮辛苦，尤其这个皮肤更是幸苦，请尊重别人劳动。

重磅推出PJBlog个性皮肤『千变万化』(博客背景切换功能)：目前有 36 条评论

33楼
小飞：

最多只能5样吗? 我想自己再添加风格~!如果能代码怎么改~! 本人不才,谢谢博主指教~!
[html]
<a href="#d2Vpc2F5XzI3" rel="nofollow">深海蓝</a>
<a href="#dnYx" rel="nofollow">罗兰紫</a>
<a href="#dnYy" rel="nofollow">天空蓝</a>
<a href="#dnYz" rel="nofollow">玫瑰红</a>
<a href="#dnY0" rel="nofollow">祖母绿</a>[/html]

2010-09-24 14:54 回复
- William博主：
  
  @小飞好像你已经看懂了，呵呵，那我就不说了~
  
  2010-09-24 17:58 回复
  - 小飞：
    
    @William呵呵!谢谢你的回答!那些是看懂了~!不过这个’ smooth.js ‘文件的作用是做什么的呢~!?
    
    2010-09-26 03:24 回复
    - William博主：
      
      @小飞那个是返回顶部的一个JS，点击主题上面的top可以滑动到顶部。
      
      2010-09-26 07:28 回复
32楼
peter：

六，新建模块，模块标识：Topvv，模块名称：留空。如图
编辑HTML，写入下面代码
程序代码
(由于代码被系统禁止了,,所以贴不出来,我想博主应该知道我说的是哪段把!)
我把所有皮肤的侧边栏都移到了左边
在SKIN中设置，打开layout.css，把sidebar的float:left改为right，mainContent的float:right改为left就OK了
可是我想这段代码的模块还是留在右边,,请问我要怎么改呢??

William 于 2010-08-25 09:52 AM 回复

你想把侧边栏搬到左边，对于这套主题要修改的就不仅仅是把sidebar的float:left改为right，mainContent的float:right改为left就行的。好多地方都要做一些微调的，建议不要弄了，当然如果你喜欢折腾主题的话，你可以自己试着改改，希望你能成功~

2010-08-24 23:15 回复
31楼
peter：

现在的 PJblog 3.28版本还能用吗? 我按照说明安装,,好像是有点问题。
求助…

William 于 2010-08-23 08:57 AM 回复

能用的啊，出现了什么问题?

2010-08-23 00:45 回复
30楼
无望森林：

博主,我发现你这套皮肤有点问题了,希望修复一下
我曾使用过,但可能很多人都没发现.使用这套皮肤后
你们可以登陆后台表情与关键字 – 关键字管理这里的关键字无法在日志中显示链接了.不知道大家有没注意到这一点.同时,如果使用这套皮肤后,如果有对tag修改代码的将会出现一个很大的BUG了.希望博主解决一下这种情况..

William 于 2009-07-15 12:41 AM 回复

测试过了，很正常，没有你说的问题！关键字都有链接，如果你的没有，那就不是这套皮肤的问题了，可能是你自己修改了什么造成滴~
这套皮肤的修改基本都是关于匹配CSS的，根本就不用修改到关键字及 tag 。再不行，你换套皮肤试试，应该还是这样~

2009-07-15 11:40 回复
29楼
毒药：

多谢William的解答啊~呵呵.现在还有一个问题就是如果某个日志设了置顶.那么新发表的日志就没法在首页显示出来.后台重新生成数据后能正常一阵子.隔些时候再上又没了.

William 于 2009-07-09 02:05 PM 回复

可能是修改什么导致的吧，应该不会出现这样的情况。。。

2009-07-07 13:31 回复
28楼
毒药：

William你好,我想请教一下您老人家几个问题,这个皮肤怎么才可以默认为绿色背景?再就是在哪里可以设置所有字体默认为14PX?,因为12PX我觉得细了点.我在大学的年代时也玩过ASP.现在老了,研究代码的精力也没有了.不吝赐教.

2009-07-03 18:49 回复
27楼
睇书仔：

可否把千变万化的下载再加个普通下载..现在论坛关闭了注册.我等下载不了啊

William 于 2009-07-03 00:32 AM 回复

已经提供普通下载了，第二个~

2009-07-02 12:45 回复
26楼
zsk：

六，新建模块，模块标识：Topvv，模块名称：留空。排序为：0。
这个不幸啊。 psd 怎么用啊

William 于 2009-07-03 00:33 AM 回复

用这款皮肤的时候请看清使用范围，这套皮肤在半静态下设计的，全静态和全动态没有测试。
PSD文件用PhotoShop软件打开编辑。

2009-07-02 03:34 回复
25楼
天涯：

很不错，特地来支持一下，新版本可以用吗?
PJBlog3 3.1.6.227 公测版本

William 于 2009-06-26 11:48 AM 回复

不清楚，没有试着修改过。等正式版出来再看看，毕竟测试版用的人还不是很多！

2009-06-26 11:27 回复
24楼
yzsde：

谢谢你的点解，精神上支持你再造更好的皮肤！

William 于 2009-06-17 04:05 PM 回复

呵呵，会的，谢谢支持~

2009-06-17 15:54 回复
23楼
yzsde：

在IE8下面日历和上一篇/下一篇倒是有点错位

William 于 2009-06-17 12:15 AM 回复

我的在IE8下不会错位。这不是皮肤的问题，是源程序在IE8下的兼容问题。在 head.asp 添加一个代码就可以了！
[html]<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />[/html]
我想添加的位置一看就懂了。

2009-06-17 10:12 回复
22楼
yzsde：

那个TOPVV模板我排序100，也能正常显示，不知道各位的为什么一定要0？我的只是在静态日志页面不能显示那个

William 于 2009-06-17 12:13 AM 回复

我只能这么说，这套皮肤是在非全静态下使用的，全静态下肯定会有一些问题的。

2009-06-16 21:51 回复
21楼
yzsde：

在补充下，静态日志页面下，那个调回最上面的TOP也是不能实现，一起提供个解决方案，谢谢

2009-06-16 21:28 回复