discuz論壇DIY功能教程.docx

《discuz論壇DIY功能教程.docx》由會(huì)員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在教育資源-天天文庫。

1、DIY功能主要是利用頁面拖拽技術(shù)，在不編寫代碼的情況下實(shí)現(xiàn)快速布局頁面、聚合調(diào)用站內(nèi)數(shù)據(jù)的功能。下面我們來看如何使用DIY功能以及如何美化DIY的數(shù)據(jù)模塊?；綝IY流程1.以管理員身份登錄網(wǎng)站前臺(tái)，點(diǎn)擊頭部右上方“DIY”按鈕，進(jìn)入DIY模式：2.進(jìn)入DIY模式后，頁面中內(nèi)置的可DIY區(qū)域（模板標(biāo)簽中已經(jīng)講過）將會(huì)以灰藍(lán)色顯示：(1)首先，要選擇合適的框架，點(diǎn)擊?框架?來選擇合適的框架拖拽到所需位置：(2)然后，點(diǎn)擊?模塊?，來選擇合適的模塊，拖拽到框架中，拖拽進(jìn)去后，頁面便會(huì)彈出編輯模塊屬性窗口，如下圖所示：根據(jù)所需要調(diào)用的數(shù)據(jù)類型設(shè)置各屬性即可。

2、修改模塊頁面顯示樣式1.如何在模塊中增加“標(biāo)題”及“更多”的鏈接如下圖樣式方法：通過框架或模塊都可以實(shí)現(xiàn)上述樣式，我們以框架為例，我們在DIY的時(shí)候選中要編輯的框架點(diǎn)擊編輯如下圖所示：之后點(diǎn)擊標(biāo)題在彈出的層中可以添加標(biāo)題及鏈接,位置選擇居左如下圖所示，同時(shí)可以設(shè)置標(biāo)題的顏色及大小接下來增加“更多”的鏈接點(diǎn)擊彈出層的添加新標(biāo)題按扭如下圖所示，會(huì)“復(fù)制”出一份新的標(biāo)題你只需修改就可以了把其中的“精彩教程”改成“更多”，鏈接以及字體、顏色都進(jìn)行修改就可以了，這里的位置一定要選擇“居右”完成，這樣框架就有了標(biāo)題及更多，模塊的方法同上1.DIY的模塊中如何調(diào)整鏈

3、接的顏色?如下圖樣式方法：選中要修改的模塊，點(diǎn)擊編輯，選擇?數(shù)據(jù)?如下圖所示：在彈出層中選擇?編輯?如下圖所示：在彈出的層中可以對標(biāo)題進(jìn)行加粗、斜體、加下劃線、修改顏色等操作1.如何在現(xiàn)有的模塊中添加新的數(shù)據(jù)選中要添加數(shù)據(jù)的模塊點(diǎn)擊編輯--數(shù)據(jù)?如下圖所示：在彈出的層中選擇任意一條數(shù)據(jù)點(diǎn)擊編輯如下圖所示：點(diǎn)擊編輯后在彈出的層中選擇從數(shù)據(jù)源獲取此處可以添寫帖子ID、文章ID、日志ID、圖片ID來獲取數(shù)據(jù)如下圖所示：?點(diǎn)擊獲取會(huì)填充模塊內(nèi)相應(yīng)的數(shù)據(jù)字段（此處的數(shù)據(jù)字段會(huì)根據(jù)模塊樣式的不同有所變化，請注意）完成。1.DIY時(shí)如何調(diào)用外部程序的數(shù)據(jù),當(dāng)我們與第

4、三方程序整合后如何在門戶、頻道、論壇、或可以DIY的區(qū)域調(diào)用這些第三方程序的數(shù)據(jù),首先我們可以在需要調(diào)用的地方拖一個(gè)展示類中的靜態(tài)模塊如下圖所示：如上圖所示選擇數(shù)據(jù)來源為“自定義HTML”一般第三方系統(tǒng)的數(shù)據(jù)調(diào)用都會(huì)有輸出JS格式的我們把第三方程序提供的JS代碼粘貼進(jìn)HTML代碼框就可以了，如下圖所示：完成。1.首頁多格或首頁四格如何DIY出來,我們以論壇首頁為例（在任何頁面都可以）來制作一個(gè)首頁四格。首先在論壇首頁拖一個(gè)1:1的框架如下圖所示：接下來向已拖好的1-1框架的框架里左側(cè)的1里面拖入一個(gè)1:1的框架如下圖所示：接下來向右側(cè)的1-1里面也拖入

5、一個(gè)1:1的框架，如下圖所示：接下來我們就可以通過拖拽模塊到框架中去了此時(shí)我們可以去掉框架的標(biāo)題，同時(shí)為每一個(gè)模塊增加一個(gè)標(biāo)題如下圖所示：你可以通過不同的模塊樣式或者CSS來美化這里。1.如何修改整個(gè)模塊的鏈接樣式比如下圖方法：選中要編輯的模塊，點(diǎn)擊編輯--樣式進(jìn)行修改如下圖所示：以上修改針對整個(gè)模塊完成。1.如何修改兩個(gè)模塊或兩個(gè)框架之間的距離如下圖樣式選擇要編輯的框架或者模塊，點(diǎn)擊編輯--樣式選擇外邊距，勾選分別設(shè)置，在右邊距中寫入合適的數(shù)字就可以了例如如下圖所示：完成后的效果如下圖樣式完成。1.DIY中TAB框架如果切換點(diǎn)擊方式（鼠標(biāo)點(diǎn)擊與鼠標(biāo)滑

6、過）實(shí)現(xiàn)方法：拖一個(gè)TAB框架到頁面中，點(diǎn)編輯，選擇標(biāo)題如下圖所示：在彈出的窗口中選擇切換類型如下圖所示：你可以根據(jù)你的需要選擇是點(diǎn)擊還是滑過即可完成。1.在DIY模塊中的模塊數(shù)據(jù)中固定是什么意思，如下圖解答：當(dāng)勾選固定后此條數(shù)據(jù)將不會(huì)隨著模塊屬性當(dāng)中的條件進(jìn)行更新，也就是說，此條數(shù)據(jù)將永久不變，除非把勾選去掉1.如何實(shí)現(xiàn)兩個(gè)模塊中間一條豎線的效果，如下圖效果實(shí)現(xiàn)方法：選中要操作的DIY模塊選擇樣式如下圖所示：在彈出的層中，選擇邊框的分別設(shè)置，在邊框的“左”大小設(shè)置為1px，“樣式”選擇實(shí)線，“顏色”選擇灰色，如下圖所示：這樣設(shè)置后我們就能看到一個(gè)邊線

7、了這時(shí)你會(huì)看到內(nèi)容與邊線擠在了一起如下圖所示：接下來我們進(jìn)行調(diào)整內(nèi)邊距改變上圖中的樣式同理，打開樣式編輯層選擇“內(nèi)邊距”點(diǎn)分別設(shè)置在“左”中添加10px調(diào)整后如下圖所示：?大家可以根據(jù)實(shí)際情況調(diào)整內(nèi)、外邊距的大小與邊框的設(shè)置，靈活使用1.如何將一個(gè)文章模塊轉(zhuǎn)換為一個(gè)帖子模塊,比如官方提供的門戶及頻道都是文章類模塊，我們?nèi)绾无D(zhuǎn)換為帖子類,編輯模塊的屬性把其中的模塊分類進(jìn)行切換如下圖所示：選擇帖子模塊就可以變換?這里要注意?切換之后，原來的模塊樣式將變成私有的（自定義樣式）修改顯示樣式只能通過模塊模板進(jìn)行修改1.如何在模板（官方發(fā)布的頻道及門戶）里面插入D

8、IY區(qū)域，如下圖所示：首先打開模板文件例如親子模板，打開templatedefaultpo