Custom web part pages with navigation, Sharepoint 2010

So even in sharepoint 2010, microsoft has still not added an option to add custom web part pages, just unbelievable :)
So we are still stuck with editing system files manually to get the look that we want.
Another thing that really annoys me is that a web part page has no navigation on the left side , i really can't see
any use of a sharepoint page without navigation.

Anyway let's see how we can make this work a little better.

When creating a web part page in sharepoint there are 8 available types which can be selected:

Web Part Page	Index	ContentPage	Image
Header, Footer, 3 Columns	2	spstd2.aspx	spstd2.gif
Full Page, Vertical	1	spstd1.aspx	spstd1.gif
Header, Left Column, Body	3	spstd3.aspx	spstd3.gif
Header, Right Column, Body	4	spstd4.aspx	spstd4.gif
Header, Footer, 2 Columns, 4 Rows	5	spstd5.aspx	spstd5.gif
Header, Footer, 4 Columns, Top Row	6	spstd6.aspx	spstd6.gif
Left Column, Header, Footer, Top Row, 3 Columns	7	spstd7.aspx	spstd7.gif
Right Column, Header, Footer, Top Row, 3 Columns	8	spstd8.aspx	spstd8.gif

The system content pages can be found here:

C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\1033\STS\DOCTEMP\SMARTPGS\spstd?.aspx

Graphical view of the types can be found here:

C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\1033\IMAGES\spstd?.gif

This file links to spcf.aspx

C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\1033\STS\DOCTEMP\SMARTPGS\_webpartpage.htm

This is the actual web part page creation form, which will list the 8 different options.

C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\spcf.aspx

Which contains:

<select id="onetidWebPartPageTemplate" name="WebPartPageTemplate" size="8" onchange="DoTemplateOptionChange()"> 
   <option value="2" selected="true"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,webpagecreation_layout_option2%>" EncodeMethod='HtmlEncode'/></option> 
   <option value="1"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,webpagecreation_layout_option1%>" EncodeMethod='HtmlEncode'/></option> 
   <option value="3"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,webpagecreation_layout_option3%>" EncodeMethod='HtmlEncode'/></option> 
   <option value="4"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,webpagecreation_layout_option4%>" EncodeMethod='HtmlEncode'/></option> 
   <option value="5"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,webpagecreation_layout_option5%>" EncodeMethod='HtmlEncode'/></option> 
   <option value="6"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,webpagecreation_layout_option6%>" EncodeMethod='HtmlEncode'/></option> 
   <option value="7"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,webpagecreation_layout_option7%>" EncodeMethod='HtmlEncode'/></option> 
   <option value="8"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,webpagecreation_layout_option8%>" EncodeMethod='HtmlEncode'/></option> 
 </select>   

For some reason the different types are listed not in sequence, 1 and 2 are switched, sloppy  :)

Soulution 1:
If you want to include the left navigation bar in web part pages, then remove these lines from all of the spstd?.aspx files

...
<style type="text/css">
body #s4-leftpanel {
display:none;
}
.s4-ca {
margin-left:0px;
}
</style>
...
<asp:Content ContentPlaceHolderId="PlaceHolderLeftNavBar" runat="server"></asp:Content>
...

This will enable navigation, removing the style element is something new in sharepoint 2010.

If you want to customize a web part page like adding more web part zones etc you need to edit one of the spstd?.aspx pages.

The part which you need to change is this (located at the bottom in the file):

<table cellpadding="4" cellspacing="0" border="0" width="100%">
        <tr>
            <td id="_invisibleIfEmpty" name="_invisibleIfEmpty" colspan="3" valign="top" width="100%">
                <webpartpages:webpartzone runat="server" title="loc:Header" id="Header" frametype="TitleBarOnly" />
            </td>
        </tr>
        <tr>
            <td id="_invisibleIfEmpty" name="_invisibleIfEmpty" valign="top" height="100%">
                <webpartpages:webpartzone runat="server" title="loc:LeftColumn" id="LeftColumn" frametype="TitleBarOnly" />
            </td>
            <td id="_invisibleIfEmpty" name="_invisibleIfEmpty" valign="top" height="100%">
                <webpartpages:webpartzone runat="server" title="loc:MiddleColumn" id="MiddleColumn"
                    frametype="TitleBarOnly" />
            </td>
            <td id="_invisibleIfEmpty" name="_invisibleIfEmpty" valign="top" height="100%">
                <webpartpages:webpartzone runat="server" title="loc:RightColumn" id="RightColumn"
                    frametype="TitleBarOnly" />
            </td>
        </tr>
        <tr>
            <td id="_invisibleIfEmpty" name="_invisibleIfEmpty" colspan="3" valign="top" width="100%">
                <webpartpages:webpartzone runat="server" title="loc:Footer" id="Footer" frametype="TitleBarOnly" />
            </td>
        </tr>
        <script type="text/javascript" language="javascript">            if (typeof (MSOLayout_MakeInvisibleIfEmpty) == "function") { MSOLayout_MakeInvisibleIfEmpty(); }</script>
    </table>

This is the default layout for spstd2.aspx.
Now you can change the table, adding more webpart zones etc. Just remember to name the zones properly.

If you change the layout it's a good idea to change the spstd?.gif image too so that it will reflect the layout.

When you change the content page and save it, it will immediatly change in sharepoint for all of the pages that are based on the modified page.

Soulution 2:
There is also another option which kinda works but will require sharepoint designer everytime you create a new page.
It's not as smooth and integrated as editing the system files.

In sharepoint desinger 2010:

• Open the site.
• Select site pages, select file then new page from master.
• Inside PlaceHolderMain, add a table, inside the cells add web part zones.
• Save it as MyTemplate.aspx
• Close sharepoint designer.
• Open the site, then site actions, site settings.
• Under galleries, site content types, Create.
• Name: SpecialWebPartPage.
• Select Parent content type from: Document Content Types
• Parent Content Type: Web Part Page
• Then press ok to save.
• Select the SpecialWebPartPage.
• Advanced settings.
• Change document Template to: /Sites/YourSite/SitePages/MyTemplate.aspx
• Save.
• Create a document library with document template: Web Part Page
• Go into library settings for the document library.
• Advanced settings.
• Enable allow management of content types.
• Save.
• Select Add from existing site content types.
• Select the SpecialWebPartPage.
• Save.
• Select  new button order and default content type.
• Select the new content type to visible position from top = 1 (which makes it default).
• Select the old document type to visible = false.
• Now view the document library, select documents, click new document.
• Sharepoint designer will be started.
• Now save the file in the appropriate folder in the document library.
• View the page in the document library, select edit page, now you will see the web part zones as defined in your template.

And this page has the left navigation menu intact.

Works well except that you need sharepoint designer to save the new page.

It's probably possible to make it smoother if the template is located inside the TEMPLATE\LAYOUTS folder like the basic page template bpcf.aspx.
I did a couple of tests, and it certainly treats this template in the same way as basic page template,
but ran into several problems with the masterpage and includes which required a lot of modifications of the template.
Seems like there is a lot of logic in the basic page template that needs to be adopted.
But i haven't investigated this any further.

If anyone has a better solution for this let me know :)