1. 程式人生 > >JEECMS站群管理系統-- 標籤使用和模板的製作

JEECMS站群管理系統-- 標籤使用和模板的製作

1模板規劃

1.1資原始檔

資原始檔就是網頁中用到的圖片、CSS、JS等元素,在CMS系統中所有的資原始檔在網站的根目錄中的

/res_base/所屬網站定義資源目錄/TEMPLEATE/WEB

/res_base/所屬網站定義資源目錄/TEMPLEATE/WAP

解釋:網站定義資源

在CMS系統中可以同時管理多個網站,也就是多個網站可以同時使用一套CMS系統,但是每一個網站都已屬於自己獨立的資原始檔及模板檔案目錄。

1.2模板檔案

定義了頁面顯示的主體框架,它的位置位於網站根目錄下的/WEB_INF/user_base/所屬網站模板目錄;

模板規則:

1、以index字首命名的為首頁模板

2、以channel字首命名的為欄目模板

3、以content字首命名的為內容模板

4、以alone字首命名的為欄目單頁模板

1.3使用方式

1、使用dw建立站點

2、將網頁中用到的資原始檔分類分別放置到網站相關資源目錄中

3、將模板檔案放置按照命名規則分別放置到網站相關模板目錄中。

4、將頭部、底部等等具有通用元素的模板檔案放置到模板目錄中的include目錄中

5、將模板檔案中所有資源引用改為絕對路徑連結至資源目錄中

6、在欄目管理中將模板檔案與欄目進行關聯設定

7、在模板檔案中需要提取資料的位置放置相應的標籤

1.4標籤呼叫樣式

呼叫"JEECMS標籤"的三種程式碼樣式如下:
  A、${標籤名稱}
  B、[@cms.標籤名稱 屬性='值'/]
  C、[@cms.標籤名稱 屬性='值'; 標籤別名] 自定義樣式模板 [/@cms.標籤名稱]
  例如:


a、${web.name}標籤用於呼叫網站名稱
b、[@cms.ArtiList chnlId='' count='10' sysContent='1-1' /]標籤用於呼叫          10篇文章的列表

C、[@cms.ChnlList id='' inner='1';c]|<a href=="${c.url}">>${c.name}</a> [/@cms.ChnlList]標籤用於呼叫欄目列表,可用於網站導航條。
  注意:abc例項是與上面ABC三種形式相對應的。大家可以逐個測試,舉一反三

2  Include標籤

2.1功能簡介

做過網站設計經驗的朋友可能都知道,我們可以將頁面中經常要引用的公共部分(比如頁頭和頁尾)獨立開來,單獨存放在一個頁面中。這樣做的好處就是可以在各個需要用到該部分的頁面中用一個簡單的包含語句就能把它引入進來,大大簡化了工作量。

2.2標記說明

【標籤名】:[@cms.Include 屬性='值' /]

【作 用】:包含公用頁面(如頁頭,頁尾)

【參 數】:

name:包含模板的檔名

solution:模板方案名

【示 例】:

包含頁頭:[@cms.Include name='head.html' solution='default'/]

【備 注】:呼叫此標籤前必須先建立相應的包含模板

2.3 明確標籤的使用範圍

  我們在使用任何標籤的之前,都必須明確其使用的範圍,否則可能無法正常使用該標籤。

  【Include 標籤】的使用範圍是:首頁模板,欄目頁模板,內容頁模板,即對應\WEB-INF\user_base\jeecms_com_www\template\article\default\資料夾下的index_××.html模板、channel_××.html模板、content_××.html模板

2.4除錯標籤瞭解其使用方法

  在使用【Include 標籤】之前我們必須保證有可供此標籤呼叫的包含模板,本例項只是起演示作用,為方便起見,這裡就不再另外建立被包含的模板了,標籤呼叫的是系統預設模板方案中的的head.html模板。

登入JEECMS後臺,進入“模板管理->template->article->default”,點選修改開始時建立的index_demo.html模板(如果沒有此模板則按照本文開頭的說明建立),進入模板程式碼模式,填寫如下標籤程式碼(為了演示效果美觀,本處程式碼中加入了css,可去除):

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Include標籤測試</title>
<link href="${sysResRoot}/front.css" type="text/css" rel="stylesheet" />
<link href="${root}/default/article/css/whole.css" type="text/css" rel="stylesheet" />
<link href="${root}/default/article/css/layout.css" type="text/css" rel="stylesheet" />
</head>

<body>
[@cms.Include name='head.html' solution='default'/]
</body>
</html>

  點儲存按鈕,然後返回前臺站點首頁重新整理,得到如下效果:

 

3 ArtiList標籤

3.1功能簡介

【ArtiList 標籤】在CMS中使用的頻率可以說是最高的,通過這個標籤,你不僅可以得到一個文章列表,而且可以通過不同的引數組合得到不同的顯示效果。比如文章圖文列表、文字或圖片跑馬燈、文字或圖片上下迴圈滾動等等。

使用方式:

[@cms.ArtiList chnlId='' count='5' sysContent='1-1' titLen='25' lineHeight='1' dateFormat='4' datePosition='2' headMark='2' target='1'/]

3.2標記說明

【標籤名】:[@cms. ArtiList 屬性='值' /]
【作 用】:獲取文章列表資料

【參 數】:

屬性名稱

屬性說明

預設值

可選值

chnlId

欄目ID,欄目頁中可不設定,系統會自動獲取當前欄目ID

當前欄目ID

空:顯示全站文章列表;
欄目ID:指定欄目文章

attr

文章屬性ID

1:普通   2:圖文
3:焦點   4:頭條   
5:滾動

sysContent

列表顯示方式

1-1

1-1:普通標題列表 
1-2:圖文列表
2-1:標題列表翻滾
2-2:圖文列表翻滾
3-1:焦點圖

orderBy

排序方式

0

0:釋出時間降序;
1:釋出時間升序;
2:固頂降序;
3:置頂降序;
4:日點選降序;
5:周點選降序;
6:月點選降序;
7:季點選降序;
8:年點選降序;
9:總點選降序

recommend

是否推薦

0

0:所有文章 
1:推薦文章

titLen

標題長度

20

自定義

target

連結開啟目標

0

0:原視窗開啟 
1:新視窗開啟

headMark

文章標題圖示

0

0:無圖示 
1:黑色小圓點 
2:紅色小圓點 
3:藍色單箭頭 
4:藍色雙箭頭 
自定義圖示:填寫圖示路

lineHeight

文章列表每行的行高

自定義

bottomLine

每行標題下是否帶下劃分隔線

0

0:無分隔線 
1:預設分隔線

自定義樣式:css中定義的樣式名稱

ctgForm

文章類別形式

0

0:不顯示文章類別
1:顯示欄目類別
2:顯示站點名稱

ctgClass

文章類別的css-class

自定義css樣式的class名

dateFormat

文章釋出日期顯示格式

0

0:不顯示日期 
1:”年-月-日 時-分-秒” 格式 
2:”年-月-日” 格式 
3:”月-日 時-分” 格式 
4:”月-日” 格式

datePosition

日期排列位置

1

1:緊跟標題之後 
2:右對齊 
3:左對齊

isPage

是否顯示分頁

0

0:否;1:是

count

每頁列表顯示數量

20

自定義

cssStyle

連線的樣式

自定義

僅當sysContent='1-2'(圖文列表)時,以下標籤屬性才有效

picWidth

按百分比顯示圖片寬度

25(即每個圖片佔總寬度的25%,每行可放四張圖片)

自定義

picHeight

每行圖片顯示高度

110

自定義

僅當sysContent='3-×'(焦點圖)時,以下標籤屬性才有效

flashWidth

焦點圖寬度

296(px)

自定義

flashHeight

焦點圖總高度

200(px)

自定義

textHeight

焦點圖文字高度

20(px)

自定義

僅當sysContent='2-×'(特效顯示)時,以下標籤屬性才有效

rollDisplayHeight

顯示區高度

28

自定義

rollLineHeight

行高

28

自定義

rollCols

列數(一行中包含幾列)

1

自定義

rollSpeed

滾動速度,值越小越快,最小為1

1

自定義

isSleep

是否停頓

1

0:不停頓; 
1:停頓

rollSleepTime

停頓時間,值越大停頓越久

50

自定義

rollCount

一次滾動的行數

1

自定義

rollSpan

一次滾動的畫素

1

自定義

其它高階標籤屬性(用於使用者個性設定)

searchKey

在標題、tags和描述中搜索指定關鍵字的文章列表,用於搜尋頁模板

自定義關鍵字

style

標籤內部樣式,如果指定sysContent或userContent,則該項無效

1

1:普通列表

sysTpl

指定系統模板

1

自定義

sysContent

系統內容樣式

0

自定義

userContent

使用者內容樣式,當sysContent=1時有效

自定義

sysPage

系統分頁樣式

0

自定義

userPage

使用者分頁樣式,當sysPage=1時有效

自定義

upSolution

指定其它模板方案樣式

自定義

upWebRes

指定其它站點樣式

自定義

pageClass

分頁欄css樣式的class名稱

自定義

pageStyle

分頁欄css自定義style樣式

自定義

3.3 明確標籤使用範圍

  我們在使用任何標籤的之前,都必須明確其使用的範圍,否則可能無法正常使用該標籤。

【ArtiList 標籤】的使用範圍是:首頁模板,欄目頁模板,內容頁模板,即對應\WEB-INF\user_base\jeecms_com_www\template\article\default\資料夾下的index_××.html模板、channel_××.html模板、content_××.html模板

3.4 除錯標籤瞭解其使用方法

  登入JEECMS後臺,進入“模板管理->template->article->default”,點選修改開始時建立的index_demo.html模板(如果沒有此模板則按照本文開頭的說明建立),在模板內容處填寫如下標籤程式碼(為了演示效果美觀,本處程式碼中引入了系統預設css,可去除):(1).文章列表

<link href="${sysResRoot}/front.css" type="text/css" rel="stylesheet" />
[@cms.ArtiList chnlId='' count='5' sysContent='1-1' titLen='25' lineHeight='1' dateFormat='4' datePosition='2' headMark='2 target='1'/]

 點儲存按鈕,然後返回前臺站點首頁重新整理,得到如下效果:

 

(2).圖文列表

<link href="${sysResRoot}/front.css" type="text/css" rel="stylesheet/>
[@cms.ArtiList chnlId='' attr='2' count='5' sysContent='1-2' titLen='25' target='1' picWidth='25' picHeight='110'/]

  點儲存按鈕,然後返回前臺站點首頁重新整理,得到如下效果:

 

4 Position標籤

4.1功能簡介

在網站頁面中我們經常要顯示當前頁面的位置,例如:當前位置:首頁 > 無線城市> 城市要聞 > 正文。在CMS標籤中提供了一個顯示頁面的當前位置呼叫標籤,只需將該標籤放到頁面的相應地方,設定好呼叫引數即可,簡單方便。

4.2標記說明

【標籤名】:[@cms.Position 屬性='值' /]
【作 用】:顯示頁面的當前位置
 【參 數】:
  homepage —-首頁顯示方式。【1:站點簡稱;自定義】(預設:首頁)
  title ---內容頁顯示方式。【0:不顯示;1:顯示內容標題;自定義】(預設:正文)
  split ---分割符號。(預設:“>”)
  target ---是否原視窗開啟。【0:原視窗開啟;1:新視窗開啟】(預設:原視窗開啟)
  class ---連結外部樣式,等同於html中的class屬性
  style ---自定義標籤樣式,等同於html中的style屬性
 【示 例】:
  [@cms.Position homepage='1' split='|' target='1' style='color:#f00'/]
 最終效果:

 

5 ChnlList標籤

5.1功能簡介

在頁面中獲取欄目列表的時候我們要用到[@cms.ChnlList /]標籤,本標籤不僅可以單獨使用,還可以配合其它標籤使用,達到更加豐富的效果。

5.2標記說明

【標籤名】:[@cms.ChnlList 屬性='值' /]
【作 用】:顯示各欄目列表
【參 數】:

屬性名稱

屬性說明

預設值

可選值

id

父欄目ID

預設為空:自動獲取當前欄目ID

空:當前欄目ID;

欄目ID:指定父欄目id

orderBy

排序方式

0

0:優先順序升序;

1:優先順序降序;

2:點選次數升序;3:點選次數降序

isDisplay

是否只獲取顯示的欄目

1

0:獲取所有;

1:只獲取顯示的欄目

hasContent

是否只獲取可以有內容的欄目

0

0:獲取所有;

1:只獲取可以有內容的欄目

linkClass

連結class樣式

linkTarget

連結開啟方式

0

0:當前視窗;

1:新視窗

sysPage

系統分頁樣式

0

0:不分頁;

1:樣式一;

2:樣式二

userPage

自定義分頁樣式。如果指定了系統分頁樣式,則該項無效

0

0:不分頁;

1:樣式一;

2:樣式二

5.3明確標籤的使用範圍

  我們在使用任何標籤的之前,都必須明確其使用的範圍,否則可能無法正常使用該標籤。 [@cms.ChnlList /]標籤的使用範圍是:首頁模板,欄目頁模板,即對應\WEB-INF\user_base\jeecms_com_www\template\article\default\資料夾下的index_××.html模板、channel_××.html模板

5.4除錯標籤瞭解其使用方法

1、單獨標籤呼叫示例: [@cms.ChnlList/]

 

2、自定義標籤呼叫示例:
   [@cms.ChnlList id='' inner='1';c,i] 
    <a href="${c.url}">${c.name}</a>[#if (i+1)%2==0]<br/>[/#if] 
   [/@cms.ChnlList]