zoukankan      html  css  js  c++  java
  • 在SharePoint 2007中呈现一个干净的Main区域

    在几乎所有SharePoint网站的母版页中,经常都包含了顶部Logo、顶部导航、左侧导航、页面边框等等内容,当然最主题的部分还是ID为“PlaceHolderMain”的一个ContentPlaceHolder,所有的页面主要内容都呈现在这个容器中。

    在有些情况下,我们经常会需要去掉那些周围的内容,而在页面中只呈现这个主要区域的内容,一些典型的应用场景包括:在类似对话框的弹出窗口中,把页面嵌入到一个iframe中,等等。

    在SharePoint 2010里面,我们可以很简单地在页面的Url地址之后加上一个“IsDlg=1”,SharePoint自己就会去掉那些周围的元素,只显示PlaceHolderMain这个容器和相应的Ribbon区域。实际上,在2010的那些对话框窗口中,都是使用了这种机制来实现的。

    如果您还在使用SharePoint 2007,又想要在某些场景中实现类似的效果,我们可以完全仿照2010的机制来在2007中实现这样的功能。

    在SharePoint 2010的母版页中,所有需要在对话框中隐藏的区域,都有一个class:“s4-notdlg”,当页面Url中设置了“IsDlg=1”这个查询参数之后,就会由脚本将这个class的display属性设置为“none”,从而将这些内容隐藏掉。

    到这里,我们就知道在2007里面应该如何实现这个功能了:

    第一步,打开冰箱门

    使用SharePoint Designer编辑我们的母版页(不管是默认母版页还是您自定义的母版页),把在这种状态下需要隐藏的容器的元素标签(div、table、tr、td等等)都加上一个我们自定义的class(假设叫做“Erucy-notdlg”)。我数了一下,在2007的默认母版页default.master中,如果需要把周围元素都隐藏干净,只需要在8个元素中增加这个标签;在默认的layouts下的applicatioin.master(绝大多数layouts下页面的母版页)中,同样只需要8个。(在本文末会给出我修改好的这两个文件供大家参考)

    第二步,把大象装进去

    接下来,我们就需要在IsDlg=1或者的情况下,来设置“Erucy-notdlg”这个class的display属性,我们可以通过js来实现这一点。这里面,我们使用一种标准的SharePoint做法:创建一个feature,加入一个ControlId为“AdditionalPageHead”的用户控件,将一部分代码加入到页面的head标签中(AdditionalPageHead是SharePoint所有母版页中都有的一个DelegateControl控件,在head区域中,允许我们通过feature的方式将自定义的一些css引用、js脚本等内容灵活地添加到head标签中,很多开发人员在编辑母版页的时候都会把这个看似无用的控件去掉,实际上,这是非常不可取的做法)。

    首先,我们来编写这个需要的css文件,非常简单:

       1: .Erucy-notdlg{
       2:   display:none;
       3: }

    然后,编写一个Feature,先是feature.xml:

       1: <?xml version="1.0" encoding="utf-8" ?>
       2: <Feature Id="FEC9EB94-004C-4E02-AE5D-32D350C6CD5B"
       3:     Title="开启干净的Main区域"
       4:     Version="1.0.0.0"
       5:     Scope="Site"
       6:     xmlns="http://schemas.microsoft.com/sharepoint/">
       7:   <ElementManifests>
       8:     <ElementManifest Location="Controls.xml" />
       9:   </ElementManifests>
      10: </Feature>

    然后是Feature的主体文件,Controls.xml,来加入一个用户控件:

       1: <?xml version="1.0" encoding="utf-8" ?>
       2: <Elements xmlns="http://schemas.microsoft.com/sharepoint/">
       3:   <Control Id="AdditionalPageHead" 
       4:       ControlSrc="~/_controltemplates/ClearMain.ascx" />
       5: </Elements>

    最后,就是编写这个最重要的ascx。在这个ascx中,我们会判断,如果页面Url中包含了IsDlg=1、或者页面在一个iframe中,那么就输入上面的那个css文件引用:

       1: <%@ Control Language="C#" ClassName="ReferenceControl" %>
       2: <script type="text/javascript">
       3: if (window.location.search.indexOf('IsDlg=1') > 0 ||
       4:   (window.parent != null && window.parent != window)) {
       5:     document.writeln('<link rel="stylesheet" type="text/css" href="/_layouts/Erucy/dlgframe.css"/>');
       6: }
       7: </script>

    第三步,关上冰箱门

    把这些feature文件、css文件、ascx文件都做成一个wsp包(如果你不知道怎么做的话,可以去搜搜……SDK里面也有讲),然后部署之,进到网站集管理里面激活feature,搞定!

    这个时候,如果我们需要在弹出窗口中隐藏掉周围内容,只需要在弹出窗口的Url中加上IsDlg=1;如果是放到页面中的iframe里面(比如自带的“网页查看器”Web部件),默认就会去掉所有周围内容:

    image

    修改后的default.master和application.master下载:点我点我!

  • 相关阅读:
    SQL Server 2005 Express 不能远程连接的错误
    android客户端程序访问服务器端webservice,几篇不错的文章!
    Android连接远程数据库
    Android平台显示单位px/dip/sp的区别
    Android 下使用 JSON 实现 HTTP 请求,外加几个示例!
    前言
    03、ApplicationSettings Of win8
    把windows 8 应用部署到其它计算机(更新 win10 uwp部署)
    02、获取 win 8 程序包信息
    01、获取计算机用户的信息
  • 原文地址:https://www.cnblogs.com/erucy/p/2416100.html
Copyright © 2011-2022 走看看