知更鸟begin主题文件下载信息框美化

自然 2019年6月20日15:11:19 3 113

由鸟哥开发的begin主题一直以来,广受用户喜爱。我们的主题交流群都已经爆满了,可以火热程度。但是使用中自然发现了一个小问题,文章内的附件下载信心框很单调,有些内容显示出来让用户不明所以,这一点不利于用户体验。

知更鸟begin主题文件下载信息框美化

美化后的效果

于是自然就结合“我要去看你”博主的方法对下载信心框进行了一些基本的美化操作,让原本单调的直接展示文件名,变成了“文件名:文件名”的样式,例如自然上传了一个“知更鸟begin主题文件.zip”的文件,前台展示效果就编程了:“资源名称:知更鸟begin主题文件.zip”,这样显得更加明确。

知更鸟begin主题文件下载信息框美化知更鸟begin主题文件下载信息框美化

首先说明一点,自然的美化操作基于最新版本(2019年61更新)的知更鸟begin主题操作,旧版本主题可能存在差异性,实际使用是一样的,略微调整一下即可。

代码的修改

单独页面的美化操作:

打开主题根目录下的down.php文件将代码进行替换即可,代码从down.php文件中第73行开始。

替换前:

  1. <div class="desc">
  2.                     <h3>文件信息</h3>
  3.                     <?php if($down_name){ ?><p><?php echo $down_name;?></p><?php } ?>
  4.                     <?php if($file_os){ ?><p><?php echo $file_os;?></p><?php } ?>
  5.                     <?php if($file_inf){ ?><p><?php echo $file_inf;?></p><?php } ?>
  6.                     <?php if($down_size){ ?><p><?php echo $down_size;?></p><?php } ?>
  7.                     <?php if($links_id){ ?><p><strong>下载次数:</strong><?php echo $click_count;?></p><?php } ?>
  8.                 </div>
  9.                 <div class="clear"></div>

替换后:

  1. <div class="desc">
  2.                     <h3>文件信息</h3>
  3.                 <p> <?php if($down_name){ ?><p>资源名称:<?php echo $down_name;?></p><?php } ?></p>
  4.                 <p> <?php if($file_os){ ?><p>应用平台:<?php echo $file_os;?></p><?php } ?></p>
  5.                 <p> <?php if($file_inf){ ?><p>资源版本:<?php echo $file_inf;?></p><?php } ?></p>
  6.                 <p> <?php if($down_size){ ?><p>资源大小:<?php echo $down_size;?></p><?php } ?></p>
  7.                 <p> <?php if($links_id){ ?><p><strong>下载次数:</strong><?php echo $click_count;?></p><?php } ?></p>
  8.                 </div>

文章内下载信息框的美化操作

打开主题/inc/目录下的down-meta.php文件将代码进行替换即可,代码从down-meta.php中第40行开始。

替换前:

  1. if($down_start) {
  2.             $content .= '
  3.             <div class="down-form">
  4.                 <fieldset>
  5.                     <legend>下载信息</legend>
  6.                     <span class="down-form-inf">
  7.                         <span>'.$down_name.'</span>
  8.                         <span>'.$file_os.'</span>
  9.                         <span>'.$file_inf.'</span>
  10.                         <span>'.$down_size.'</span>
  11.                         '.$click_count_on.'
  12.                         <span class="pass"> '.$pan_bd_password.'</span>
  13.                         <span class="pass"> '.$rar_zip_password.'</span>
  14.                         <div class="clear"></div>
  15.                     </span>
  16.                     <span class="down"> '.$down_password.'</span>
  17.                     <span class="down">
  18.                      '.$demo_content.'
  19.                     </span>
  20.                     <div class="clear"></div>
  21.                 </fieldset>
  22.             </div>
  23.             <div class="clear"></div>';
  24.         }

替换后:

  1. if($down_name) {
  2.             $down_name_on .= '<span><strong>资源名称:</strong>'.$down_name.'</span>';
  3.         }
  4. if($file_os) {
  5.             $file_os_on .= '<span><strong>应用平台:</strong>'.$file_os.'</span>';
  6.         }
  7. if($file_inf) {
  8.             $file_inf_on .= '<span><strong>资源版本:</strong>'.$file_inf.'</span>';
  9.         }
  10. if($down_size) {
  11.             $down_size_on .= '<span><strong>资源大小:</strong>'.$down_size.'</span>';
  12.         }
  13. if($down_start) {
  14.             $content .= '
  15.             <div class="down-form">
  16.                 <fieldset>
  17.                     <legend>下载信息</legend>
  18.                     <span class="down-form-inf">
  19.                         <span>'.$down_name_on.'</span>
  20.                         <span>'.$file_os_on.'</span>
  21.                         <span>'.$file_inf_on.'</span>
  22.                         <span>'.$down_size_on.'</span>
  23.                         '.$click_count_on.'
  24.                         <span class="pass"> '.$pan_bd_password.'</span>
  25.                         <span class="pass"> '.$rar_zip_password.'</span>
  26.                         <div class="clear"></div>
  27.                     </span>
  28.                     <span class="down"> '.$down_password.'</span>
  29.                     <span class="down">
  30.                      '.$demo_content.'
  31.                     </span>
  32.                     <div class="clear"></div>
  33.                 </fieldset>
  34.             </div>
  35.             <div class="clear"></div>';
  36.         }

小结

美化后的效果更加适合站内拥有大量附件提供用户下载的站长,让用户一目了然的了解到附件的基本信息,不需要多余的考究,这在很大程度上优化了用户体验效果。

weinxin
网科文媒
快来关注一下,你想要的这里都有喔!
自然

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:3   其中:访客  2   博主  1

    • avatar 心灵博客 3

      确实直观多了。

      • avatar 法克鱿哈 0

        这样就是美化了?你去看看这个网站的下载界面,thefox.cn 他模仿模板兔插件 美化超级好看
        模板兔一直没有把美化拿出来,终于在4.9及版本给出美化狂了,么更新了而模仿的人没更新了
        你可以借鉴这个网站的下载超级好看