Posts

Showing posts with the label Layout

How to style the SharePoint "Site Actions Menu" with Firebug

Image
The site actions menu in SharePoint is generated automatically by JavaScript so you cannot look at the source code which classes are used to style the menu. I often use Firebug to check the classes and manipulate on the fly the css. But this is hard to do with the site actions menu because it disapears after a while. A little trick helps here (works in SP2010 and SP2007) Open the site in Firefox and open Firebug. Click the selection arrow and select the "Site Action" menu. Firebug Objekt Picker You will see a html code like show above. An <a> Tag surrounded by a <span> or <div>. The trick is to copy the onclick code of the <span> or <div> tag. The javascript code can vary in each enviroment. The code can be easily copied from firebug or from the html code. In my case the code is: In SP 2010 CoreInvoke('MMU_Open',byid('zz8_FeatureMenuTemplate1'), MMU_GetMenuFromClientId('zz16_SiteActionsMenu'),event,f...

Setting the default page layout in onet.xml (SharePoint 2010)

Image
In SharePoint 2010 you have the option to choose a default page layout when you create a page. Setting the default page When you create a new page, a dialog pops up where you enter the name of the site. You can configure your onet.xml and define the default page by the defaultpagelayout property in the publishing feature. Or you can set it programmatically as described in SharePoint Blues . There are also several other properties offered by the Publishing feature you can set: ChromeMasterUrl WelcomePageUrl PagesListUrl AvailableWebTemplates AvailablePageLayouts NewPageUrlToken AlternateCssUrl SimplePublishing VersioningOnPages / Documents / Images EnableModerationOnPages / Documents / Images EnableApprovalWorkflowOnPages / Documents / Images RequireCheckoutOnPages / Documents / Images EnableSchedulingOnPages /Documents / Images AllowSpacesInNewPageName Each property needs a different value. You can find a good listing of the properties a...

How to hide the SharePoint Ribbon in Non-Edit Mode

If you’ve ever developed a page for SharePoint 2007 you certainly used the EditModePanel control to control content visibility. This control now has changed in SP 2010 and ignores the Page Editmode. But there is a possibility to do this with no custom code.  Locate the position of the class "s4-ribbonrow" and add a display style. (Or overwrite the class in your css). This will hide the panel in DisplayMode. <div class="s4-pr s4-ribbonrowhidetitle" id="s4-ribbonrow" style="display: none;" > Add following code after the ribbon div. This will show the ribbon in EditMode. <publishingwebcontrols:authoringcontainer displayaudience="AuthorsOnly" runat="server"> <publishingwebcontrols:editmodepanel pagedisplaymode="Edit" runat="server"> <script type="text/javascript">   document.getElementById("s4-ribbonrow").style.display = "block"; </script> ...

Check if a SharePoint page is in edit mode

Everyone who ever created a MasterPage for SharePoint certainly used the EditModePanel control, to show some controls only in "edit" mode. I use the EditModePanel control to load some javascript and css when the page is in edit mode. This is useful when I want to correct webparts, which are to small a.s.o. <PublishingWebControls:EditModePanel runat="server" id="EditModePanelJSNone"> <script type="text/javascript"> /* <![CDATA[ */    Editmode = true; /* ]]> */ </script> </PublishingWebControls:EditModePanel> Now I realized that this control doesn't function when it is used with personalized pages. A personalized page saves a snapshot of the page either in edit or display mode. So I had to check per javascript if a page is in edit mode. Since each of my pages have a webpart zone and a webpartzone has a edit banner in edit mode, I check if this banner exists, by searching after a image that only ...