亮晶网络

亮晶网络

首页扁平网页制作
2024-12-11

首页扁平模式,默认调用出了全站置顶主题数据,全站主题数据,自定义标签主题数据和友情链接。

 

对应官方默认文件为view/htm/flat.htm,请勿修改这个文件,如需修改请按照模板开发说明操作

 

所有数据以实际打印的数据为准,本站为实例,但不代表为最新最全的数据,实际打印包含所有插件数据。

 

置顶和主题变量,置顶排在最前面,扁平模式首页仅调用了全站置顶,置顶按照置顶时间排序,最后置顶排在最前。

$threadlist

二维数组,数据格式为:

Array (     [9] => Array         (             [tid] => 9             [fid] => 1             [forum_name] => 最新             [subject] => 网易科技讯 1月3日消息,据外媒BGR报道             [url] => read-9.html             [type] => 0             [link] => 0             [views] => 4             [posts] => 2             [images] => 1             [files] => 1             [mods] => 0             [status] => 0             [closed] => 0             [brief] =>              [keyword] => 网易科技讯 1月3日消息,据外媒BGR报道,苹果知名分析师郭明池(Ming-Chi Kuo)的一份最新研究报告称,苹果将重组其无             [description] => 网易科技讯 1月3日消息,据外媒BGR报道,苹果知名分析师郭明池(Ming-Chi Kuo)的一份最新研究报告称,苹果将重组其无线耳机AirPods Pro、下一代智能手表Apple Watch和便携式移动产品iPod Touch的供应商。             [attach_on] => 0             [image_url] =>              [flags] => 2             [i] => 0             [create_date] => 1578024213             [create_date_fmt] => 5天前             [last_date_fmt] => 3小时前             [create_date_text] => 2020-01-03             [last_date_text] => 2020-01-08             [uid] => 1             [username] => admin             [user_avatar_url] => view/img/avatar.png             [user] => Array                 (                     [uid] => 1                     [gid] => 1                     [username] => admin                     [avatar] => 0                     [articles] => 1                     [comments] => 0                     [groupname] => 管理员组                     [avatar_url] => view/img/avatar.png                     [online_status] => 1                 )             [user_url] => user-1.html             [lastuid] => 9             [last_date] => 1578475328             [lastusername] => test             [sticky] => 3             [sticky_class] => danger             [icon] => 1578024213             [icon_text] => upload/thumbnail/202001/1_9_1578024213.jpeg             [pages] => 1             [tag] => {"1":"iPod","2":"网易科技","3":"AppleWatch"}             [tag_text] => Array                 (                     [1] => iPod                     [2] => 网易科技                     [3] => AppleWatch                 )             [allowupdate] => 1             [allowdelete] => 1         ) )

几乎相关数据都以调用,具体对应参数请参照数据表文件对照,数据表文件有备注,只需在模板将数组内容遍历出来即可。

 

在模板中实现遍历展示,以下为包含公用的列表文件:

<ul class="threadlist list-group list-group-flush shadow">     <!--{hook index_flat_threadlist_before.htm}-->     <?php include _include(APP_PATH . 'view/htm/thread_list.inc.htm');?>     <!--{hook index_flat_threadlist_after.htm}--> </ul>

如果需要修改列表样式,需要复制 thread_list.inc.htm 到你的自制模板目录,修改样式即可,如不需要前台管理功能,直接删除代码即可。

 

<li class="media thread tap bg-white" data-href="<?php echo $_thread['url']; ?>" tid="<?php echo $_thread['tid'];?>">

threadlist这class要保留,ajax modal 调取数据使用。

 

class里的tap是移动端使用,点击整行跳转,data-href="<?php echo $_thread['url']; ?>"则为跳转地址。

 

tid="<?php echo $_thread['tid'];?>" 是前端管理时使用。

 

thread_list.inc.htm 这个文件,不懂的php代码原样保留。

 

自制模板目录应该为 view/template/demo/htmdemo应为你的模板目录名。 thread_list.inc.htm 文件应复制到这个目录下的 htm 目录里。

 

包含该文件的方式应为:

<ul class="threadlist list-group list-group-flush shadow">     <!--{hook index_flat_threadlist_before.htm}-->     <?php include _include(APP_PATH . 'view/template/demo/htm/thread_list.inc.htm');?>     <!--{hook index_flat_threadlist_after.htm}--> </ul>

<!-- **.htm --> 这种为系统内置的钩子,二开时hook使用,自制模板可删除。

 

//-------------- 分页代码 ---------------

<?php if ($pagination) { ?> <nav class="my-3">     <ul class="pagination justify-content-center flex-wrap">         <?php echo $pagination; ?> <!--此处为分页变量-->     </ul> </nav> <?php } ?>

 

//-------------- 站点名和站点介绍 ---------------

<div class="mx-3 pt-3">     <h5 class="text-center">         <?php echo $conf['sitename'];?>     </h5>     <!--{hook index_flat_sitename_after.htm}-->     <div class="small line-height-3">         <?php echo $conf['sitebrief'];?>     </div>     <!--{hook index_flat_sitebrief_after.htm}--> </div>

 

//-------------- 自定义标签主题代码 ---------------

自定义标签主题是多维数组

Array (     [6] => Array         (             [flagid] => 6             [name] => 热门             [fid] => 0             [rank] => 0             [number] => 10             [count] => 1             [icon] => 0             [display] => 1             [create_date] => 1578491363
            [create_date_fmt_ymd] => 2020-01-08             [title] =>              [keywords] =>              [description] =>              [tpl] =>              [alias] =>              [i] => 2             [forum_name] => 首页             [display_fmt] => 是             [forum_url] => ./             [url] => flag-6.html             [icon_text] =>              [tids] => Array                 (                     [0] => 9                 )             [list] => Array                 (                     [0] => Array                         (                             [tid] => 9                             [fid] => 1                             [forum_name] => 最新                             [subject] => 网易科技讯 1月3日消息,据外媒BGR报道                             [url] => read-9.html                             [type] => 0                             [sticky] => 3                             [link] => 0                             [views] => 4                             [posts] => 2                             [images] => 1                             [files] => 1                             [mods] => 0                             [status] => 0                             [closed] => 0                             [brief] =>                              [keyword] => 网易科技讯 1月3日消息,据外媒BGR报道,苹果知名分析师郭明池(Ming-Chi Kuo)的一份最新研究报告称,苹果将重组其无                             [description] => 网易科技讯 1月3日消息,据外媒BGR报道,苹果知名分析师郭明池(Ming-Chi Kuo)的一份最新研究报告称,苹果将重组其无线耳机AirPods Pro、下一代智能手表Apple Watch和便携式移动产品iPod Touch的供应商。                             [attach_on] => 0                             [image_url] =>                              [flags] => 3                             [i] => 20                             [lastuid] => 9                             [lastusername] => 福星                             [last_date] => 1578475328                             [last_date_fmt] => 2020-01-08                             [create_date] => 1578024213                             [create_date_fmt] => 5天前                             [last_date_fmt] => 5小时前                             [create_date_fmt] => 2020-01-03                             [uid] => 1                             [username] => admin                             [user_avatar_url] => view/img/avatar.png                             [user] => Array                                 (                                     [uid] => 1                                     [gid] => 1                                     [username] => admin                                     [avatar] => 0                                     [articles] => 1                                     [comments] => 0                                     [groupname] => 管理员组                                     [avatar_url] => view/img/avatar.png                                     [online_status] => 1                                 )                             [user_url] => user-1.html                             [sticky_class] => danger                             [icon] => 1578024213                             [icon_fmt] => upload/thumbnail/202001/1_9_1578024213.jpeg                             [pages] => 1                             [tag] => {"1":"iPod","2":"网易科技","3":"AppleWatch"}                             [tag_fmt] => Array                                 (                                     [1] => iPod                                     [2] => 网易科技                                     [3] => AppleWatch                                 )                             [allowupdate] => 1                             [allowdelete] => 1                         )                 )         ) )

以实际打印的数组为准

遍历方法 单独调用自定义标签主题,请看 自定义调用这篇内容

<?php if($flaglist){foreach($flaglist as &$_flag) {  <div class="shadow mt-3"> <!--html代码 自定义标签名和链接 -->     <div class="card-header bg-light">         <h3 class="font-weight-bold my-0">             <a href="<?php echo $_flag['url'];?>" title='<?php echo $_flag['name'];?>' aria-label='<?php echo $_flag['name'];?>'>            <?php echo $_flag['name']; ?>             </a>         </h3>     </div>          <ul class="list-group list-group-flush nowrap">     <!-- 循环输出 自定义标签的主题,根据设置的数量输出 -->         <?php if(isset($_flag['list'])){foreach($_flag['list'] as $_thread) { ?>         <li class="list-group-item bg-white">             <h4 class="my-0">             <!-- 主题和主题链接,如需输出其他信息,请根据上面数组显示的数据,调用即可 -->                 <a href="<?php echo $_thread['url'];?>" class="d-block ellipsis" <?php echo ($_thread['type']==10?'rel="nofollow" target="_blank"':''); ?> title='<?php echo $_thread['subject'];?>' aria-label='<?php echo $_thread['subject'];?>'>                    <?php echo $_thread['subject'];?>                 </a>             </h4>         </li>         <?php }} ?>     </ul> </div> <?php }} ?>

 

//-------------- 友情链接代码 ---------------

<?php if(!empty($linklist)){ ?> <div class="shadow mt-3">     <div class="card-header bg-light">         <h3 class="font-weight-bold my-0">             <?php echo lang('friends_link');?>         </h3>     </div>     <ul class="list-group list-group-flush nowrap">     <!-- 循环输出友情链接 -->         <?php foreach($linklist as &$_link) { ?>         <li class="list-group-item">             <a href="<?php echo $_link['url'];?>" class="d-block"  target="_blank" aria-label='<?php echo $_link['name'];?>'>                 <?php echo $_link['name'];?>             </a>         </li>         <?php } ?>     </ul> </div> <?php } ?>

 

//-------------- 页头导航栏 active 放在页面最下面  ---------------

 <script>     $('#nav li[data-active="fid-<?php echo $fid;?>"]').addClass('active'); </script>

 

加载公用的页头和页脚,这个页面就完成了。不懂php没关系,只要懂bootstrap和html、css就可以了,把官方 htm 文件里的php代码复制过去即可。