dz模板製作
1. 如何進行DZ論壇的二次開發,以及模板製作,謝謝,有視頻和文檔更好
我也是摸索了兩三個月才學會。。有幾個東西你從官方論壇里一定要找到
1、注冊個官方論壇賬號,必須得,要不然無法下載
2、你搜索一下discuz論壇變數表,這個也是開發必須得
3、discuz採用的是模板方式,所以php的smarty模板要學會,起碼要知道。
4、下載點別人的插件,研究研究,改一下。。
5、就是要有耐心,可以先從簽到等等開始開發,以後就熟悉了。
2. 想用discuz!模板製作一個論壇,需要多少錢
你給的地址都是Discuz官方免費提供的,不用花一分錢。
3. discuz 怎麼添加自定義模板
discuz 添加自定義模板的具體操作步驟如下:
我們需要准備的材料有:電腦、
1、首先我們先將這個模塊添加好,點擊「編輯」選項中「數據」。
4. discuz模板製作視頻教程或者仿站視頻教程
去discuz官方啊 有教程也有模板 還有高手幫你解答問題
5. discuz模板製作問題
Discuz!X3是Discuz!建站程序系列的最新版本,提供了易於DIY的環境,很多新人喜歡問:我看見了那麼多好看的模版,但是不符合我當前網站的需求,如何自己去DIY?
當然他們肯定去過官方論壇找教程,去看了那麼多文字以後依舊不知道如何去編輯。其實最快開始DIY模版的道路是下載一個符合你心目中要求的框架的模版。例如我喜歡PHPWIND那種導航條置頂的風格,我就去下載了一個導航條置頂的模版,在這基礎之上去DIY會相對容易一點。
首先我們需要了解的不是怎樣開始DIY,而是需要知道,這頁面是屬於HTML代碼製作的,HTML是一種標記語言,這就意味著你想加入什麼功能的時候就要去搜索相關的功能標記。要了解HTML是如何運作的,是如何展現樣式的,我們這里可以提供一個最基本的DIV代碼。
<divid="headerp"class="cssheader"style="background:#ccc">headerpic</div>
這個div會顯示headerpic這幾個字,這個div的標識符是headerp,其他代碼和程序可以通過這個表示符來訪問這個div;這個div引用了cssheader這個css樣式,並且除非cssheader裡面相關樣式(當前相關樣式:background)後面加上了!important重要標記,headerp這個div都會顯示background(背景)為色板十六進制代碼ccc的顏色(灰色)。
這里強調一下!important重要標記,在Discuz!裡面,有很多運用到!important標記的地方。其中最常用的地方就是DIY模塊,在DIY模塊裡面設定的邊距等等數據會被加上!important標記,出現這樣標記的時候除非有比這個!important更高級的!important聲明,否則你設定的其他同樣的樣式都會被這!important前面的語句蓋住。例:
<divid="headerp"class="cssheader"style="background:#ccc">headerpic</div>
.cssheader{background:#aaa!important;}
#headerp{background:#bbb;}
在這個案例中,由於css樣式.cssheader被添加了!important標記,所以即使element.style(background:#ccc)比.cssheader在樣式優先順序裡面更高級,background屬性也會使用.cssheader裡面加了!important的數據。
記住了這些以後讓我們來真正去DIY屬於自己的模版吧。
Discuz!X的模版位於 根目錄/template 文件夾裡面,在這裡面每一個文件夾都會被識別成一個新模版。如果你有想要安裝的模版,只需要把模版的整個文件夾復制到這個目錄然後進入後台-界面-風格設置裡面找到對應的模版然後安裝。安裝好以後勾選為默認模版以後提交即可。創建模版的時候我們需要把default(默認模版)文件夾裡面的discuz_style_default.xml復制到你的模版目錄/discuz_style_你的模版名.xml。然後安裝官方的模版xml去修改裡面的內容。
<?xmlversion="1.0"encoding="ISO-8859-1"?>
<root>
<itemid="Title"><![CDATA[Discuz!Style]]></item>
<itemid="Data">
<itemid="name"><![CDATA[默認風格]]></item>
<itemid="templateid"><![CDATA[1]]></item>
<itemid="tplname"><![CDATA[默認模板套系]]></item>
<itemid="directory"><![CDATA[./template/default]]></item>
<itemid="right"><![CDATA[康盛創想(北京)科技有限公司]]></item>
<itemid="style">
<itemid="smfont"><![CDATA[Arial]]></item>
<itemid="threadtitlefontsize"><![CDATA[14px]]></item>
<itemid="threadtitlefont"><![CDATA[Tahoma,'MicrosoftYahei','Simsun']]></item>
<itemid="smfontsize"><![CDATA[0.83em]]></item>
<itemid="tabletext"><![CDATA[#444]]></item>
<itemid="midtext"><![CDATA[#666]]></item>
<itemid="lighttext"><![CDATA[#999]]></item>
<itemid="link"><![CDATA[#333]]></item>
<itemid="highlightlink"><![CDATA[#369]]></item>
<itemid="noticetext"><![CDATA[#F26C4F]]></item>
<itemid="bgcolor"><![CDATA[#FFFbackground.pngrepeat-x00]]></item>
<itemid="msgfontsize"><![CDATA[14px]]></item>
<itemid="sidebgcolor"><![CDATA[vlineb.pngrepeat-y00]]></item>
<itemid="headerborder"><![CDATA[0]]></item>
<itemid="headerbgcolor"><![CDATA[]]></item>
<itemid="inputborderdarkcolor"><![CDATA[#848484]]></item>
<itemid="stypeid"><![CDATA[1]]></item>
<itemid="inputbg"><![CDATA[#FFF]]></item>
<itemid="commonborder"><![CDATA[#CDCDCD]]></item>
<itemid="commonbg"><![CDATA[#F2F2F2]]></item>
<itemid="specialborder"><![CDATA[#C2D5E3]]></item>
<itemid="specialbg"><![CDATA[#E5EDF2]]></item>
<itemid="dropmenuborder"><![CDATA[#DDD]]></item>
<itemid="floatmaskbgcolor"><![CDATA[#000]]></item>
<itemid="dropmenubgcolor"><![CDATA[#FEFEFE]]></item>
<itemid="floatbgcolor"><![CDATA[#FFF]]></item>
<itemid="lightlink"><![CDATA[#FFF]]></item>
<itemid="menuhoverbgcolor"><![CDATA[#005AB4nv_a.pngno-repeat50%-33px]]></item>
<itemid="titlebgcolor"><![CDATA[#E5EDF2titlebg.pngrepeat-x00]]></item>
<itemid="fontsize"><![CDATA[12px/1.5]]></item>
<itemid="font"><![CDATA[Tahoma,'MicrosoftYahei','Simsun']]></item>
<itemid="styleimgdir"><![CDATA[]]></item>
<itemid="imgdir"><![CDATA[]]></item>
<itemid="boardimg"><![CDATA[logo.png]]></item>
<itemid="available"><![CDATA[]]></item>
<itemid="headertext"><![CDATA[#444]]></item>
<itemid="footertext"><![CDATA[#666]]></item>
<itemid="menubgcolor"><![CDATA[#2B7ACDnv.pngno-repeat00]]></item>
<itemid="menutext"><![CDATA[#FFF]]></item>
<itemid="menuhovertext"><![CDATA[#FFF]]></item>
<itemid="wrapbg"><![CDATA[#FFF]]></item>
<itemid="wrapbordercolor"><![CDATA[#CCC]]></item>
<itemid="contentwidth"><![CDATA[630px]]></item>
<itemid="contentseparate"><![CDATA[#C2D5E3]]></item>
<itemid="inputborder"><![CDATA[#E0E0E0]]></item>
</item>
<itemid="version"><![CDATA[X3.1]]></item>
</item>
</root>
需要注意的是這里的Title值不能改,必須保持原樣才能夠被安裝和運行。version代表你這個模版能適用的Discuz!版本。可以用逗號分隔,例:
<itemid="version"><![CDATA[X2.5,X3.0,X3.1,X3.5]]></item>
templateid是模版的標識符,這個如果是本地模版的話直接刪掉這行即可。不然會識別錯誤。如果想自定義參數必須在style下面添加行。例如:
<itemid="diyxml"><![CDATA[diydiydiytext]]></item>
Discuz!的這個自定義的參數非常好用,在之後的內容裡面會被提及。
需要導入自定義模版的時候只需要在後台的界面-風格選項裡面上面有個導入標簽,點入以後會提示你一步一步導入你已經上傳的模版。你也可以直接在對應的模版設置裡面修改好參數然後到模版列表頁導出你自定義好的模版XML文件。
所謂製作模版就是復制官方文件到自己的模版文件夾裡面然後加以修改。
Discuz!額外提供了一些便利設置方便我們設置CSS樣式,那就是extend_。我們可以用添加這個
前綴的CSS來達到不替換原有CSS文件的情況下追加或者覆蓋原CSS內容。添加的位置就是根目錄/template/你的模版文件夾/common/extend_common.css。
要注意的是mole.css裡面的注釋能起到劃分區域的效果,優先順序比extend_common.css還要高,但是common.css裡面的!important依舊優先順序比沒有!important的mole.css的對應內容要高。例:
/**forum::viewthread,group::viewthread,forum::trade,forum::misc**/
.pls{background:rgba(0,0,0,0.03);border-right:none;width:200px;}
.ad.pls{background:#ffffff;}
.ad.plc{background:#ffffff;}
.pls.avatarimg{width:145px;padding:8px;background:#FFF;box-shadow:0px0px10pxrgba(0,0,0,0.2);}
.pls.avatar{text-align:center;}
.plsp,.pls.pil,.pls.o{margin:10px20px;text-align:center;}
.dvbg{background:#fff;}
/**end**/
這些代碼只在區域是forum::viewthread,group::viewthread,forum::trade和forum::misc生效。
<!--{templatecommon/header}-->
你在模版文件會看見這樣的注釋代碼,這代碼實際上能調用模版文件夾裡面的網頁文件,要求後綴是.htm,例如我在forum文件夾裡面添加了一個timeline.htm,那麼就可以添加如下代碼在響應位置調用timeline這個頁面
<!--{templateforum/timeline}-->
我們現在掌握了這些知識以後可以考慮開始初步為網站添加點料了。
我們都很喜歡在網站上面添加一個大大的圖片橫幅,當然不一定是廣告,也會喜歡添加一些美圖。這個時候我們需要自己定義一個div,而不是用導航條上面那片區域的背景圖片來解決。因為那會導致一些背景和插件色塊重疊,看起來不美觀。而且本例還要達成讓用戶來自定義這個背景圖片的效果。
這里我們就得說一下Discuz!一個很有意思的地方。在模版裡面,注釋的內容並不是沒用的,相反,注釋的內容是可以被當作是PHP代碼運行的。讓用戶自定義圖片,我們就需要調用cookie.在Discuz!裡面提供了一個調用COOKIE的一個標准方法:$_G['cookie']['cookiename'],這樣我們就能調用名為cookiename的cookie了。具體實現代碼如下(需要你有基本編程基礎):
在discuz.htm中第一段注釋下面添加:
<!--{ifisset($_G['cookie']['sttbg'])}-->
<divid="headerpic"class="headerpic"style="background:url($_G['cookie']['sttbg'])"></div>
<!--{else}-->
<divid="headerpic"class="headerpic"></div>
<!--{/if}-->
然後去DIY添加靜態模塊,選擇自定義HTML模版。添加如下代碼:
<ul>
<li>
<spanstyle="float:left">頂部圖片鏈接</span>
<formname="setdiyoptbg"onsubmit="setcookie('sttbg',setdiyoptbg.sttbg.value,60*60*24*30*12);">
<inputtype="text"name="sttbg"/>
<inputtype="submit"value="設置"/>
</form>
</li>
</ul>
然後在common文件夾內新建extend_common.css,添加如下代碼:
.headerpic{background:url({STYLEIMGDIR}/{HEADERBG})no-repeatright0transparent;background-size:cover;background-position:0%10%;height:220px;box-shadow:0015px#8f8f8f;}
最後在模版設置裡面的最下方添加自定義參數HEADERBG,內容指向想添加為默認頭部圖片的圖片文件地址。圖片文件前面添加了STYLEIMGDIR,這樣就可以直接把圖片放在模版文件夾裡面的擴展圖片文件夾里,不會搞亂格式。
至此,添加自定義內容的教程結束。
這個教學旨在去學會如何學習製作,而並不是學習製作方法,就是授人以魚不如授人以漁的意思。概念會比較泛,必須要自己去動手做才能理解。
我們很多時候不止要添加元素,還需要修改已有的元素。這個時候我們就需要開發者模式了,不然很多時候你會一頭霧水。這里推薦chrome和ie10以上的開發者模式,都支持頁面編輯,即時讓代碼生效。滿意了以後直接去修改對應文件即可,不過你要熟悉那部分的代碼,就如同上一步添加模塊一樣你需要知道所有代碼的意思,不然很可能導致失敗效果。
這里特殊說一下plugin介面,當你在修改元素的時候,可能會導致一些插件無法被正常使用,這個時候你就需要嘗試修改一下插件介面的位置。例如我把viewthread_node.htm裡面的用戶名移動到了頭像下方,這個時候某插件的橙名功能失效了,聯系插件作者無果以後決定自己親手來修改模版以達到適應插件的效果。
網頁跟我們平時所知道的順序閱讀載入方式有點不一樣,網頁的代碼只會讀取已經載入好的地方,所以介面不能放在程序代碼前面,經過分析插件源文件 ,我把那個介面放在了修改了以後的用戶名那段代碼的後面,成功修復了橙名不顯示的問題。代碼如下
<!--{if$_G['setting']['authoronleft']}-->
<divclass="anc">
<divclass="authi"><ahref="home.php?mod=space&uid=$post['authorid']"target="_blank"class="xw1"{if$post[groupcolor]}style="color:$post[groupcolor]"{/if}>$post[author]</a>$authorverifys</div>
</div>
<!--{/if}-->
<!--{hook/viewthread_profileside$postcount}-->
注意這裡面最後的hook注釋句,這就是Discuz插件的入口。通過移動它來調整插件載入的位置。
至此,我獨家的Discuz自定義模版教程編寫完畢。以上內容均為原創,曾經在類似的問題裡面發過,但是作者遲遲沒能回來採納,深感遺憾。
回第二個問題:在界面導航裡面去掉論壇的頂部導航,就是設置成不可用。然後在界面裡面把門戶選作主頁即可。雖然用戶仍舊能通過forum.php訪問論壇,但是這也是最簡單最可行的辦法
6. 我想問下自己製作DZ的模板是不是很難啊
首先要會html、css、jq或者js也可以,簡單修改模版的話工作量會小很多。祝樓主早日做出自己喜歡的模版。
7. 一個新手能開發DZ模板嗎開發DZ模板要學習哪些知識
學HTML CSS PHP 資料庫
8. 推薦個dz模板製作完整思路包括調用的教程
還是去dz的官方學習吧。太多了 ,一下子說不清楚。只能自己多 花時間泡論壇學習
9. Discuz中DIY模板,怎麼樣能做出這個效果
默認的那些模板是沒有這樣的效果的,你需要隨意先選擇一個帶圖片的模板,添加模塊成功以後修改模塊的模板才可以的。像這樣的效果需要自己去寫代碼以及對應的css才可以的!