李子

今天在摇曳铃丹的帮助下学到了一个在日志中用缩略图的好方法。在WordPress后台预览主题效果时的缩略图效果是不是很不错？它是WordPress程序自带的叫做thickbox的东西，我们可以用它来显示日志中的缩略图。在日志中用小图的好处是不会破坏排版格式，大图会“撑破”版面显得不好看。

在当前主题的header.php中找到：

<?php wp_head(); ?>

在这段上面加入以下代码，来调用thickbox。

<link rel=”stylesheet” href=”<?php bloginfo(‘wpurl’); ?>/wp-includes/js/thickbox/thickbox.css” type=”text/css” media=”screen” />
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js”></script>
<script type=”text/javascript” src=”<?php bloginfo(‘wpurl’); ?>/wp-includes/js/thickbox/thickbox.js”></script>

这里我想说说，我发现在打开网页后，点击小图时不会马上就有我要的效果，那是因为jquery.min.js是要从google调用过来的，网页如果打开慢，效果自然不会马上到位，所以，干脆把jquery.min.js这个文件下载下来上传到指定的目录下，比如/wp-includes/js/thickbox/。这样可以从本地空间调用，速度应该快很多。也就可以这样写：

<link rel=”stylesheet” href=”<?php bloginfo(‘wpurl’); ?>/wp-includes/js/thickbox/thickbox.css” type=”text/css” media=”screen” />
<script type=”text/javascript” src=”<?php bloginfo(‘wpurl’); ?>/wp-includes/js/thickbox/jquery.min.js”></script>
<script type=”text/javascript” src=”<?php bloginfo(‘wpurl’); ?>/wp-includes/js/thickbox/thickbox.js”></script>

文件可以说是改好了。下面可以试一试效果。
编辑一个日志，在日志中要添加图片的位置用下面的代码：

<a href=”http://大图绝对路径”><img src=”http://缩略图绝对路径” /></a>

说白了就是把class=”thickbox”加到a标签内，当然还有很多参数比如居中、居左、居右什么的也可以按自己的要求加进去。

如果是多图放成一排, 除了加class=”thickbox”还要定义rel=”群组名” 群组名自己定义一个, 同一排的图要用同一个群组名。就可写成：

<a rel=”group” href=”http://第一张大图路径”><img src=”http://第一张缩略图路径” /></a>
<a rel=”group” href=”http://第二张大图路径”><img src=”http://第二张缩略图路径” /></a>
<a rel=”group” href=”http://第三张大图路径”><img src=”http://第三张缩略图路径” /></a>

另外，我喜欢把图片做好后FTP到空间的图片目录，不喜欢在后台上传。记录下这些是为了今后用得到的时候不再到处去找。主要还是为了让自己看的。