編輯“JspRun!模板制作新手篇”

<span style="text-align:center; border:1px solid #000; float:right; padding:6px;"><strong>導(dǎo)航:</strong> [[JspRun!|上一頁]]</span>
<div style="clear:both;"></div>

==概要==
[[JspRun!]]的[[模板]]機(jī)制由兩個(gè)主要部分組成：一是模板套系，二是界面方案。

其中，模板套系是論壇風(fēng)格的根本，是論壇的界面布局，其相關(guān)的頁面文件都存放論壇目錄下的templates/default文件夾中。進(jìn)入templates/default文件夾我們可以看到其中有很多的以.jsp為后綴的[[jsp]]文件，這些文件就是JspRun!所有頁面的模板。我們要定制自己的模板都需要修改templates/default文件夾中的jsp文件。

而界面方案就是論壇風(fēng)格的血肉，一個(gè)[[論壇]]可以包含多個(gè)界面方案。其中每個(gè)界面方案規(guī)定了自己的方案名稱，指定了自己所使用的模板套系、界面圖片所在目錄、Smilies（表情） 圖片所在目錄，以及設(shè)定頁面的字體，表格，顏色等顯示效果。

==制作==
*認(rèn)識(shí)JspRun!后臺(tái)的模板設(shè)置 

首先進(jìn)入后臺(tái)，在頂部導(dǎo)航條里點(diǎn)擊論壇設(shè)置，可以在左邊導(dǎo)航欄看到界面風(fēng)格和模板編輯兩個(gè)選項(xiàng)。

*修改默認(rèn)風(fēng)格 
首先我們來認(rèn)識(shí)一下風(fēng)格配色的相關(guān)知識(shí)。點(diǎn)擊默認(rèn)風(fēng)格后的詳情，進(jìn)入默認(rèn)風(fēng)格的配色頁面。如圖所示：

[[Image:Jsprun040401.gif]]

這部分一共分為五部分：界面方案信息、文字及顏色配置、表格與背景色配置、其它顏色配置和變量添加。

*界面方案信息

如圖所示

[[Image:Jsprun040402.gif]]

首先填入自己的風(fēng)格名稱，你可以隨意寫，這個(gè)名稱會(huì)顯示在首頁下部的界面風(fēng)格里邊。

匹配模板，這個(gè)選擇你要匹配的模板套系。這個(gè)很重要的哦，千萬別選錯(cuò)了，否則就達(dá)不到自己的效果了哦。

默認(rèn)表情分類，這個(gè)是選擇在此款風(fēng)格下，默認(rèn)顯示在發(fā)帖框旁邊的表情是哪一套。

論壇[[logo]]，這個(gè)就是論壇頂部的logo，填入logo的地址即可，當(dāng)然也可以填入[[flash]]地址的。

界面圖片目錄，這個(gè)也很重要哦，千萬不要寫錯(cuò)了自己模板圖片所在的文件夾，否則就達(dá)不到效果了哦。


*文字及顏色配置

如圖所示：

[[Image:Jsprun040403.gif]]

正常字體設(shè)置，這個(gè)設(shè)置頁面的字體類型，比如Arial,”宋體”等等。

正常字號(hào)設(shè)置，就是設(shè)置頁面的普通字體的大小，也就是說當(dāng)沒有特殊定義的時(shí)候，字體大小就顯示為這里定義的大小。

帖子內(nèi)容字號(hào)設(shè)置，這里是設(shè)置帖子內(nèi)的文字大小。

帖子內(nèi)容大字號(hào)設(shè)置，這里是設(shè)置當(dāng)用戶點(diǎn)擊帖子內(nèi)的“大”后顯示的字體大小。

帖子內(nèi)容小字號(hào)設(shè)置，這里是設(shè)置當(dāng)用戶點(diǎn)擊帖子內(nèi)的“小”后顯示的字體大小。

小號(hào)字體設(shè)置，這里是設(shè)置當(dāng)定義為小號(hào)字體時(shí)使用的字體類型。

小號(hào)字號(hào)設(shè)置，這里是設(shè)置當(dāng)定義為小號(hào)字體時(shí)所使用的字體大小。

內(nèi)表格超級(jí)鏈接文字顏色，這里是設(shè)置在內(nèi)表格內(nèi)的超鏈接文字的顏色。

高亮鏈接顏色，定義一些特殊的鏈接顏色，如圖所示：

[[Image:Dz329.gif]]

內(nèi)表頭文字顏色，就是分類論壇的名稱顏色。

內(nèi)表格中文字顏色，就是內(nèi)表格中的普通文字顏色，如圖所示：

[[Image:Jsprun040404.gif]]

淺色文字顏色，就是對(duì)一些文字的特殊定義，比如版塊簡(jiǎn)介等等。

*表格以及背景顏色設(shè)置

如圖所示：

[[Image:Jsprun040405.gif]]

外表格寬度，這個(gè)是大部分頁面的寬度，大概從頁面的頂部到頁面的底部上方的寬度。

主表格邊緣空隙，內(nèi)外表格的間隔。

主表格背景，就是主表格的背景顏色。

主表格邊框?qū)挾?，就是上邊那個(gè)表格邊框的寬度。

主表格外邊框顏色，就是上邊那個(gè)表格最外邊的邊框的顏色。

頁面背景，這個(gè)很好理解把，就是整個(gè)頁面的背景。

內(nèi)表頭背景顏色，就是分類論壇文字所在的地方。

欄目背景顏色，就是內(nèi)表頭下邊的那一行顏色。

欄目邊框色，就是上邊的那一欄的邊框顏色。

聚合版塊背景顏色，這包括幾處，有下拉菜單的背景、廣告的背景、標(biāo)簽的背景、聯(lián)盟論壇和在線列表的背景，這幾處使用的都是聚合背景的顏色。

內(nèi)表格背景配色1，這個(gè)就是當(dāng)鼠標(biāo)移動(dòng)到版塊或者主題上表格背景的顏色。底部的背景也是這個(gè)哦。

內(nèi)表格背景配色2，這個(gè)就是版塊的背景色以及主題的背景色。

內(nèi)表格邊框色，就是上邊那個(gè)表格的邊框顏色。

提示信息背景顏色，如圖所示：

[[Image:Jsprun040406.gif]]

提示信息邊框顏色，就是上邊那個(gè)邊框顏色。

提示信息文字顏色，就是上邊那個(gè)文字顏色。

通用區(qū)域邊框顏色，就是區(qū)域之間的線條顏色。

版塊間距，這個(gè)就是各分類版塊之間的距離。

*其他顏色設(shè)置

如圖所示：

[[Image:Jsprun040407.gif]]

輸入框邊框顏色，這個(gè)就是輸入框，比如發(fā)帖時(shí)的標(biāo)題框、登陸時(shí)的用戶名，密碼框等等的邊框顏色。

頂部菜單欄背景，就是頂部的橫向菜單背景顏色，如圖所示：

[[Image:Jsprun040408.gif]]

頂部菜單欄文字顏色，就是上圖中的文字顏色。

左右分欄背景顏色，就是啟用左分欄的時(shí)候，左邊的背景顏色。

*變量添加

如圖所示

[[Image:Jsprun040409.gif]]











[[Category:JspRun!|J]]