龙 猫 要 努 力 ！

使用合租主机自建wordpress的博客不在少数，而其中很多人经常在文章中插入图片。从图片的存储位置来说大体有三种：主机本身的空间、第三方在线相册、第三方ftp，其中用得最多的是前两种方式。

如果主机允许的空间够大，那利用wordpress的API方式上传图片是最方便不过的了，如此没有技术含量的工作，自然也不在本文的讨论之列。这里要说的主要是第二种方式：第三方在线相册。相信在自有主机的博客作者中有一大半的人喜欢利用外链相册的方式在文章中插入图片。这样做有两点好处。其一，外链相片不占用空间和流量，节约了大把的银子；其二，博客难免搬家，如果主机内存储的相片过多，等搬家的时候就够受的了，而用第三方相册只要图片的固定链接不变，那么搬家的时候就不需要做任何处理。

上面的第二个好处我是深有体会的，以前在yo2安家，图片都上传在它的服务器上，等搬家的时候傻眼了，那么多图片既要挪动空间，又要在文章里更换链接，太累人。也因为这个原因，我下定主意今后的图片坚决放在免费空间，至多在本地做一下备份就行了。

下面切入主题。目前支持外链的在线相册不在少数，flickr、picasaweb等等都是赫赫有名的。而我偏好picasaweb，1G的免费空间（1024px的图片按100k计算，可以存储10000张）足够使用，用完了可以再申请一个账号。有专用的接口程序方便外部调用相册、图片。上传到相册的每一张图片都会在后台自动生成大小不等的图片，其中从32px到800px共计16种大小可以外链，912px到1600px以及原始大小的图片共8种可提供下载。如此强大的功能，不好好利用真是可惜了。

早在一年多以前，著名的windows live writer就出现了picasa image plugin，可以方便选取picasaweb中的图片插入文章，也可从本机选择图片上载到picasaweb。而相应的，goldengate是一款wordpress中的picasa图片插件。也许还有类似的其他插件，但是我没有找到。

goldengate安装后会在上传图片的页面出现两个选项卡，分别是上传图片和picasa相册，方便用户的不同选择。可惜的是，最新版本只能提供插入200px和800px两种图片，200px太小，800px对大多数blog页面来说又太大，尽管可以限定img标签的宽度和高度使得显示大小与页面风格吻合，但是每次需要额外操作一下，比较麻烦，而且对用户体验来说也不好，因为浏览者打开页面的时候，尽管看到的是调整大小后的图片，但是实际上从picasaweb服务器上下载的是800px的图片，当网速较慢的时候就很不舒服了。

通过修改代码可以增加更多的图片大小选择。打开插件的主文件goldengate.php，第245行左右，将

if($link == ‘file’) {
$url = $img_src;
}

替换成

if($link == ‘s800′||$link == ‘s1024′||$link == ‘s1280′||$link == ‘s1600′) {
$url = str_replace(“s800″, $link, $img_src);
}

259行左右，将

if($display != ‘title’) {
$html .= “<img src=’” . ($display == ‘thumb’ ? $thumb_src : $img_src)
. “‘ alt=’$title’ />”;
}

替换成

if($display != ‘title’) {
$html .= “<img src=’” . str_replace(“s800″, $display, $img_src). “‘ alt=’$title’ />”;
}

582行，

<label for=”display-full”>
<input name=”display” id=”display-full” value=”full” type=”radio” checked=”checked”/> Full size (max 800px)</label>
<br/><label for=”display-thumb”>
<input name=”display” id=”display-thumb” value=”thumb” type=”radio” /> Thumbnail</label>
<br/><label for=”display-title”>
<input name=”display” id=”display-title” value=”title” type=”radio”/> Title</label>
</td></tr>
<tr><th>Link to:</th>
<td><label for=”link-file”><input name=”link” id=”link-file” value=”file”  type=”radio”/> File</label>

替换成

<label for=”display-s800″><input name=”display” id=”display-s800″ value=”s800″ type=”radio”/> 800px</label><br/>
<label for=”display-s640″><input name=”display” id=”display-s640″ value=”s640″ type=”radio”/> 640px</label><br/>
<label for=”display-s512″><input name=”display” id=”display-s512″ value=”s512″ type=”radio” checked=”checked”/> 512px</label><br/>
<label for=”display-s400″><input name=”display” id=”display-s400″ value=”s400″ type=”radio”/> 400px</label><br/>
<label for=”display-s4288″><input name=”display” id=”display-s288″ value=”s288″ type=”radio”/> 288px</label><br/>
<label for=”display-s160″><input name=”display” id=”display-s160″ value=”s160″ type=”radio”/> 160px</label><br/>
<label for=”display-title”><input name=”display” id=”display-title” value=”title” type=”radio”/> Only title</label>
</td></tr>
<tr><th>Link:</th>
<td><label for=”link-s800″><input name=”link” id=”link-s800″ value=”s800″  checked=”checked” type=”radio”/> File(800px)</label>
<br/><label for=”link-s1024″><input name=”link” id=”link-s1024″ value=”s1024″ type=”radio”/> File(1024px, enter after click)</label>
<br/><label for=”link-s1280″><input name=”link” id=”link-s1280″ value=”s1280″ type=”radio”/> File(1280px, enter after click)</label>
<br/><label for=”link-s1600″><input name=”link” id=”link-s1600″ value=”s1600″ type=”radio”/> File(1600px, enter after click)</label>

经过这些改动，当点击图片的时候就会多出一些选项，如下图所示。其中图片的大小由两个增加到了6个，多出了很多选择余地，而且如果觉得不够用，那就根据上面代码的意思再酌情增加，非常容易。另外需要说明，外链图片也由单一的File（默认是800px）增加了3个，只不过另外三个外链点开后是一个错误页面。这不是插件的问题，而是picasaweb本身就不支持直接打开912px以上大小的图片，前面已经说明了这一点。不过点完链接后如果在地址栏再回一下车，图片就出来了。

另外，在点击Your Photos on Google选项卡的时候，会展示相册中的图片，插件默认的是144px的缩略图，改成72px可以提高速度，而且也能看清图片。对原始代码作如下改动：

714行，

echo “<a href=’$link’ class=’file-link image’ style=’width: 146px; height: 144px;’>&nbsp;”;

改为

echo “<a href=’$link’ class=’file-link image’ style=’width: 74px; height: 72px;’>&nbsp;”;

另外打开css文件夹中gg.css，将.gg_photo_thumb的width和height都改成74px，改完后的相册展示效果如下

至此简单的改动已经结束，可以在后台体验方便的picasa图像之旅了。

顺便说说，其实picasaweb真的极大的方便了blog的发展，利用picasaweb的函数接口不但可以像本文一样方便的插入图片，更可以插入幻灯、插入全站相册（利用阅微堂的picasaweb插件可以方便的做到这一点，效果见本站相册），而所有的这些带给你的不仅是良好的用户体验、强大的相册技术支持，更能带来成功改造插件后的喜悦。博客精神，不正是如此吗！