When upgrading a SharePoint 2007 site – to SharePoint 2010 – the biggest change from a visual perspective is the ribbon – you’ll come to know it as “THAT DAMN RIBBON” !!!
It’s tricky to ‘style’ – and you can’t EDIT a page unless you you’ve included it.
The steps I’ve followed to get it working are :
Here’s an example of an upgraded Team Site – looking “alright” apart from some styling bits & pieces (still to do) :
The new AJAX style popup windows use the same Master Page – but you need some tweaking to avoid this (when clicking “UPLOAD”) :
You’ll notice that the ribbon, left-nav, top-nav and a few other elements should NOT be there.
The basic fix is to include some CSS class tags – on the specific areas you DON’T want to show.
Here’s an example – with some screen shots to show the result.
As such, the NOTDLG tag only applies to modal popups (.ms-dialog) – this doesn’t have any impact.
This class will have the same effect by hiding the DIV on any system pages – but still show on the HOME page :
Making use of these tags will allow you to switch on/off certain sections of the Master Page :
It’s tricky to ‘style’ – and you can’t EDIT a page unless you you’ve included it.
The steps I’ve followed to get it working are :
- Look at “v4.master” – and identify the tags you’ll need
- Refer to this MSDN article : Upgrading an Existing Master Page to the SharePoint Foundation Master Page (NB. some incorrect text, but a good guide)
- Check your styles being used – and include “NO-DLG” where needed – for any dialog/modal popups. Upload document,New page,etc
- Include style class tags for sections to appear on System Pages also (using the same Master Page)
Here’s an example of an upgraded Team Site – looking “alright” apart from some styling bits & pieces (still to do) :
The new AJAX style popup windows use the same Master Page – but you need some tweaking to avoid this (when clicking “UPLOAD”) :
You’ll notice that the ribbon, left-nav, top-nav and a few other elements should NOT be there.
The basic fix is to include some CSS class tags – on the specific areas you DON’T want to show.
- Include the class “s4-notdlg” for any TD or TR tags that you don’t want shown.
- Or, can wrap these tags in a <DIV class=’s4-notdlg’> tag set
Here’s an example – with some screen shots to show the result.
1. Include DIV + H1.
<div>
<h1>This is a cool webpage</h1>
</div>
This shows in BOTH places – ie. the main page – AND – the popup dialog.<h1>This is a cool webpage</h1>
</div>
2. Include DIV + H1 + NOTDLG class
<div class="s4-notdlg">
<h1>This is a cool webpage</h1>
</div>
This shows in the main page – but not the popup dialog.<h1>This is a cool webpage</h1>
</div>
3. System Pages – include DIV + H1 + NOTDLG class
On a system page – like the Site Settings page (\_layouts\settings.aspx) you will see that the same text is begin shown – this operates just like the home master page.As such, the NOTDLG tag only applies to modal popups (.ms-dialog) – this doesn’t have any impact.
<div class="s4-notdlg">
<h1>This is a cool webpage</h1>
</div>
<h1>This is a cool webpage</h1>
</div>
4. System Pages – include DIV + H1 + NOTDLG + SKIPRIBBON class
Through some fiddling & testing, I worked out that there’s a similar class tag that you can use to achieve the same result – for System Pages.<div class="s4-notdlg s4-skipribbonshortcut">
<h1>SharePoint is very cool</h1>
</div>
<h1>SharePoint is very cool</h1>
</div>
Making use of these tags will allow you to switch on/off certain sections of the Master Page :
- Publishing pages – ie. Site Master Page
- System pages – ie. System Master Page – for all views and forms
- Dialog / popup pages – all making use of the same Master Page (!!)






Comments
Post a Comment