Near the beginning of my SharePoint Developer Class, I go thru eight Windows shortcuts that are helpful in setting up a development environment. I want to share two of them here in preparation for my coming posts.
On the Home page of a standard WSS Team Site you will find the Modify Shared Page link in the top right corner. It is generated from the server control:
included on the direct mode default.aspx page in the STS Site Definition in the 60 Hive.
You are probably familiar with using this smart menu on the Home page. However, there are other pages where its functionality can prove very useful. For instance, what if you wanted to add a Web Part to the AllItems.aspx page, the NewForm.aspx page, the EditForm.aspx page, or the DispForm.aspx page of any List or Document Library? To alter the contents of the Web Zones on these Web Part Pages you must open the site in FrontPage and at lease temporarily unghost the page, right? Not any more.
From Internet Explorer, view the source of the Home page of a standard WSS Team Site and search for Add Web Parts and you will see text like this:
This code defines each menuitem that will be presented in the Modify Shared Page smart menu. The menuitems presented here should look familiar. Under the text "Add Web Parts" in the code you can see "Browse", "Search", and "Import" followed by "Design this Page" and "Modify Shared Web Parts", etc. I'm going to focus on Browse and Design this Page, arguably two of the most commonly used options on the menu.
Choosing Modify Shared Page > Add Web Parts > Browse from the smart menu in the UI will run JavaScript:MSOTlPn_ShowToolPane('2')
Let's examine the command: The MSO presumably stands for Microsoft Office, the TlPn (that's a lowercase L not a 1 and unfortunately JavaScript is case sensitive) presumably stands for Tool Pane, and ShowToolPane is the specific method that we are executing. The required ViewID parameter identifies which Tool Pane view to show:
| ViewID |
Tool Pane view to show |
| -1 |
Extensible View |
| 0 |
Close task pane |
| 1 |
Web Part Properties and Custom ToolParts |
| 2 |
Add Web Parts – Browse |
| 3 |
Add Web Parts – Search |
| 4 |
Navigation (Downlevel only) |
| 5 |
Add Web Parts – Import |
| 6 |
Web Part Menu (Downlevel only) |
| 7 |
Error |
For more information about what you can do with MSOTlPn_ShowToolPane check out the Customizing Task Pane Views section of the MSDN Article called Modifying the User Interface for Web Parts and Web Parts Pages.
If we create an Internet Explorer favorite (shortcut) that executes this JavaScript, we could browse to the Add Web Parts ToolPane on any WSS Web Part Page. So, on any page in Internet Explorer:
- Choose Add to Favorites from the Favorites menu. Don't worry about which page you are marking as a favorite, we will be changing the URL anyway.
- Name the new favorite Add Web Parts - Browse.
- Choose the folder, if any, where you want the favorite. I like to put these favorites into the built-in Links folder, but you can really put it anywhere you can find it again.
- Click OK.
- Find the favorite you just created, right click on it, and choose Properties at the bottom of the context menu.
- Replace the contents of the URL field with JavaScript:MSOTlPn_ShowToolPane('2')
Remember, JavaScript is case sensitive so be precise.
- Click OK.
- Click Yes on the Problem with Shortcut confirmation dialog. It expects protocols like http, https, and ftp so it doesn't understand JavaScript. That's OK, it will still work.
Choosing Modify Shared Page > Design this Page from the smart menu in the UI will run JavaScript:MSOLayout_ToggleLayoutMode()
We will repeat the same basic steps to create the second shortcut. So, again, on any page in Internet Explorer:
- Choose Add to Favorites from the Favorites menu.
- Name the new favorite Design this Page.
- Choose the folder, if any, where you want the favorite.
- Click OK.
- Find the favorite you just created, right click on it, and choose Properties at the bottom of the context menu.
- Replace the contents of the URL field with JavaScript:MSOLayout_ToggleLayoutMode()
Again, JavaScript is case sensitive so be precise.
- Click OK.
- Click Yes on the Problem with Shortcut confirmation dialog.
Now, navigate to any Web Part Page and choose one of your new favorites. Viola, the page jumps into the correct mode, even if the Modify Shared Page smart menu isn't showing. On a SharePoint Portal Server Area you will need to first get into Edit Mode to run these JavaScript shortcuts.
Finally, note that the Design this Page favorite is a toggle. So, the first time it is chosen it will put the Web Part Page into Edit Mode, the second time it will return the Web Part Page to View Mode.