DotNetNuke 7皮肤教程

Question

我正在寻找一个关于为DotNetNuke 7创建皮肤的体面教程.我找不到任何最新版本的dnn,虽然我已经成功修改现有的皮肤,但它会很多更容易从头开始构建它们.

有什么建议？

Answer 1

我不会详细介绍,但我会定义一些关键元素DotNetNuke Skinning以及您可能遇到的一些潜在问题.

皮肤可以用两种方式之一书写,html或者一种ascx.最常见的方式是通过ascx.

• html:当您使用此方法时,在DotNetNuke分析皮肤之前,不会应用您在皮肤中所做的任何更改.何时DotNetNuke解析,它将引用您的清单以正确解析所有值,以便显示.

• ascx:这种方式不需要解析,您所做的更改将立即生效.这使操作更容易.但是,这仍然包含一个清单来定义您的内容.

现在,想象DotNetNuke结构的最简单方法是通过Panes和Containers.基本上一个Pane将永远包裹在一个Container.

但我该如何设计皮肤？

需要注意的一些事项是,DotNetNuke您倾向于不为该页面设计一个站点 - 您可以创建更复杂的结构,可以在更一般的意义上使用.例如:

因此,使用上面的图像,您会看到一些关键元素,例如:

1. 商标
2. 搜索
3. 登录
4. 菜单
5. 旗帜
6. 分组三个内容.
7. 分组四个内容.
8. 另一篇内容.
9. 页脚也按四个分组.

基本上我们有一个相当简单的数据结构.通常包括一些相当基本的组织.但我的问题是,你如何帐户或移动设备或不同的页面布局,如:

现在你有一个稍微复杂的问题.嗯,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获取更多信息

希望这提供了帮助您入门的基础知识.这使包装和清单留下了.

希望这能指向正确的方向并提供帮助.

随意提问或关注这些网站,尝试获取有关该主题的更多信息.