【SharePoint 母版页定制实例教程】分享给互联网技能从业者学习和参考。
我们使用SharePoint做门户网站,经常需要定制母版页,但是2010提供的Ribbon的方式,定制干掉了他以后,使用起来会发生不便,很多功能接口都需要从Ribbon里面进入,编辑也会无法编辑等出现各种问题,或者弹出脚本异常等。所以,我们要考虑下其他的方式,更加合理的使用Ribbon和左侧导航。
方法一
使用JS
脚步的方式
所以就想用JS隐藏的方式,处理一下母版页,把不需要的默认隐藏掉,然后通过url传参,在需要的时候,把Ribbon还原回来。这就是我的思路,给大家看看我做的例子吧。
如下图,是引用的SharePoint默认母版页的一个页面,大家很熟悉吧,V4.master就是我引用的母版页,效果就是这样的,我要处理掉Ribbon和左侧导航,因为要做门户首页嘛,这两个挺碍事儿的,呵呵。
通过IE开发工具栏,找到Ribbon和左侧导航区域的id,分别是” s4-ribbonrow”和” s4-leftpanel”,使用脚本把这两个东西隐藏掉,就变成了下图我们需要的效果,中间灰色区域是PlaceHolderMain的区域,我加了一个Div,方便识别和调整。
我们要做的不仅仅是隐藏,还要在Url上传一个参数,我这里明明为“show”,通过JS获取到参数,然后进行操作,如果有参数show并且show的值是“true”的情况下,我们把ribbon和左侧导航还显示出来。
<script> function QueryString(item) { var sValue=location.search.match(new RegExp("[?&]"+item+"=([^&]*)(&?)","i")) return sValue?sValue[1]:sValue } var ShowID=QueryString("ShowAll"); document.getElementById("s4-leftpanel").style.display='none'; document.getElementById("s4-ribbonrow").style.display='none'; document.getElementById("MSO_ContentTable").style.margin='0'; if(ShowID=="true") { document.getElementById("s4-leftpanel").style.display='block'; document.getElementById("s4-ribbonrow").style.display='block'; document.getElementById("MSO_ContentTable").style.margin='0 0 0 155px'; } </script> |
下图就是加脚本隐藏Ribbon和左侧导航后效果,大家如果想隐藏其他的东西,也可以采取这样的方法,自己感觉比直接隐藏在母版页上style=”display:none”的方法要稍微合理一点,或者直接删除是最不可取的方法了。
下面是传参数返回正常效果的图,大家可以看一下,ribbon和左侧导航都显示出来了,也可以正常的使用。当然,这样的操作,有可能在网络比较差的情况出现先加载出来ribbon和左侧导航的,然后消失掉,这样可以在母版页里隐藏掉,然后通过脚步显示出来也是可以的。
方法二 通过权限进行控制
<Sharepoint:SPSecurityTrimmedControl ID="SPSecurityTrimmedControl2" runat="server" PermissionsString="AddAndCustomizePages"> <script type="text/javascript"> JS脚步 </script> </Sharepoint:SPSecurityTrimmedControl> |
给大家权限控制的脚步,有兴趣的可以试试,其实效果和上面的是一样的,只是js执行由传参控制,变成了权限控制。当然,PermissionsString不仅仅是这一个权限的,还有很多权限,顺便给列一个吧。
微软官方PermissionsString所有值:
*************************************************************************************