JspRun!模板制作新手篇

導(dǎo)航: 上一頁

概要

JspRun!的模板機制由兩個主要部分組成：一是模板套系，二是界面方案。

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

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

制作

• 認(rèn)識JspRun!后臺的模板設(shè)置

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

• 修改默認(rèn)風(fēng)格

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

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

• 界面方案信息

如圖所示

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

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

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

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

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

• 文字及顏色配置

如圖所示：

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

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

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

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

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

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

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

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

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

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

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

淺色文字顏色，就是對一些文字的特殊定義，比如版塊簡介等等。

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

如圖所示：

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

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

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

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

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

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

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

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

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

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

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

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

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

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

提示信息邊框顏色，就是上邊那個邊框顏色。

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

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

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

• 其他顏色設(shè)置

如圖所示：

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

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

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

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

• 變量添加

如圖所示