DotNetNuke 7皮膚教程

我正在尋找一個體面的教程，爲DotNetNuke 7創建皮膚。我一直無法找到任何最新的dnn版本，儘管我已經有一些成功修改現有的皮膚，從頭開始構建它們會容易得多。DotNetNuke 7皮膚教程

有什麼建議嗎？

來源

2013-05-06 HuwD

不幸的是，對於DNN皮膚，教程很難通過 – 2013-05-06 13:25:00

我不知道你多久需要這個，但我會嘗試寫一個關於它的博客。 – Greg 2013-05-10 18:22:03

嘿..你有沒有發現任何有用的..我也需要從開始設計皮膚 – shashwat 2013-10-17 06:38:09

我不打算詳細說明，但我會定義一些關於DotNetNuke Skinning以及您可能遇到的一些潛在問題的關鍵元素。

皮膚可以用兩種方式之一寫，html或ascx。最常見的方式是通過ascx。

html：當你使用這個方法，你使皮膚內的任何更改將不會應用，直到DotNetNuke解析皮膚。當DotNetNuke這樣解析時，它會引用你的清單來正確解析所有顯示的值。
ascx：這種方式不需要解析，您所做的更改將立即生效。這使得操作更容易。但是，這仍然會包含一個清單來定義您的內容。現在

，想象DotNetNuke結構最簡單的方法就是通過Panes和Containers。本質上，Pane將始終包裝在Container內。

但是我如何設計皮膚？

需要注意的一些事項，DotNetNuke你往往沒有設計一個完全的網頁 - 你可以創建更加複雜的結構，可以用在更一般的意義上。例如：

因此，與上述的形象，你看到的一些關鍵元素，如：

標誌
搜索
登錄
菜單
橫幅
三個C ontent。
四個內容的分組。
另一塊內容。
頁腳也被四個分組。

所以基本上我們有一個相當簡單的數據結構。通常包括一些相當基礎的組織。但我的問題是，你如何解釋或移動設備或不同的頁面佈局，如：

Social Profile

現在你有一個稍微複雜的問題。那麼，DotNetNuke真的保留了一些注意事項 - 保持開發者作爲開發者，作爲設計師的設計師。這樣可以讓大型團隊在不破壞其他工作的情況下靈活運用網站。

在每DotNetNuke皮膚，你會看到這些：

<%@ Control language="C#" AutoEventWireup="false" Explicit="True" Inherits="DotNetNuke.UI.Skins.Skin" %> 
<%@ Register TagPrefix="dnn" TagName="LOGO" Src="~/Admin/Skins/Logo.ascx" %>

那些是什麼？那麼，第一個是定義我們的ascx。重要的是第二個。本質上DotNetNuke具有令牌可用，這些令牌將允許皮膚反映其界面中DotNetNuke中所做的更改。

所以當我們引用核心位置時，而不是靜態對象。這允許DotNetNuke界面自動輸入該位置的徽標。

哇，你失去了我 - 如果這就是我們如何指定位置的參考？

<%@ Register TagPrefix="dnn" TagName="LOGO" Src="~/Admin/Skins/Logo.ascx" %>

請參考我們的對象。我們的網站內指定的位置，你會做到這一點：

<div class = "example_logo"> 
    <dnn:LOGO runat="server" id="dnnLOGO" BorderWidth="0" /> 
</div>

所以我們基本上是我們的包裝標記對象在div元素。然後我們實際上調用我們的令牌。這會將徽標從DotNetNuke界面立即放入您的網站。

這基本上消除了靜態方法，並允許它變成動態的。

因此，這些都是重要的，但我如何創建結構？

<div id="Origin"> 
    <div class="Wrapper"> 
     <div id="Origin-Header"> 
      <div class="origin-header clearfix"> 

       <!-- Header Elements --> 
       <div class=origin-logo> 
         <dnn:LOGO runat=server" id="dnnLOGO" BorderWidth="0" /> 
       </div> 
       <div class="origin-login"> 
         <dnn:LANGUAGE runat="server" id="dnnLANGUAGE" showMenu="false" showLinks="true" /> 
         <dnn:LOGIN runat="server" id="dnnLOGIN" CssClass="login" /> |      <dnn:USER runat="server" id="dnnUSER" CssClass="user" /> 
         <dnn:SEARCH runat="server" id="dnnSEARCH" UseDropDownList="true" ShowSite="false" ShowWeb="false" /> 
        </div> 
      </div> 
     </div> 

     !-- Banner --> 
     <div id = "Origin-Banner"> 
       <div class = "origin-banner-pane" id="origin-banner-pane" runat="server" /> 
     </div>

所以上面是一個例子，讓你開始。當你看到你使用你的基本知識來建立網站結構。您只需將DotNetNuke Tokens填入您的設計中即可。然後，您希望DotNetNuke模塊填充您的網站，DotNetNuke接口的數據位於那些Panes之內。

現在下一個重要的方面將是你的皮膚必不可少的包裝。這將確保它在安裝後正常工作。

您可以從http://www.dotnetnuclear.com獲得更多的信息和http://www.dnnchat.com

希望這提供了基礎知識，讓你開始。這使得包裝和清單遺留下來。

希望這可以指導你正確的方向和幫助。

隨時提問或關注這些網站，嘗試獲取有關該主題的更多信息。

來源

2013-05-10 19:57:30 Greg

您也可以檢查DotNetNuke視頻庫。 – Greg 2013-05-10 20:27:34

主要是因爲我不記得是否添加了它，但是'DotNetNuke'需要在* skin *中定義'ContentPane'。 – Greg 2013-07-11 22:03:39

最好的辦法可能是看看現有的以DotNetNuke爲開頭的皮膚。要創建一個新的皮膚，只需進入/ Portals/_default /皮膚區域並複製其中一個目錄粘貼並重命名爲獨特的東西。這現在應該顯示在你的皮膚選擇器中。 90％的.ascx皮膚文件只是HTML/CSS。然後，您可以根據需要修改skin.css文件和ASCX文件以獲得所需的外觀。要創建新的皮膚選項，只需創建一個新的.ascx文件。

你也可以購買一兩個皮膚，並看看如何開發這些皮膚。

來源

2013-05-08 02:07:00

我認爲這是要走的路。儘管你需要熟悉DNN的基本模塊創建。 – tatigo 2015-04-21 21:02:26

正如Chris Hammond在第一條評論中指出的那樣，這些教程很難得到。 @Chris - 感謝您編寫模板模板。社區和我欣賞它。

我一直在努力學習DNN皮膚，並遇到了DNN英雄網站，該網站有一個關於如何爲網站創建皮膚的基本視頻教程。

它可以在這裏找到：http://www.dnnhero.com/Premium/Tutorial/tabid/259/ArticleID/80/1-How-to-create-my-first-skin-in-DotNetNuke-Part-1-6.aspx

我不認爲這個系列是一套免費的視頻，所以你可能必須訂閱得到它。我是訂閱者，並沒有失望。如果您需要對皮膚或其他任何DNN進行介紹，該網站是非常有用的。

來源

2013-09-09 23:44:50 RacerNerd

DotNetNuke 7皮膚教程

回答

相關問題