找回密码
 立即注册
搜索

途迹耕耘

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

GMT+8, 2025-12-22 07:09 , Processed in 0.101595 second(s), 14 queries .

[DZ教程] discuz 自定义文件预览帖内图片

[复制链接]
bdk 发表于 2020-5-2 06:59:01 | 显示全部楼层 |阅读模式
标题上的可能无法表达出我要做的东西,简单解释下:
在做模板下载时,有时候没有网址演示站,只是上传了一些截图,这些图片在帖子里全都插入很占地方,帖子拉的很长,所以想做个单独页面来显示本帖所有图片。

****点击我预览本帖图片demo****

使用自定义页面和帖内图片调用的方法:

[tem]1.自定义页面php文件[/tem]
以下代码做成php文件,命名demo.php,放到根目录。
  1. <?php
  2. if(!$_GET[tid]) {
  3. header('Location: /');
  4. }
  5. define('CURSCRIPT', 'demo');
  6. define('CURMODULE', 'index');
  7. require './source/class/class_core.php';
  8. $discuz = & discuz_core::instance();
  9. $discuz->init();
  10. loadcache('diytemplatename');
  11. $navtitle = '';
  12. $metakeywords = '';
  13. $metadescription ='';
  14. runhooks();
  15. include template('diy:portal/demo');
  16. ?>
复制代码
因为之后需要获取tid来查询相关内容,所以这里写了个判断,如果没有tid,就返回首页,要不然直接访问这个demo.php时会报错。

[tem]2.图片展示页面[/tem]
以下代码做成php文件,命名demo.php,放到template/当前风格目录/portal内。
  1. <?php echo'无主题信息'; exit;?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml"><head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
  5. <title>图片演示 - <!--{$_G['setting'][sitename]}--></title>
  6. <meta name="keywords" content="$metakeywords">
  7. <meta name="description" content="$metadescription">
  8. <script>
  9.       function setTab(name, cursel) {

  10.         cursel_0 = cursel;

  11.         for (var i = 1; i <= links_len; i++) {

  12.           var menu = document.getElementById(name + i);

  13.           var menudiv = document.getElementById("con_" + name + "_" + i);

  14.           if (i == cursel) {

  15.             menu.className = "off";

  16.             menudiv.style.display = "block";

  17.           }

  18.           else {

  19.             menu.className = "";

  20.             menudiv.style.display = "none";

  21.           }

  22.         }

  23.       }

  24.       function Next() {

  25.         cursel_0++;

  26.         if (cursel_0 > links_len) cursel_0 = 1

  27.         setTab(name_0, cursel_0);

  28.       }

  29.       var name_0 = 'one';

  30.       var cursel_0 = 1;

  31.       var ScrollTime = 5000; //循环周期,可任意更改(毫秒)
  32.       var links_len, iIntervalId;

  33.       onload = function() {

  34.         var links = document.getElementById("tab1").getElementsByTagName('li')

  35.         links_len = links.length;

  36.         for (var i = 0; i < links_len; i++) {

  37.           links[i].onmouseover = function() {

  38.             clearInterval(iIntervalId);

  39.             this.onmouseout = function() {

  40.               iIntervalId = setInterval(Next, ScrollTime);;

  41.             }

  42.           }

  43.         }

  44.         document.getElementById("con_" + name_0 + "_" + links_len).parentNode.onmouseover = function() {

  45.           clearInterval(iIntervalId);

  46.           this.onmouseout = function() {

  47.             iIntervalId = setInterval(Next, ScrollTime);;

  48.           }

  49.         }

  50.         setTab(name_0, cursel_0);

  51.         iIntervalId = setInterval(Next, ScrollTime);

  52.       }
  53.     </script>
  54.     <style type="text/css">
  55. a:link{color: #000;text-decoration: none;}
  56. a:visited{text-decoration: none;color: #000;}
  57. a:hover{text-decoration: none;color: #000;}
  58. a:active{text-decoration: none;color: #000;}
  59. html, body, div, img{font-size:12px;margin:0;padding:0;}
  60. body{background-color: #ddd;}
  61. html, body{font-size:12px;}
  62. .cl{clear:both;}
  63. .head{position:fixed;top:0;width:100%;left: 0;_position:absolute;_width: expression(offsetParent.clientWidth);_top: expression(offsetParent.scrollTop);}
  64. html{_background: url(about:black) no-repeat fixed}
  65. .tab{height:45px;font-family:"Microsoft Yahei", Tahoma, Geneva, sans-serif;line-height:45px;width:100%;overflow:hidden;background:#4d4d4d;font-size:14px;margin:0;padding:0;color:#fff;font-weight:bold;text-shadow:1px 1px #12588A;}
  66. .td_l{float:left;padding:0 0 0 35px;text-align:left;}
  67. .td_r a, .td_l h1, .td_l a{font-size:14px;color:#fff;display:inline;text-decoration:none;padding:0 5px;}
  68. .td_l h3{font-size:14px;color:#fff;display:inline;text-decoration:none;padding:0 5px;color:#F00}
  69. .td_r{text-align:right;float:right;padding:0 30px 0 0;}
  70. .td_r a{color:#fff;padding:0 15px;background:#BD192D;display:block;float:left;font-weight:bold;}
  71. .td_r a:hover{background:#830010;}
  72. .bg{background:#fff;height:35px;overflow:hidden;border-bottom:1px solid #ccc;}
  73. .menu{padding:0 30px 0 35px;position:relative;top:-34px;height:34px;overflow:hidden;}
  74. .menu a li{color:#333;display:block;float:left;text-decoration:none;padding:0 15px;position:relative;height:30px;line-height:30px;overflow:hidden;background:#fff;}
  75. .menu a li.off{background:#f8f8f8;color:#000;border:1px solid #ccc;border-radius: 3px;}
  76. .menu .tip{float:left;margin-left:10px;font-family:宋体;background:#FFFFDD;color: #DB7C22;border: solid 1px #E3E197;border-radius: 2px;padding:5px 10px;}
  77. .menu .tip span{color:red;cursor:pointer;padding-left:5px;}
  78. .menudiv{text-align: center;padding-top: 5px;font-size: 30px;font-weight: bold;margin-top: 80px;margin-right: auto;margin-bottom: 0;margin-left: auto;background-repeat: no-repeat;}
  79. img{cursor:pointer;}
  80. .hide{display:none;}
  81.     </style>
  82.   </head>
  83.   
  84.   <body>
  85.     <div class="head">
  86.       <div class="tab">
  87.               <!--{eval $threaddatas = DB::fetch_all("SELECT tid,pid,subject,author,authorid FROM ".DB::table('forum_post')." WHERE `tid`= '$_GET[tid]' AND  `first`=1;");}-->
  88.               <!--{loop $threaddatas $threaddata}-->
  89.         <div class="td_l">
  90.           <h1>
  91.             <a href="forum.php?mod=viewthread&tid=$threaddata['tid']">
  92.               $threaddata['subject']
  93.             </a>
  94.             - 效果演示
  95.           </h1>
  96.           <h3>
  97.             图片来自网页截图,实际可能因完善或修复而有变动。
  98.           </h3>
  99.         </div>
  100.         <div class="td_r">
  101.           <a target="_blank" href="forum.php?mod=viewthread&tid=$threaddata['tid']">
  102.             返回原帖
  103.           </a>
  104.           <a href="home.php?mod=space&uid=$threaddata['authorid']" title="$threaddata['author']主页"><i class="fa fa-envelope-o fa-fw"></i>By $threaddata['author']</a>
  105.         </div>
  106.         <!--{/loop}-->
  107.       </div>
  108.       <div class="bg">
  109.       </div>
  110.       <div class="tab1" id="tab1">
  111.         <div class="menu">
  112. <!--{eval $tbid = DB::result(DB::query("SELECT tableid FROM ".DB::table('forum_attachment')." WHERE `tid`= '$_GET[tid]'"));}-->
  113.           <!--{if $tbid}-->
  114.           <!--{eval $piclists = DB::fetch_all("SELECT attachment,remote,aid,description,filename,pid FROM ".DB::table('forum_attachment_'.$tbid.'')." WHERE `tid`= '$_GET[tid]' AND `isimage`=1;");}-->
  115.        <!--{loop $piclists $key $piclist}-->
  116.         <!--{eval $ynfirst = DB::fetch_all("SELECT first FROM ".DB::table('forum_post')." WHERE `pid`= '$piclist[pid]';");}-->
  117.          <!--{loop $ynfirst $va}-->
  118.                   <!--{eval $keys = $key+1;}-->
  119.                   <!--{if $va['first'] == 1}-->
  120.                   <a href="javascript:void(0);">
  121.                       <li id="one$keys" onclick="setTab('one',$keys)">
  122.                       <!--{if $piclist['description']}-->$piclist['description']<!--{else}-->$piclist['filename']<!--{/if}-->
  123.                       </li>
  124.                      </a>
  125.                      <!--{/if}-->
  126.                      <!--{/loop}-->
  127.               <!--{/loop}-->
  128.           <!--{else}-->
  129.           <a><li style="text-align: center; width: 100%;">本帖无图,返回看文字吧。。。</li></a>
  130.           <!--{/if}-->
  131.         </div>
  132.         <div class="cl">
  133.         </div>
  134.       </div>
  135.     </div>
  136.     <div class="menudiv">
  137.       <!--{loop $piclists $key $piclist}-->
  138.       <!--{eval $keys = $key+1;}-->
  139.       <div id="con_one_$keys" style="display:none;">
  140.         <!--{if $piclist['remote'] == 0}--><img src="data/attachment/forum/$piclist['attachment']"/><!--{else}--><img src="http://file.cmsbj.cn/cmsbj_file/forum/$piclist['attachment']"/><!--{/if}-->
  141.       </div>
  142.       <!--{/loop}-->
  143.     </div>
  144.     <div style="display:none">
  145.     </div>
  146.   </body>
  147. </html>
复制代码
这样,访问域名/demo.php?tid=主题id就可以显示这个主题的所有图片。

补充说明:以上使用的discuz自定义可diy页面,模板种查询数据。模板文件的命名可在include template('diy:portal/demo');里修改。

20161224 更新
修复会将回复楼内附件也调用的问题。

20180417 更新
增加runhooks();让插件钩子可以正常使用。