我们先去官方网站 (http://highslide.com)看看，在页面左侧可以看到 Installation，这是一个简短的安装说明，如果只想尝试一下的话，你可以按照这个说明来做，如果想长久在博客中使用的话，我建议大家继续往下 看，我的做法是利用网站上的 Editor 工具生成整套应用方案。
1.如何安装？
进 入 Editor，其中 General 中可以设置显示语言以及加载几种预设配置，Gallary中可以开启相册模式及其效果设置，HTML 中可以开启 Inline，Ajax，Ifram，Flash 特效，Behavior 中我建议除了 Animation 外都保持默认，每设置好一项后大家都可以在右侧看看预览，在这里我建议大家尽量多的开启各种特效，
设置满意后点击 publish 生成代码，首先下载 step1 中的 Download a zip archive ，解压后将highslide文件夹放到micologstatic下并删除其中的2个 sample 文件夹（我尝试过直接放在 micolog 下，没有成功，你也可以试试其他文件夹，修改的原理是一样的），highslide-custom-example.htm 中包含了 step2 和 step3 中全部的代码。
在 step2 代码里调用的文件路径前加上/static/，并在全部内容后边加上这段代码
1
2
3
4
5
<script type="text/javascript">
    // override Highslide settings here
    // instead of editing the highslide.js file
    hs.graphicsDir = '/static/highslide/graphics/';
</script>
最后得到代码如下（这是我的例子，效果设置不同调用的 js 文件也有所不同）
1
2
3
4
5
6
7
8
9
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.1/swfobject.js"></script>
<script type="text/javascript" src="/static/highslide/highslide-full.js"></script>
<script type="text/javascript" src="/static/highslide/highslide.config.js" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="/static/highslide/highslide.css">
<script type="text/javascript">
    // override Highslide settings here
    // instead of editing the highslide.js file
    hs.graphicsDir = '/static/highslide/graphics/';
</script>
将以上代码插到 micolog 主题的 base.html 中的<head>与</head>之间。
然 后修改statichighslidehighslide.css,查找 url 并在其后的路径前加上/static/highslide/，这里需要注意的是，不同的特效设置生成的 step3 内容可能相同，但是 highslide.css 是不同的，因此若修改了特效设置，也应对新的 highslide.css 做相应修改。
最后上传更新一下 micolog 就可以了。
2.如何应用？
step3 中的内容为你所设置的特效的应用代码，以发单张图片为例，其代码如下
1
<a href="弹出的图片地址" class="highslide" onclick="return hs.expand(this)" ><img src="显示的图片地址"></a>
这是一个最简单的例子，其他的效果参考 step3 并做相应修改。