忘记密码?

一键登录

草根吧源码论坛

Nginx编译安装Fancy Index模块,实现漂亮的索引目录

查看: 137|回复: 0

Nginx编译安装Fancy Index模块,实现漂亮的索引目录

[复制链接]

1703

主题

2170

热度

591

贡献

民审

Rank: 8Rank: 8

发表于 2016-8-25 09:16:36 | 显示全部楼层 |阅读模式 | 百度  360  谷歌 
分享到:

Nginx开启目录浏览配置文件,便可轻松的实现Nginx索引,不过自带的索引目录不是特别美观,也不可以自定义,我们可以安装第三方Fancy Index模块,来实现漂亮的索引目录。

草根吧 Nginx编译安装Fancy Index模块,实现漂亮的索引目录 Nginx,编译,Fancy,Index,模块 站长帮 nginx_520

此方法适用于OneinStack(LNMP)环境下编译安装Fancy Index模块,当然原理和方法类似,都可以参考。

一、下载模块

如果您已经安装好OneinStack(LNMP)一键包,默认情况是没有编译Fancy Index模块的,我们需要自己编译一下。

  1. cd /root/lnmp/src                      ###进入LNMP一件包的src目录,请根据实自己的实际情况调整
  2. git clone https://github.com/aperezdc/ngx-fancyindex.git ngx-fancyindex     ###下载Fancy Index模块
复制代码
二、解压Ningx

Nginx的包也是在/root/lnmp/src目录下,使用下面的命令解压,注意:不同的版本nginx压缩包名字可能不一样,请根据实际情况修改。

  1. tar -zxvf nginx-1.9.14.tar.gz           ###解压nginx
  2. cd nginx-1.9.14                         ###进入nginx目录
复制代码
三、增加Nginx模块

先输入命令nginx -V查看当前已经编译的模块,并记录。

草根吧 Nginx编译安装Fancy Index模块,实现漂亮的索引目录 Nginx,编译,Fancy,Index,模块 站长帮 nginx_V

执行下面的命令在末尾增加--add-module=../ngx-fancyindex模块:

  1. ./configure --prefix=/usr/local/nginx --user=www --group=www --with-http_stub_status_module --with-http_v2_module --with-http_ssl_module --with-ipv6 --with-http_gzip_static_module --with-http_realip_module --with-http_flv_module --with-ld-opt='-ljemalloc' --add-module=../ngx-fancyindex
复制代码
四、重新编译

依次输入下面的命令重新编译下nginx

  1. make
  2. mv /usr/local/nginx/sbin/nginx{,_`date +%F`}
  3. cp objs/nginx /usr/local/nginx/sbin
复制代码
五、添加配置

将下面的配置文件添加到nginx主机配置文件中,并service nginx restart重启nginx

  1. location / {
  2. fancyindex on;
  3. fancyindex_exact_size off;
  4. fancyindex_localtime on;
  5. #fancyindex_header "/header.html";
  6. fancyindex_footer "/footer.html";
  7. fancyindex_ignore "footer.html" "exclude_centos.list";
  8. }
复制代码

这样就可以利用Fancy Index模块模块美化Nginx索引目录啦,也可以自定义footer或者header页面,分享一下自己的footer.html文件:

  1. <style type = "text/css">
  2.                 body{
  3.                         margin:0;
  4.                         padding:0;
  5.                         font-size:16px;
  6.                         font-family:'MicrosoftYaHei';
  7.                 }
  8.                 #foot{
  9.                         font-size:14px;
  10.                         width:100%;
  11.                         position: fixed;
  12.                         bottom:10px;
  13.                         text-align:center;
  14.                         padding:8px;
  15.                         padding-top:20px;
  16.                         /*border:1px solid red;*/
  17.                         margin-top:20px;
  18.                 }
  19.                 a{
  20.                         text-decoration:none;
  21.                 }
  22.         </style>

  23.         <div id = "foot">
  24.                 ©2016 Powered by <a href = "https://www.caogen8.co/" title = "草根吧" target = "_blank">草根吧</a>. <a href = "../readme.html" title = "草根吧 - Discuz应用中心">使用说明</a>
  25.         </div>
  26.         <script src = "https://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script>
  27.         <script>
  28.                 $(document).ready(function(){
  29.                         var bodyheight = $(document.body).outerHeight(true);
  30.                         var bheight = $(window).height();
  31.                         //alert('body:' + bodyheight + 'browser:' + bheight);
  32.                         if(bodyheight > bheight) {
  33.                                 $("#foot").css("position","relative");
  34.                         }
  35.                 });
  36.         </script>
  37. </body>
  38. </html>
复制代码
六、效果演示

最后查看到的效果如下图所示,

草根吧 Nginx编译安装Fancy Index模块,实现漂亮的索引目录 Nginx,编译,Fancy,Index,模块 站长帮 xiaoz_soft



帖子地址: 

本文来源于草根吧源码论坛 www.caogen8.co,欢迎大家下载。
如果您没有贡献需要充值,可以直接在线充值,点击充值
如果你需要加入本站赞助VIP会员,可以直接在线开通,点击开通
如果找不到您要的资源,请搜索一下,点击搜索
回复

举报

发表回复

您需要登录后才可以回帖 登录 | 立即注册 新浪微博登陆 用百度帐号登录 一键登录:

本版积分规则

收藏帖子 返回列表 搜索
快速回复 返回顶部 返回列表