对于dedecms既涉及到他的前端页面也涉及到它的后台代码,下面以我做的学校网站为例,仅供参考,具体主要还是dedecms的转化。
<div class="nav_area">
<div class="container">
<div class="row">
<!--nav item-->
<div class="col-md-12 col-sm-12 col-xs-12">
<!-- nav menu-->
<nav class="menu">
<ul class="navid pull-left">
<!-- <li><a href="http://www.sjzpt.edu.cn">学院首页</a></li> -->
<li><a href="{dede:global.cfg_cmsurl/}">首页</a></li>
{dede:channelartlist type="top" typeid="3,4,5,6,7,8,9,10" row="8"}
<li><a href="{dede:field name='typeurl'/}">{dede:field name='typename'/} <i class="fa fa-angle-down"></i></a>
<ul class="a">
{dede:channel}
<li><a href="[field:typelink]" title="[field:typename/]">[field:typename/]</a></dd>
{/dede:channel}
</ul>
</li>
{/dede:channelartlist}
</ul>
</nav>
<!--end nav menu-->
<div class="search pull-right">
<div class="search-box">
<input type="text" class="form_control" placeholder="search">
<span class="search-open"><i class="fa fa-search search"></i><i class="fa fa-close hidden close"></i></span>
</div>
</div>
</div>
<!--end nav item -->
</div>
</div>
</div>
以上代码就是一个导航的设计,具体还要参考自己的数据库,以下就是效果,最主要的还是对标签的使用
三个article的使用,分别为index_article,list_article,article_article。这三个article通俗点说就是封面,列表,文档。
index_article
<body>
{dede:include filename="head.htm"/}
<!--start courses area -->
<div class="single_courcse">
<div class="container">
<div class="row">
<div class="col-md-8 col-sm-6">
<div class="single_cos_item">
<!-- <h2 class="single_courcse_title">CELP</h2>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. </p> -->
<h2 class="single_courcse_titles">{dede:type}[field:typename /]{/dede:type}</h2>
<p>{dede:field.content/}</p>
</div>
</div>
<div class="col-md-4 col-sm-6">
<!--widget courses -->
<div class="met-box vedio_tutoria">
<figure>
<img src="{dede:global.cfg_templets_skin/}/images/back.jpg" alt="">
</figure>
<div class="inner_video">
<h5 class="met-box-title">当前位置:{dede:field.position /}</h5>
<ul>
<li>
<div class="media-left">
<i class="fa fa-bars "></i>
</div>
<div class="media-body">
<h1 style="font-size:24px;margin-top:3px;">{dede:type}[field:typename /]{/dede:type}</h1>
<ul>
{dede:channel}
<li style="margin-top:10px;"><a href='[field:typeurl/]'>[field:typename/]</a></li>
{/dede:channel}
</ul>
</div>
</li>
</ul>
</div>
</div>
<!-- end widget courses -->
</div>
</div>
{dede:include filename="footer1.htm"/}
</body>
效果如下:
list_article
<body>
{dede:include filename="head.htm"/}
<!--start courses area -->
<div class="faq_area">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="title">
<h3 class="module-title">
<span> {dede:type}[field:typename /]{/dede:type}</span>
</h3>
<p class="lead">
当前位置:{dede:field.position /}列表
</p>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<div class="panel-group" id="accordion">
<div class="panel panel_default">
<div class="panel_heading">
<a data-toggle="collapse" class="active" data-parent="#accordion" href="" style=" letter-spacing:0.1em">石家庄职业技术学院-Shijiazhuang vocational technology institute
</a>
</div>
<div id="checkut1" class="panel-collapse collapse in">
<div class="panel-body">
<h4 style="margin-left:30px;"><span class="a" style="width:110px;float:right;margin-right:15px;">上传时间</span>文章标题</h4>
</div>
</div>
</div>
<div class="panel panel_default">
<div class="panel_heading">
<h4 class="check-title">
<ul>
{dede:list pagesize='10' orderby='pubdate' titlelen = '500'}
<li id="line_u7_[field:global runphp='yes' name=autoindex][/field:global]">
<a href="[field:arcurl/]" target="_blank" title="[field:title/]" >[field:title function='(strlen("@me")>50 ? cn_substr("@me",50)."..." : "@me")'/]<span class="a" style="width:125px;float:right">[field:pubdate function="GetDateMK(@me)"/]</span></a>
</li>
{/dede:list}
</ul>
</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--end courses area -->
</body>
效果如下:
article_article
<body>
{dede:include filename="head.htm"/}
<!--start courses area -->
<div class="single_courcse">
<div class="container">
<div class="row">
<div class="col-md-8 col-sm-6">
<div class="single_cos_item">
<h2 class="single_courcse_titles">{dede:type}[field:typename /]{/dede:type}</h2>
<p>{dede:field.body/}</p>
</div>
</div>
<div class="col-md-4 col-sm-6">
<!--widget courses -->
<div class="met-box vedio_tutoria">
<figure>
<img src="{dede:global.cfg_templets_skin/}/images/back.jpg" alt="">
</figure>
<div class="inner_video">
<h5 class="met-box-title">当前位置:{dede:field.position /}正文</h5>
<ul>
<li>
<div class="media-left">
<i class="fa fa-bars "></i>
</div>
<div class="media-body">
<h2>{dede:type}[field:typename /]{/dede:type}</h2>
{dede:field.title /}
</div>
</li>
</ul>
</div>
</div>
<!-- end widget courses -->
</div>
</div>
{dede:include filename="footer1.htm"/}
</body>
效果如下:
对于dedecms最主要的是要了解它的一些常用标签,所以以上效果仅供参考。(数据库不同,网站设计不同)