下载展示内容页

1、制作下载展示内容页

内页模板布局主要分三部分，页头/页中/页底。

页面引用语法

1.1 引用页头模板header.html

{template 'header.html'}

1.2 页中部分制作

下载展示内容页其他调用项都与普通内容页雷同，区别在于多出了下载信息列表和多图轮播部分。

内容页页中调用可参考[ 查看 ]

1.3 引用页底模板footer.html

{template 'footer.html'}

2、下载说明部分

2.1 下载信息列表

<table>
<tr>
<th>{lang('dong_size')}：</th>
<td>{$archive['my_size']}</td>//附件尺寸（内容自定义字段）
</tr>
<tr>
<th>{lang('nowdownload')}：</th>

 <td>{if $archive['attachment_id']}//判断内容是否上传了附件
{attachment_js($archive['aid'])}//内容附件下载递增
{else}
{lang('nodownload')}//如无附件显示无附件（语言项编辑提示信息）
{/if}
</td>
</tr>
</table>
</div>
<div>
<table>
{if config::get('isecoding')=='1'}//判断是否生成防伪码
<tr>
<th>{lang('ecoding')}：</th>
<td>{if $archive['ecoding']}{$archive['ecoding']}{else}{lang('not')}{/if}</td>//防伪码信息，如未生成显示无
</tr>
{/if}
<tr>
<th>{lang('adddate')}：</th>
<td>{$archive['adddate']}</td>//发布时间
</tr>
<tr>
<th>{lang('strgrades')}：</th>
<td>{$archive['strgrade']}</td>//内容评级
</tr>
</table>

2.2 下载内页多图轮播代码

<link href="{$skin_path}/js/lightgallery/css/lightgallery.css" rel="stylesheet">
<div id="carousel-example-generic" class="carousel slide section clearfix" data-ride="carousel" style="max-height:700px; margin-top:10px; overflow:hidden;">
<!-- 大图切换 -->
<div class="carousel-inner demo-gallerylist-unstyled row" id="lightgallery" role="listbox">
{loop $archive['pics'] $i $pic}
<div class="item img-auto{if $i==1} active{/if}" data-src="{$pic['url']}" data-sub-html="{$pic['alt']}">
<a href="" rel="lightbox['roadtrip']"><img src="{$pic['url']}" alt="{$pic['alt']}" class="img-responsive" onerror='this.src="{config::get('onerror_pic')}"' /></a>
</div>
{/loop}
</div>
<!-- 左右按钮 -->
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>

下载轮播必须加载js调用：

<script src="{$skin_path}/js/lightgallery/js/lightgallery.min.js"></script>
<script src="{$skin_path}/js/lightgallery/js/lg-pager.min.js"></script>
<script src="{$skin_path}/js/lightgallery/js/lg-fullscreen.min.js"></script>
<script src="{$skin_path}/js/lightgallery/js/lg-zoom.min.js"></script>
<script src="{$skin_path}/js/lightgallery/js/lg-hash.min.js"></script>
<script>
lightGallery(document.getElementById('lightgallery'));
</script>

用 CmsEasy 助您「轻松搭建」企业官网。