Question

我有一堆asp页面，我正在升级到asp.net。我想找到一个实现以下目标的好方法：

我基本上不是一个门户页面，它有一个菜单栏和指向公司内部网中其他站点的链接，但是当点击链接时，它不会重定向到另一个站点，而是将页面加载到当前页面中，以便所有其他网站均可访问链接和菜单栏。我的目标是做到这一点，当需要建立一个新网站时，开发人员可以添加页面的内容，并添加另一个链接到母版页。

实现这一目标的干净方法是什么？是否最好将所有这些（现在单独的）Web应用程序捆绑到一个asp.net Web应用程序项目中，或者是否有一种简单的方法可以跨多个asp.net项目共享母版页？

我是asp.net和web开发的新手，所以感谢任何帮助，谢谢。

Answer 1

从 ASP Master Pages 开始。

虽然，如果有可能，我会跳到ASPNET MVC framework并开始使用 Razor Layouts 。

如果你有时间，我相信跳进MVC是值得的，而不是基本的ASP.NET。 MVC是ASP.NET的扩展，它将使您的生活更轻松。我有一个主剃刀布局，我在那里定义了我希望在整个网站上的每个页面的通用细节。

希望这些链接可能有所帮助。

编辑：为MVC 3中的Razor布局添加了样本布局。

这是我用于项目的示例布局，如果您决定走这条路线，希望能为您提供MVC的开端。

@using System.Configuration
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title>@(!String.IsNullOrEmpty(ViewBag.Title) ? ViewBag.Title : ConfigurationManager.AppSettings["ApplicationName"])</title>
    <meta name="description" content="@ViewBag.MetaDescription" />
    <meta name="robots" content="@ViewBag.Robots" />
    <script type="text/javascript" src="@ConfigurationManager.AppSettings["CDN-Scripts-Url"]/modernizr2.custom.01930.js"></script>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css"
        rel="stylesheet" type="text/css" />
    @* ------------ CSS for Dropdown menu ----------------------
       Can be found in http://lwis.net/free-css-drop-down-menu/
       ---------------------------------------------------------
    *@
    <style type="text/css">
    /* Layout */
    @@import "@ConfigurationManager.AppSettings["CDN-Scripts-Url"]/free-css-drop-down-menu_v1.2/css/dropdown/dropdown.limited.css";
    /* Theme */
    @@import "@ConfigurationManager.AppSettings["CDN-Scripts-Url"]/free-css-drop-down-menu_v1.2/css/dropdown/themes/flickr.com/default.css";
    </style>
    <!--[if lte IE 7]>
    <style type="text/css" media="screen">
    body { behavior:url("@ConfigurationManager.AppSettings["CDN-Scripts-Url"]/free-css-drop-down-menu_v1.2/js/csshover.htc"); }
    </style>
    <![endif]-->
    @* ------------------------------------------------- *@
    <link href="@ConfigurationManager.AppSettings["CDN-Media-Url"]/Fonts/CopystructNormal/font-CopystructNormal.css" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/css/site.css")" rel="stylesheet" type="text/css" />
    @RenderSection("Header", false)
    <!-- Change the UA-XXXXX-X to be your site's ID  -->
    <script type="text/javascript">
        var _gaq = _gaq || [];
        _gaq.push(['_setAccount', '@ConfigurationManager.AppSettings["GoogleAnalyticsKey"]']);
        _gaq.push(['_trackPageview']);
        _gaq.push(['_trackPageLoadTime']);
    </script>
</head>
<body>
    <div class="wrapper">
        <div class="header">
            <nav>
                <div class="page ui-helper-clearfix">
                    <div id="logo">
                        <a href="@Url.Content("~/")">@ConfigurationManager.AppSettings["ApplicationName"]</a>
                    </div>
                    <div id="mainMenu">
                    @RenderSection("MainMenu", false)
                    </div>

                    <div id="accountMenu" style="float:right">
                    @Html.Partial("_AccountMenuPartial")
                    </div>

                </div>
            </nav>
            <div class="banner">
                <div class="page ui-helper-clearfix">
                    @RenderSection("Banner", false)
                </div>
            </div>
        </div>
        <div class="main">
            <div class="page ui-helper-clearfix">
                @RenderBody()
            </div>
        </div>
        <div class="push">
        </div>
    </div>
    <div class="footer">
        <div class="page ui-helper-clearfix">
            Copyright 2012, @ConfigurationManager.AppSettings["CompanyName"]
        </div>
    </div>
    <!--! end of #container -->
    <!-- Javascript at the bottom for fast page loading -->
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
    <!-- Add all scripts here at the bottom of the page to avoid blocking page load.-->
        type="text/javascript"></script>
    <!-- scripts to support client side validation of forms -->
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.min.js"></script>
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/mvc/3.0/jquery.validate.unobtrusive.min.js"></script>
    <script src="@ConfigurationManager.AppSettings["CDN-Scripts-Url"]/topbar/topbar.js?v=1" type="text/javascript"></script>


    @RenderSection("Scripts", false)


    @* Google Analytics Async Script *@
    <script type="text/javascript">
        (function () {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();
    </script>
</body>
</html>

对于没有MVC经验的人来说，这看起来有点复杂。

以下是一些启发此模板或其中使用的工具的链接。

Free CSS Menu
CSS Sticky Footer
Best Practices for Speeding Up Your Web Site：其中包括将CSS置于顶部，脚本位于底部，使用CDN作为静态文件。
Google Analytics：跟踪访问

我希望这会有所帮助，而且不会让人感到压力。

Answer 2

使用frame或iframe是一种从外部源加载数据的方法。

创建具有菜单和链接但显示其他页面的主要内容的母版页的最佳方法

2 个答案: