SharePoint Document Libraries in Microsoft CRM

One of the key ways that you can integrate other web applications with Microsoft CRM is to use the Iframe control. When using Iframes to SharePoint Technologies pages you may want to remove the navigation and title bar chrome so that the document library has a more integrated appearance. Below are the steps I use to trim the chrome on Windows SharePoint Services v2 and SharePoint Portal Server 2003.

The first thing to do is to create a new view for your document library. By using a new view you can preserve the normal user experience when navigating the document library within SharePoint. This also provides for a tailored experience when integrated into Microsoft CRM.

         Figure 1 - Sections to Remove

Note: If you use “Split View” then saving the page will show the changes.

Creating a new view

1. Navigate to the Document library
2. On the left side click “Modify settings and columns”
3. Scroll to the bottom of the settings page to the “Views” section
4. Click “Create a new view”
5. Choose “Standard View”
6. Name the view and click OK to save (I usually name the view ‘FrameView’ so that I can easily identify it later.)

Open the site in FrontPage

1. Click ‘Open Site’ from the File menu of Front page
   1. If your document library is in a sub-site navigate down to the correct sub-site. (Example: http://localhost:1919/sales/ where “sales” is a sub-site )
2. Navigate to your document library in the site explorer
3. Open the “Forms” folder under the document library
4. Right click and select ‘Open’ on the view that was created above.

Find and remove the title bar frame

Now that we have the view open in FrontPage we need to find the sections to remove.

1. Change the view to Split or Code view and start at the top line.
2. Select ‘Find’ from the Edit menu and search for “ms-bannerframe”
3. This will find a “table” element with the ms-bannerframe class.
4. Select the complete tag (right click on table and click “Select Tag” is the easiest method to select the full tag)
5. Delete the selected tag (This will remove the top level navigation bar)

Moving the RelativeFolderPath property

SharePoint has an important property stored in the titlebarareaframe that we need to move to the descriptiontext section.

1. Select ‘Find’ from the Edit menu and search for “RelativeFolderPath”
2. Select the tag and “Cut” it to the clipboard

<SharePoint:ListProperty Property="RelativeFolderPath" runat="server"/>

3. Select ‘Find’ from the Edit menu and search for “ms-descriptiontext”
4. Paste it just after the “Description” property
   <SharePoint:ListProperty Property="Description" runat="server"/>
   <SharePoint:ListProperty Property="RelativeFolderPath" runat="server"/>

Removing the titleareaframe

1. Select ‘Find’ from the Edit menu and search for “div class="ms-titleareaframe"”
2. Select and delete the complete “ms-titleareaframe” div tag

Removing the navigation bar sections

1. Select ‘Find’ from the Edit menu and search for “class=ms-nav”
2. Select and delete the TD tag with this class.

The view now has all of the title and navigation frames removed and will work will in an Iframe. SharePoint creates a virtual page for every view so you can craft a URL that will always show you desired view. The URL is made up of the following components

1. Server
2. Sub Site
3. Document library name
4. Forms folder
5. View name

Example: http://localhost:1919/sales/Testframe/Forms/FrameView.aspx

Looking ahead, my next blog post will illustrate how to trim the chrome from a web part page. The structure is slightly different.

Rich Dickinson