千丝海阁

昨天将本站的wordpress升级到最新版本，今天早上，经过两位朋友的提醒，才发现用非chrome浏览器打开博客，头部会显示有错误，错误内容为：

Warning: Cannot modify header information – headers already sent by (output started at /home/tiandiyo/domains/tiandiyoyo.com/public_html/wp-content/themes/freshblog/header.php:5) in /home/tiandiyo/domains/tiandiyoyo.com/public_html/wp-content/themes/freshblog/header.php on line 106

于是查了下header.php的106行代码，是setcookie的一段代码，本意是来访者，如果没有显示模式（普通or宽屏）的cookie，即第一次来访，强制存储cookie为宽屏模式。不知道是不是由于升级到最新版本的wp的原因才报错的，不管三七二十一，注释掉语句，将相关逻辑写入到下面的条件中。

//显示模式切换
//if(!isset($_COOKIE['MODOFTIANDIYOYO']))
    //setcookie('MODOFTIANDIYOYO',1,time()+3600*24*60,"/");
if(isset($_COOKIE['MODOFTIANDIYOYO']) && $_COOKIE["MODOFTIANDIYOYO"] == 0) 
	echo "<div class='sw'><a href='' id='switches'>切换至宽屏</a></div>";
else 
	echo "<div class='sw'><a href='' id='switches'>切换至普通</a></div>";

顺便说一下本站实现宽屏自适应和普通模式的思路，利用cookie存储显示模式，根据不同的显示模式加载不同的样式style。在文件header.php插入以下代码：

<?php if($_COOKIE["MODOFTIANDIYOYO"] == 1 || !isset($_COOKIE['MODOFTIANDIYOYO'])) 
	$reallycss = get_bloginfo('stylesheet_directory') . "/style2.css";
else 
	$reallycss = get_bloginfo('stylesheet_directory') . "/style.css";
?>
<link rel="stylesheet" id = "csslink" type="text/css" href="<?php echo $reallycss; ?>" media="screen" />

并在适当的位置插入第一段显示模式切换的代码，最后在尾部插入js，来存储cookie以及更改切换的文字。

//浏览方式,0普通,1宽屏
document.getElementById("switches").onclick = function(){
	var name = document.getElementById("switches").innerHTML;
	var mycss = document.getElementById("csslink").href;
	if(name == "切换至宽屏") {
		mycss = mycss.replace("style.css","style2.css");
		document.getElementById("switches").innerHTML = "切换至普通";
		SetCookie("MODOFTIANDIYOYO",1);
	}
	else {
		mycss = mycss.replace("style.css2","style.css");
		document.getElementById("switches").innerHTML = "切换至宽屏";
		SetCookie("MODOFTIANDIYOYO",0);
	}
	location.reload();
}

后话，现在大多都自适应了，为什么tiandi还要加个切换回普通模式的功能呢？因为以前用freshblog的普通版式习惯了，一开始改宽屏模式感觉有些不习惯，不过现在2个月下来，好像也适应了宽屏了，这个切换功能反正也不影响什么，就留着吧。