You can add rich ToolTips to RibbonItems, RibbonGroups, and RibbonTabs using the ToolTip Editor. In this topic, we will add a rich ToolTip to a RibbonTab.

Complete the following steps:

1. Select C1Ribbon's default tab to activate it. A list of the tab's properties will be revealed in the Properties window.
2. In the Properties window, locate the tab's ToolTip property and click the ellispis (…) button.
   The ToolTip editor opens with the Office tab page in focus.
3. Complete the following tasks in the Office tab page:
   1. Enter "ToolTip Tutorial" into the Title text box.
   2. Click the Image drop-down and select Add Image to access the Open dialog box. Select a small image (an icon of 16x16 pixels is best) and click Open.
      
   3. Check the Top Separator checkbox.
   4. Type the following text into the Body Text text box: "ComponentOne Ribbon for WinForms."
   5. Check the Bottom Separator checkbox.
   6. Type "www.componentone.com" into the Subtitle text box.
   
   The Preview pane will display an image similar to the following:
   
4. Click the Html tab to bring its tab page into focus and then complete the following steps:
   1. In the editor, delete the <b> and </b> tags that enclose "www.componentone.com".
   2. Select "ComponentOne Ribbon for WinForms" and press the Italic button.
      
   3. Place your cursor in front of the title ("ToolTip Tutorial") and type <font color="red">. Move your cursor to the end of the title and type </font>.
   
   The Preview pane will display an image similar to the following:
   
5. Click the Properties tab to bring its tab page into focus and then set the following properties:
   • Set the Border property to True
   • Set the BorderColor property to Red.
   • Set the IsBalloon property to True.
   • Set the IntialDelay property to "50". This means that the ToolTip will appear 50 milliseconds (.05 seconds) after a user hovers over the tab with the cursor.
6. Press OK to close the ToolTip Editor, then press OK to close the C1InputPanel Collection Editor.
   You can also use html table header cells (<th> tags) in the tooltips.

This topic illustrates the following:

Once the project is built, hover over the RibbonTab with your cursor to make the ToolTip appear. The resulting ToolTip will resemble the image below: