All about Ribbon in SharePoint 2010 - SharePoint Saturday Vietnam


Published on

SharePoint 2010 interface customization can be very useful in order to carry out operations on lists and items or in order to widen the normal SharePoint behavior in a way that you can add some custom functionality, which is useful for our applications.

Presented by Nguyen Tuan Hai, this presentation focuses on the best practices to develop a custom Ribbonon top of the default layout of the new version of SharePoint.

SharePoint Saturday Vietnam was sponsored by Officience. Visit

Published in: Technology, Business
  • Be the first to comment

  • Be the first to like this

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

All about Ribbon in SharePoint 2010 - SharePoint Saturday Vietnam

  1. 1. Ribbon SharePoint 2010 Nguyen Tuan Hai [email_address]
  2. 2. Ribbon SharePoint 2010 Introducing the Ribbon SharePoint Ribbon Architecture Customizing the Ribbon
  3. 3. Introducing the Ribbon Site Actions Menu, Navigate Up and Edit page quick access buttons.
  4. 4. Introducing the Ribbon Page tab Browser tab
  5. 5. Introducing the Ribbon Item tab List tab
  6. 6. Introducing the Ribbon New form
  7. 7. Introducing the Ribbon On-demand
  8. 8. Introducing the Ribbon Context-sensitive operations with controls status
  9. 9. SharePoint Ribbon Architecture
  10. 10. SharePoint Ribbon Architecture
  11. 11. SharePoint Ribbon Architecture Tab Group Control
  12. 12. SharePoint Ribbon Architecture Example: 14TEMPLATEGLOBALXMLCMDUI.XML
  13. 13. SharePoint Ribbon Architecture PageManager: a single instance of every page. It’s defined in CUI.js and holds the focus manager (CUI.Page.FocusManager), command dispatcher (CUI.Page.CommandDispatcher), undo manager (CUI.Page.UndoManager) and other supporting objects. Ribbon Communication
  14. 14. SharePoint Ribbon Architecture CommandDispatcher: registers all commands for ribbon and keeps the track of PageComponent. When command receive to PageManager, PageManager handovers the command to CommandDispatcher then CommandDispatcher routs the command to appropriate PageComponent. Ribbon Communication
  15. 15. SharePoint Ribbon Architecture PageComponent: is the one who has actual implementation of commands. This is inherited by CUI.PageComponent. So Custom PageComponent should always follow the same class structure as CUI.PageComponent has Ribbon Communication
  16. 16. Customizing Ribbon <ul><li>Declaring controls </li></ul><ul><li>Handling commands </li></ul><ul><li>Make a context-sensitive and associate with tabs </li></ul>
  17. 17. Customizing Ribbon Label Menu Menu Section MRU Split Button Spinner Split Button Textbox ToggleButton Controls Button Checkbox Color Picker Combo Box Drop Down Flayout Anchor Insert Table
  18. 18. Customizing Ribbon Example:
  19. 19. Customizing Ribbon Handling commands <ul><ul><li>Declare command handlers inline in the XML. </li></ul></ul><ul><ul><li>Regist a PageComponent to hande more complex commands. </li></ul></ul>
  20. 20. Customizing Ribbon Handling commands
  21. 21. Customizing Ribbon Handling commands
  22. 22. Customizing Ribbon Make a context-sensitive <ul><ul><li>- Associate with a list template or content type </li></ul></ul><ul><ul><li>- Use code to bring un-associated tabs to view </li></ul></ul><ul><ul><li>- Associate web part with contextual group tabs </li></ul></ul>
  23. 23. Customizing Ribbon
  24. 24. Customizing Ribbon Demo
  25. 25. Reference [+] SharePointVietNam Forum: [+] MSDN: [+] SharePoint Blog [+] SharePoint videos & e-books:
  26. 26. FAQ Q&A