用Dreamweaver 打開dede文件的index.htm模板頁面
首先講一下怎么看模板的css
<link href="{dede:global.cfg_templeturl/}/style/dedecms.css" rel="stylesheet" media="screen" type="text/css" />
在index.htm里第八行里就是這一句,通過這句話大家可以看到一個(gè)css路徑,也就是在\templets\style這個(gè)文件下的所有文件都是dede默認(rèn)模板的css文件,而index.htm的css就是dedecms。
打開這個(gè)css文件后大家會(huì)看到
@import url("layout.css");
@import url("page.css");
這兩句話
這兩句的意思就是dedecms.css這個(gè)css文件還引用了
layout.css和page.css這2個(gè)css
通過查看dedecms.css文件大家可以發(fā)現(xiàn)這個(gè)css主要控制的是所有模板文件的頭部和尾部以及所有css的全局設(shè)計(jì)
大家找到/*---------- base ---------*/這句下面一直到/*---------- frame ---------*/這里基本上都是全局css
下面的透過看單詞就明白是header和foot的css
也就是模板的頭尾部css
關(guān)于page和layout這兩個(gè)css是關(guān)于列表部分css、翻頁css、以及一些通用的css,大家可以通過查看css了解一下 dedecms模板|dede仿站|dede模板制作|dede防站-Dede之家-www.2d30.cn
下面大家打開head.htm模板文件
dede的前臺(tái)模板在\templets\default文件夾下
下面根據(jù)默認(rèn)模板簡單講解一下css的對(duì)應(yīng)關(guān)系和部分標(biāo)簽的基礎(chǔ)應(yīng)用
首先大家打開head.htm后會(huì)看到<div class="header">這句話
那么其中的header就是一個(gè)定義為header的css
那我們可以復(fù)制header,然后再dedecms.css
里用Ctrl+f來查找有關(guān)header的所有css定義
其它c(diǎn)ss的查找同樣,如果你在某個(gè)css文件中找不到相應(yīng)的css那么就在其他幾個(gè)css文件中查找,然后修改
至于具體怎么修改css就不再本次講解之內(nèi)了,有關(guān)css的學(xué)習(xí)在網(wǎng)上有很多教程
在這里只是簡單說明一下css的查找和應(yīng)用
下面講解一些標(biāo)簽的應(yīng)用
我會(huì)通過實(shí)例來和大家分享
【呵呵,css的知識(shí)范圍太廣了,不是一兩句話就可以說清楚的,如果大家在學(xué)習(xí)的過程有什么不明白的地方可以在另一個(gè)群(83086030)里討論?!?br>
打開index.htm文件,刪除body里的所有內(nèi)容。
首先說一下arclist即文檔列表標(biāo)簽,這個(gè)標(biāo)簽在模板當(dāng)中應(yīng)用是最廣也是最基本的標(biāo)簽,熟悉這個(gè)標(biāo)簽后只要學(xué)會(huì)變通,基本可以學(xué)會(huì)dede的所有標(biāo)簽應(yīng)用。
dedecms模板|dede仿站|dede模板制作|dede防站-Dede之家-www.2d30.cn
arclist這個(gè)標(biāo)簽是全局標(biāo)簽,也就是說這個(gè)標(biāo)簽基本上在任何模板都可以使用,當(dāng)然不包括一些特殊模板。
如search.htm這個(gè)模板貌似就不能用
arclist標(biāo)簽的基本結(jié)構(gòu):
{dede:arclist}
<a href='[field:arcurl/]'>[field:title/]</a>
{/dede:arclist}
首先dede大部分的標(biāo)簽html語言一樣,都是需要閉合的。
{dede:arclist}
{/dede:arclist}
也就是必須要有這2個(gè)部分組成
然后再中間插入,如:<a href='[field:arcurl/]'>[field:title/]</a>這樣的標(biāo)題標(biāo)簽
(dede的標(biāo)簽除了channelartlist標(biāo)簽是可以嵌套的之外,其它標(biāo)簽都不可以嵌套的)
大家在后臺(tái)添加好文章后,在剛打開的index.htm模板里輸入{dede:arclist}
<a href='[field:arcurl/]'>[field:title/]</a>
{/dede:arclist}
并保存
然后打開首頁就會(huì)看到前臺(tái)頁面中已經(jīng)輸出了幾個(gè)標(biāo)題(默認(rèn)是10個(gè)標(biāo)題)
現(xiàn)在開始講解arclist標(biāo)簽的參數(shù)應(yīng)用。
1,col。這個(gè)是關(guān)于調(diào)用出來的標(biāo)題分為幾列的
具體應(yīng)用:
{dede:arclist col=2}
dedecms模板|dede仿站|dede模板制作|dede防站-Dede之家-www.2d30.cn
<a href='[field:arcurl/]'>[field:title/]</a> <br />
{/dede:arclist}
這里我們?cè)O(shè)置col=2
也就是說設(shè)置為2列
同時(shí)細(xì)心的朋友也發(fā)現(xiàn)了還多了個(gè) <br />
這是html里的東西,表示換行,是為了更好的區(qū)別輸出的內(nèi)容。
保存后并刷新首頁
這時(shí)在首頁就會(huì)顯示2列,每列為5行的標(biāo)題輸出
2,row參數(shù),row是表示一共輸出多少個(gè)標(biāo)題。
應(yīng)用:
{dede:arclist row=8}
<li><a href='[field:arcurl/]'>[field:title/]</a> </li>
{/dede:arclist}
我們?cè)O(shè)置為row=8
保存并刷新首頁
dedecms模板|dede仿站|dede模板制作|dede防站-Dede之家-www.2d30.cn 我們看到了不是原來的10個(gè)標(biāo)題而是變成了8個(gè)標(biāo)題,也就是說row參數(shù)已經(jīng)起到作用了。這就是row的應(yīng)用
同時(shí)我們可以把8改成20
這時(shí)就變成20了個(gè)標(biāo)題了
我們?cè)偌由锨懊嬷v的col
{dede:arclist row=20 col=2}
<li><a href='[field:arcurl/]'>[field:title/]</a> </li>
{/dede:arclist}
變成了2列 并每列10個(gè)標(biāo)題的樣式
dedecms模板|dede仿站|dede模板制作|dede防站-Dede之家-www.2d30.cn
3,typeid,這個(gè)參數(shù)是指定某個(gè)欄目調(diào)用文章標(biāo)題
就是我們?cè)诤笈_(tái)看到的
這里的ID:6就是typeid
這個(gè)通過后臺(tái)--核心--網(wǎng)站欄目管理,右側(cè)的欄目列表可以查看到。
效果為:
(這里大家看到的效果不明顯
因?yàn)槲以诒镜鼐吞砑恿艘粋€(gè)欄目的文章
大家在測試的時(shí)候多添加幾個(gè)欄目的文章就會(huì)很明顯的看到效果了)
4,titlelen ,這個(gè)參數(shù)是說明調(diào)用文章標(biāo)題的字?jǐn)?shù)。
dedecms模板|dede仿站|dede模板制作|dede防站-Dede之家-www.2d30.cn 標(biāo)簽應(yīng)用:
{dede:arclist row=20 col=2 typeid=7 titlelen=10}
<li><a href='[field:arcurl/]'>[field:title/]</a> </li>
{/dede:arclist}
我們看到這里設(shè)置了titlelen=10,那么就是說這次調(diào)用的標(biāo)題字?jǐn)?shù)為5個(gè),
有些人會(huì)奇怪明明是寫著10為什么會(huì)輸出5個(gè)字呢。因?yàn)?個(gè)字節(jié)為1漢字,所以就是5個(gè)漢字。
要看出變化就要添加不同標(biāo)題的文章
我們看到輸出的標(biāo)題字?jǐn)?shù)為5個(gè)漢字了
5.orderby 排序方式參數(shù)
排序方式大致分為
1,按點(diǎn)擊數(shù)(orderby='hot' 或 orderby='click'),也就是大家在有些網(wǎng)站上看到的熱門文章
2,按出版時(shí)間(orderby='sortrank' 或 orderby='pubdate' )
dedecms模板|dede仿站|dede模板制作|dede防站-Dede之家-www.2d30.cn
3,按最后出現(xiàn)評(píng)論的時(shí)間排序 orderby=='lastpost'
4,按得分 orderby=='scores'
5,按文章ID排序 orderby='id'
6, 隨機(jī)文檔列表 orderby='rand' 也就是大家在有些網(wǎng)站看到隨機(jī)推薦
{dede:arclist row=20 col=2 typeid=7 titlelen=20 orderby='hot' }
<li><a href='[field:arcurl/]'>[field:title/]</a> </li>
{/dede:arclist}
這時(shí)一個(gè)熱門文章的例子,其它排序方式只要修改hot就可以了
前臺(tái)效果
6.摘要調(diào)用參數(shù):[field:info/] 應(yīng)用方法
{dede:arclist row=1 col=2 typeid=7 titlelen=20 orderby='hot' }
<li><a href='[field:arcurl/]'>[field:title/]</a> </li>
dedecms模板|dede仿站|dede模板制作|dede防站-Dede之家-www.2d30.cn <p>[field:info/]</p>
{/dede:arclist}
上面給出的是一個(gè)關(guān)于欄目ID為7,標(biāo)題字?jǐn)?shù)為10個(gè)漢字并且是1條熱門的標(biāo)題帶摘要的調(diào)用方法。
這里col=2不起作用,因?yàn)橹挥姓{(diào)用一個(gè)標(biāo)題。
那么有人就要說了,這個(gè)摘要太長了,我不需要那么長的摘要怎么辦呢?
這里我們有個(gè)參數(shù)是控制摘要字?jǐn)?shù)的。
“infolen=”這就是控制摘要字?jǐn)?shù)的。
應(yīng)用
{dede:arclist row=1 typeid=7 titlelen=20 orderby='hot' infolen='60' }
<li><a href='[field:arcurl/]'>[field:title/]</a> </li>
<p>[field:info/]</p>
{/dede:arclist}
我們發(fā)現(xiàn)這次調(diào)用出來的摘要字?jǐn)?shù)在30漢字,默認(rèn)dede的摘要長度為250個(gè)字節(jié),也就是125個(gè)字節(jié)。
dedecms模板|dede仿站|dede模板制作|dede防站-Dede之家-www.2d30.cn
7.下面講怎么調(diào)用帶縮略圖的效果[field:image/]
也就是這種效果
標(biāo)題加縮略圖加摘要。
標(biāo)簽寫法:
{dede:arclist row=1 type='image.' imgwidth='124' imgheight='94' }
<li><a href='[field:arcurl/]'>[field:title/]</a> </li>
<p>[field:image/][field:info/]</p>
{/dede:arclist}
大家看到這arclist里多出了 type='image.' imgwidth='124' imgheight='94'這3個(gè)參數(shù)。他們分別說明這個(gè)標(biāo)簽調(diào)用的內(nèi)容必須是有縮略圖的,而且寬是124px 高是94的縮略圖。
[field:image/]這個(gè)就是調(diào)用縮略圖的參數(shù)
8.flag 自定義屬性的應(yīng)用。
大家后臺(tái)添加文章的時(shí)候會(huì)看到