11 replies to this topic

[NIM]

I love the new Office Ribbon. However, the first thing I wanted to do was modify it. The Home tab has a big chunk of the Styles group that I don't use. I wanted to get rid of it and put my own shortcuts in the Home tab. It took many hours for me to figure out how to modify the Ribbon. I put together a guide for everyone that shows you how to accomplish this.

PDF attached:  Modifying_Office_Word_Ribbon.pdf   98.82K   144 downloads

Courtesy SpaceSurfer

Introduction

Here is a tutorial on how to modify the ribbon interface in Office Word. This method doesn’t require Visual Basic programming. It requires modifying a simple XML file with a text editor. This guide only shows you how to shift the built-in controls around from tab to tab or group to group. It does not show you how to create your own controls.

Step 1: Enabling a Custom Ribbon

1) Create a folder called ‘Ribbon’ anywhere on your hard disk.
2) Open Office Word. Do not modify the new blank document. Click on ‘Save As’ to save the document as customUI.docm file in The Ribbon folder. This is a macro-enabled file. Make sure you change the “Save As Type” to docm.
3) Go to the Ribbon folder and add a zip extension to customUI.docm. It should now be customUI.docm.zip. Open the zip file with your zip utility or use the built-in zip support of Windows XP. The docm file is a zip file in disguise. You should now see three folders (_rels, docProps, and word) and one file called [Content_Types].xml.
4) Extract the folder _rels to your Ribbon folder.
5) In the _rels folder, open the .rels file with a text editor such as Notepad. Replace the content of the file with the following code below. This only sets the relationship allowing you to modify the Ribbon interface as specified by the file customUI.xml. We will modify customUI.xml file in the next step.

<customUI xmlns="http://schemas.micro...6/01/customui">  <ribbon>	<tabs>	  <tab idMso="TabHome">		<group idMso="GroupStyles" visible="false" />		<group id="Shortcuts" label="My Shortcuts" insertBeforeMso="GroupClipboard">		  <button idMso="FileSave" showLabel="false" />	  <splitButton idMso="FileSaveAsMenu" showLabel="false" />	  <splitButton idMso="FilePrintMenu" showLabel="false" />	  <button idMso="ZoomOnePage" />	  <button idMso="ZoomPageWidth" />		  <checkBox idMso="ViewThumbnails" />	</group>	<group id="NewInsert" label="Insert Objects">		  <gallery idMso="TableInsertGallery" />		  <button idMso="PictureInsertFromFile" />	  <toggleButton idMso="ClipArtInsert" />	  <gallery idMso="TextBoxInsertGallery" />		  <gallery idMso="SymbolInsertGallery" />		  <gallery idMso="GalleryAllShapesAndCanvas" />	</group>	<group id="NewPageLayout" label="Page Layout">		  <gallery idMso="TableColumnsGallery" />		  <gallery idMso="PageOrientationGallery" />		  <gallery idMso="PageMarginsGallery" />	</group>	  </tab>	  <tab id="EditStyles" label="Edit and Styles" insertBeforeMso="TabInsert">		<group idMso="GroupEditing" />		<group id="EditShorts" label="Quick Edits">	  <button idMso="RedoOrRepeat" />		  <gallery idMso="Undo" />		  <gallery idMso="Redo" />	</group>		<group idMso="GroupClipboard" />		<group idMso="GroupStyles" />	  </tab>	  <tab idMso="TabPrintPreview">		<group id="Reviewing" label="Reviewing">	   	  <dropDown idMso="ReviewDisplayForReview" />		  <menu idMso="ReviewShowMarkupMenu" />	   	</group>	  </tab>	</tabs>  </ribbon></customUI>

7) The features of the customUI.xml will be explained below. But once you have your customUI.xml modified, drag the _rels and customUI folders to the customUI.docm.zip file. Overwrite the existing files if prompted. Remove the zip extension. Open customUI.docm and you should see the result of your modification. If you do not see a change, then either you have some mistakes in your code or the file conflicts with a modified Ribbon interface in Normal.dotm (in folder “%UserProfile%\Application Data\Microsoft\Templates\”). If so, try deleting Normal.dotm (back up the file if you need it).
8) Once you open customUI.docm and everything looks correct, click on ‘Save As’ and save the file as a macro-enable document template and call it Normal.dotm. You can replace your existing Normat.dotm with this one so you see the modified Ribbon each time you open Word. See Step 3 on replacing Normal.dotm.


Step 2: Modifying the customUI.xml

Control IDs

Each built-in button, split button, drop-down menu, menu, toggle button, checkbox, etc. that you see in the Ribbon interface is called a control. Each control has a unique Control ID that calls that control. Each tab and group also has a Control ID. In order to modify the Ribbon, you must know the Control ID that you want to manipulate and the type of control it is. The list of Control IDs can be downloaded from Microsoft’s website from the following URL: Office Control IDs or search for “Lists of Control IDs”.

Structure

The basic structure of customUI.xml is the following code:

<customUI xmlns="http://schemas.microsoft.com/office/2006/01/customui">
  <ribbon>
	<tabs>
	  <tab id="XXX" label="XXX">
		<group id="XXX" label="XXX">
		  <button id="XXX" label="XXX" />
		</group>
	  </tab>
	</tabs>
  </ribbon>
</customUI>

Tabs

First, lets modify tabs. To modify a built-in tab (or any other built-in control), idMso tag is used. The built-in tabs Home, Insert, View, etc. are named TabHome, TabInsert, TabView, etc. For a complete list, refer to the list of Control IDs. To modify the Home tab, the following code is used.

<tab idMso="TabHome">
</tab>

Groups

Groups are defined the same way as Tabs. With groups, however, you may want to hide them if you don’t use them in addition to creating your own group.

<tab idMso="TabHome">
   <group idMso="GroupStyles" visible="false" />
   <group id="Shortcuts" label="My Shortcuts" insertBeforeMso="GroupClipboard">
	  <button idMso="FileSave" showLabel="false" />
	  <splitButton idMso="FileSaveAsMenu" showLabel="false" />
	  <splitButton idMso="FilePrintMenu" showLabel="false" />
	  <button idMso="ZoomOnePage" />
	  <button idMso="ZoomPageWidth" />
	  <checkBox idMso="ViewThumbnails" />
   </group>
</tab>

This code modifies your Home tab in the following way:
• The Styles group is hidden with visible=“false”. idMso is used since it is a built-in group.
• A “My Shortcuts” group is created before the built-in Clipboard group. It is given the id Shortcuts.
• The rest of the items are individual controls that are displayed within the My Shortcuts group. They are explained in Controls section below.
• Note that built-in groups are simply ended with />. For your custom groups, however, you’ll need a </group> tag since you will have controls defined within the group.

Controls

Each control begins with the type of control. For example, a control can be a button, split button, drop-down menu, menu, toggle button, check box, gallery, etc. If you mismatch the Control ID with the control type, your Ribbon will not display correctly.
In the code above, the following controls are added to the ‘My Shortcuts’ group.
• A ‘Save’ button is added.
• Split buttons ‘Save As’ and ‘Print’ are added. Note the case-sensitive splitButton control type. By setting showLabel=“false”, only the icon is displayed.
• Buttons for ‘One Page’ view and ‘Page Width’ view are added. This will display with icon and text since showLabel=“false” is omitted.
• The check box ‘Thumbnails’ is displayed.

Creating a New Group

To create your own group, simply use the id tag instead of idMso. You also need a label tag to define the display name.

<tab idMso="TabInsert">
  <group id="MyGroup" label="My Group">
  </group>
</tab>

This creates a group called “My Group” in the Insert tab. The id of the group is MyGroup. You must define an id and it should not have any spaces.

The following piece of code is under the idMso=“TabHome” so it will create the group in the Home tab.

<group id="NewInsert" label="Insert Objects">
   <gallery idMso="TableInsertGallery" />
   <button idMso="PictureInsertFromFile" />
   <toggleButton idMso="ClipArtInsert" />
   <gallery idMso="TextBoxInsertGallery" />
   <gallery idMso="SymbolInsertGallery" />
   <gallery idMso="GalleryAllShapesAndCanvas" />
</group>
<group id="NewPageLayout" label="Page Layout">
   <gallery idMso="TableColumnsGallery" />
   <gallery idMso="PageOrientationGallery" />
   <gallery idMso="PageMarginsGallery" />
</group>

This code adds to the Home tab:
• Galleries for inserting tables, text boxes, symbols, and shapes.
• Button for inserting pictures.
• A toggle button for inserting clipart. Note the case-sensitive control toggleButton.

Creating a New Tab

You may want to create a new tab, especially if you removed groups from a built-in tab. For example, I removed the Styles group from the Home tab since I don’t use Styles that often. I created a group called Edit and Styles and put the Styles group there since I want access to it.

The method of creating your own tab is similar to creating a new group.

<tab id="MyTab" label="My Tab">
  <group id="MyGroup" label="My Group">
  </group>
</tab>

This creates the tab “My Tab” and the group “My Group” in My Tab.

<tab id="EditStyles" label="Edit and Styles" insertBeforeMso="TabInsert">
   <group idMso="GroupEditing" />
   <group id="EditShorts" label="Quick Edits">
	  <button idMso="RedoOrRepeat" />
	  <gallery idMso="Undo" />
	  <gallery idMso="Redo" />
   </group>
   <group idMso="GroupClipboard" />
   <group idMso="GroupStyles" />
</tab>

This creates a tab called “Edit and Styles”. It includes the built-in groups Editing, Clipboard, and Styles. It also creates editing shortcuts for undoing and redoing.


Step 3: Modifying and Testing

The modified Ribbon in customUI.docm displays correctly only if Normal.dotm does not exist in “%UserProfile%\Application Data\Microsoft\Templates\” or it is the default one created by Word. If you try opening customUI.docm after replacing Normal.dotm with a modified one, Word may not display the Ribbon appropriately. Every time you modify customUI.docm and you want to see the effect, you should ensure that Normal.dotm in “%UserProfile%\Application Data\Microsoft\Templates\” is the default file created by Word, not the modified file.

Now that you have your customUI.xml file set, you’ll want to play around and test it out. Once you have everything setup, you will only have to modify customUI.xml. Once it is modified, drag the folder customUI to customUI.docm.zip. Remove the zip extension and open to test it.

Once you get the Ribbon the way you want it, use the ‘Save As’ to save it as a macro-enable document template and call it Normal.dotm. Replace your Normal.dotm in “%UserProfile%\Application Data\Microsoft\Templates\”. If you modify customUI.docm again, you must delete Normal.dotm, then open customUI.docm to test the effect.

Conclusion

Modifying the Ribbon Interface is simple if you know the Control IDs of each control in Word.

[CaptTechDude514]

nice tutorial, thanks :thumb_yello:

[ricktendo]

Hey I did not see this thanks for bumping

[JurgenDoe]

Nice Tut N1K but I'm very lazy to follow all the steps and would like to have this already done for me so I don't have to much work to do. :icon_rolleyes:

Do I need to before you through anything to me :whistle:

[NIM]

Nice Tut N1K but I'm very lazy to follow all the steps and would like to have this already done for me so I don't have to much work to do. :icon_rolleyes:

Do I need to before you through anything to me :whistle:

LOL, don't be lazy

[Anubix]

Hello. I downloaded the Custom UI Editor and the LIst of Control IDs. I have a .dotm file that I brought in from Word 2003 and converted to 2007. All the macros work in Word 07. This template should also have a custom Ribbon tab. I was able to use the editor and add the tab, I was able to add a custom button to one of my macros. Now I need to add a few built-in buttons like AlignLeft, AlignRight, FileSaveAs, etc.

Some of my built-in buttons work and some don't. I'm taking the idMso from the List of Control IDs I downloaded from Microsoft as suggested above in the original post. What I'm I missing. Here's my code so far. AlignLeft and AlignRight don't work.

[codebox]<customUI xmlns="http://schemas.micro...6/01/customui">
<ribbon startFromScratch="false">
<tabs>
<tab id="SLK" label="SLK">
<group id="Format" label="Formatting Buttons">
<button idMso="AlignLeft" label="Left Align" size="normal"/>
<button idMso="AlignRight" label="Right Align" size="normal"/>
<button idMso="CellsDelete" label="Delete Cells" size="normal"/>
<button idMso="TableColumnsDelete" label="Delete Columns" size="normal"/>
<button idMso="TableRowsDelete" label="Delete Rows" size="normal"/>
<button idMso="TableDelete" label="Delete Table" size="normal"/>
</group>
</tab>
</tabs>
</ribbon>
</customUI>[/codebox]

[CRB]

Eventhough this topic is rather old I must admit that this one helped me out aswell to understanding how the ribbon worked and even to get my work done properly.

Thank you for a great guide.

[pri2sh]

nice guide thanks , i never noticed it before. it also doesnot seem to be hard

[AMIRZ]

Cool tutorial looks very useful, saved and bookmarked, thanks for sharing!

[onlineforum]

LOL, don't be lazy

well sometimes the bum [like me] is old fashioned..
and convert them to the good ol drop down menu
its uncouth i know, but THAT is what i had done with 2007
Classic Menu for Office 2007

For those who are game for discovery can digggg up the pages here:
Office UI Customization

http://technet.microsoft.com/en-us/magazine/2009.05.ribbon.aspx


I have since graduated to the Custom UI Editor Tool to tweak Excel which I use extensively.


so choose whats your poison!

[ricktendo]

Gr8 links

[onlineforum]

Gr8 links

cheers