在这种情况下如何构建主模板和文档类型？答案

【问题标题】：How to structure Master Templates and Doc Types in this case?在这种情况下如何构建主模板和文档类型？
【发布时间】：2017-03-28 16:28:31
【问题描述】：

我需要在 Umbraco（第 4 版）上创建一个新网站。该网站将有一个主登录页面，其中包含指向 4 组地理子站点的 4 个链接。

在主模板中，我将包含所有常用的 HTML Head 内容以及 CSS 和 JS 链接等。在正文内容中，将有两个 contentPlaceHolders：

网站徽标将位于左侧，而另一个横幅图像将位于顶部右侧。此部分将在其他页面中不断重复使用。
用于显示 4 个链接的占位符。

我的问题是：如何在设置中构建模板和文档类型，以便在用户上传 2 张图片后自动重用和继承页眉徽标部分？

谢谢

【问题讨论】：

标签： umbraco

【解决方案1】：

您可以在站点根目录的文档类型上指定这些属性，然后使用 Razor（或 XSLT）遍历站点顶部，获取媒体选择器属性，并从中检索图像 URL。

【讨论】：

谢谢，我试试看。

【解决方案2】：

您可以使用母版页控件来获得方便和更好的开发方法。

<%@ Master Language="C#" MasterPageFile="~/umbraco/masterpages/default.master" AutoEventWireup="true" %>

然后根据您的要求为每个部分定义占位符。

  <asp:Content ContentPlaceHolderID="ContentPlaceHolderDefault" runat="server">

    </asp:Content>

这是我的 umbraco 网站的示例

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Main.master.cs" Inherits="WebsiteName.Masterpages.Main" %>

<!DOCTYPE html>
<head runat="server">
    <title>All One Health</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0" />
    <link href="/Css/main.css" media="all" rel="stylesheet" type="text/css" />
    <link href="/Css/custom.css" media="all" rel="stylesheet" type="text/css" />
    <link href="/Css/navmenu.css" media="all" rel="stylesheet" type="text/css" />
    <link href="../Css/download.css" media="all" rel="stylesheet" type="text/css" />
    <link href="/Css/jquery.selectbox.css" media="all" rel="stylesheet" type="text/css" />
    <%--<link href="/Css/ie10.css" media="all" rel="stylesheet" type="text/css" />--%>



    <script type="text/javascript" src="/Scripts/jquery.js"></script>
    <script src="/Scripts/jquery.bxslider.min.js"></script>
    <link href='http://fonts.googleapis.com/css?family=Lato:400,700' rel='stylesheet' type='text/css' />
    <link href='http://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css' />
    <link href='http://fonts.googleapis.com/css?family=Nunito:400,700,300' rel='stylesheet' type='text/css' />
    <script type="text/javascript" src="http://js.addthisevent.com/atemay.js"></script>
    <script src="/Scripts/html5shiv.js"></script>
    <script src="/Scripts/placeholders.min.js"></script>

    <!--[if IE 8]>
            <link href="/Css/ie8.css" media="all" rel="stylesheet" type="text/css" />
        <![endif]-->
    <!--[if IE 9]>
            <link href="/Css/ie9.css" media="all" rel="stylesheet" type="text/css" />
        <![endif]-->




    <!-- bxSlider CSS file -->
    <link href="/Css/jquery.bxslider.css" rel="stylesheet" />
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">

        <!--  Header Section   -->
        <header class="mobile-header">

            <umbraco:Macro Alias="MobileUtilityNavigation" runat="server" />
            <div class="mobile-header-nav-logo">
                <div class="logo">
                    <umbraco:Macro Alias="Header" runat="server" />
                    <umbraco:Macro Alias="MobileMenuNavigation" runat="server"></umbraco:Macro>
                </div>
            </div>
        </header>
        <header class="header">
            <umbraco:Macro Alias="HeaderUtilityNav" runat="server" />
            <div class="header-nav-logo">
                <div class="logo">
                    <umbraco:Macro Alias="Header" runat="server" />
                </div>
                <div class="ghost-logo"></div>
                <umbraco:Macro Alias="HeaderMainNav" runat="server" />
            </div>
        </header>
        <!--  Header End   -->
        <asp:ContentPlaceHolder ID="SliderContent" runat="server">
        </asp:ContentPlaceHolder>
        <!--   Body Section   -->
        <div id="page">
            <asp:ContentPlaceHolder ID="ContentPlaceHolderDefault" runat="server">
            </asp:ContentPlaceHolder>
        </div>
        <!--  Footer Section  -->
        <footer class="footer">
            <div class="grey">
                <umbraco:Macro Alias="Header" runat="server"></umbraco:Macro>
                <umbraco:Macro Alias="MobileMainNavigatoin" runat="server"></umbraco:Macro>
                <umbraco:Macro Alias="MobileUtilityFooterLinks" runat="server"></umbraco:Macro>
            </div>
            <umbraco:Macro Alias="Footer" runat="server"></umbraco:Macro>
        </footer>
        <!-- Footer end  -->

        <!--Scrips-->

    </form>
    <script type="text/javascript" src="/Scripts/main.js"></script>
    <script type="text/javascript" src="/Scripts/split.js"></script>
    <script type="text/javascript" src="/Scripts/jquery.selectbox-0.2.js"></script>
    <script type="text/javascript" src="/Scripts/header.js"></script>
</body>
</html>

【讨论】：