While SharePoint 2007 certainly moved the platform forward for its time, there is no doubt that doing UI work with the CMS is nothing short of excruciating. The reason for this is (a) really, really bad markup and (b) no DOCTYPE (SharePoint Designer doesn’t help the cause either). There is a lot you can do to deal with the first issue, but you’re largely stuck on the second.
The reason adding a DOCTYPE is problematic is because adding the DOCTYPE to the master page makes core functionality break like moving web parts between zones, and all the default styles are not made to work in browser’s standards mode. The best way to get around this would be for the DOCTYPE only to show when the page is in “display” mode but not in “edit” mode. (If you need to develop custom master pages for the “System Master Page” then I would not suggest using this solution because it will cause more heartache then it’s worth.)
To do this we need to include a content placeholder at the top of the master page.
<asp:ContentPlaceHolder id="DoctypePanel" runat="server" />
Then, in our layouts, we can include the following EditModePanel that will only output what we have in display mode. Keep in mind that all attributes are necessary to include. It would be nice if we could just include the code block belowin the master page, but it doesn’t work (I presume because it isn’t in the form tag).
<asp:Content ContentPlaceholderID="DoctypePanel" runat="server"> <PublishingWebControls:editmodepanel PageDisplayMode="Display" SuppressTag="True" runat="server" id="doctypeedit"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> </PublishingWebControls:editmodepanel> </asp:Content>
Add this CSS to fix alignment on the site actions menu.
.ms-MenuUILabel {
text-align: left;
}
Thanks to Carlos Fernandez for working through this with me.
UPDATE: Turns out I needed an addition content placeholder to include the X-UA Compatibility Meta Tag. If I didn’t include it I had issues with the browser mode changing effectively. You can’t reuse the same content placeholder because the meta tag belongs in the head.
Tried many times doesn’t work
Are you sure you were using the custom layout one the page you were testing?
When added your code, it came up with a parser error. I have an existing sharepoint site with no doctype tag in its masterpage. We created a web part with Collapsible Extender from Ajax Control Toolkit (.Net 2.0) . It didn’t work.When I added a doctype tag in the master page, My extender worked but it broke Sharepoint asp:menu which is defualt top navigation menu.Flyout menu disappears as soon as you hover over flyout items. So, I am trying to add doctype just for the webpart zone in default.aspx, the layouts page.
Sorry but there is no way to do that only for a web part zone. I didn’t have any issues with the SharePoint menu when adding the DOCTYPE.