{"id":796,"date":"2010-10-24T10:34:46","date_gmt":"2010-10-24T08:34:46","guid":{"rendered":"http:\/\/www.itidea.nl\/?p=796"},"modified":"2015-09-08T20:34:46","modified_gmt":"2015-09-08T18:34:46","slug":"custom-ribbon-button-doesnt-show-up","status":"publish","type":"post","link":"https:\/\/www.itidea.nl\/index.php\/custom-ribbon-button-doesnt-show-up\/","title":{"rendered":"Custom Ribbon button doesn&#8217;t show up"},"content":{"rendered":"<p><a href=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsNotShown.png\"><\/a>Ribbon customizations are not that easy to troubleshoot. If something is wrong, the customization simply doesn&#8217;t show up.<\/p>\n<p>Beside debug the JavaScript (SP.Ribbon.debug.js), checking the sequence of e.g. the button definition (not multiples of 10 or 100, because SharePoint uses these) and if the function name in the definition of the button, the command attribute, and the function name in the CommandUIHandler are the same, there is another important and easily overlooked issue.<\/p>\n<p>Suppose a customization is registered on a list. A nice example to visualize this is the post\u00a0 <a href=\"https:\/\/www.itidea.nl\/index.php\/a-better-user-experience-with-the-dialog-framework-and-notifications\/\" target=\"_blank\">A better user experience with the dialog framework and notifications<\/a><a href=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsButtonOnList.png\"><\/a>. The button &#8220;Mark item(s) as completed&#8221; is shown in the Items tab when one or more items are selected in the list.<br \/>\n<a href=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsButtonOnList.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-797\" title=\"RibbonMarkItemsButtonOnList\" src=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsButtonOnList.png\" alt=\"\" width=\"365\" height=\"300\" srcset=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsButtonOnList.png 365w, https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsButtonOnList-300x246.png 300w\" sizes=\"auto, (max-width: 365px) 100vw, 365px\" \/><\/a><\/p>\n<p>The next step here is to add a list instance as a webpart on another page. When this webpart is selected on the page it was just added, the button does not appear on the menu.<\/p>\n<p><a href=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsNotShown.png\"><img loading=\"lazy\" decoding=\"async\" title=\"RibbonMarkItemsNotShown\" src=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsNotShown.png\" alt=\"\" width=\"465\" height=\"307\" \/><\/a><\/p>\n<p>By default, the toolbar type property of the webpart is set to summary toolbar. The summary toolbar doesn&#8217;t load any customizations. So it doesn&#8217;t load the custom button. Setting the toolbar type to full toolbar in the webpart properties of the webpart will show the customization.<br \/>\n<a href=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsShownInPage.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-799\" title=\"RibbonMarkItemsShownInPage\" src=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsShownInPage.png\" alt=\"\" width=\"639\" height=\"320\" srcset=\"https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsShownInPage.png 710w, https:\/\/www.itidea.nl\/wp-content\/uploads\/2010\/10\/RibbonMarkItemsShownInPage-300x150.png 300w\" sizes=\"auto, (max-width: 639px) 100vw, 639px\" \/><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Ribbon customizations are not that easy to troubleshoot. If something is wrong, the customization simply doesn&#8217;t show up. Beside debug the JavaScript (SP.Ribbon.debug.js), checking the sequence of e.g. the button definition (not multiples of 10 or 100, because SharePoint uses &#8230; <a class=\"more-link\" href=\"https:\/\/www.itidea.nl\/index.php\/custom-ribbon-button-doesnt-show-up\/\">Read More &raquo;<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8],"tags":[42],"class_list":["post-796","post","type-post","status-publish","format-standard","hentry","category-sharepoint-2010","tag-sharepoint-2010"],"_links":{"self":[{"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/posts\/796","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/comments?post=796"}],"version-history":[{"count":4,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/posts\/796\/revisions"}],"predecessor-version":[{"id":803,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/posts\/796\/revisions\/803"}],"wp:attachment":[{"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/media?parent=796"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/categories?post=796"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.itidea.nl\/index.php\/wp-json\/wp\/v2\/tags?post=796"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}