{"id":42,"date":"2012-10-31T14:10:00","date_gmt":"2012-10-31T21:10:00","guid":{"rendered":"\/lisa\/post\/2012\/10\/31\/YAPS-about-SSRS-Branding-in-2008-R2.aspx"},"modified":"2021-11-24T11:19:51","modified_gmt":"2021-11-24T19:19:51","slug":"yaps-about-ssrs-branding-in-2008-r2","status":"publish","type":"post","link":"https:\/\/spacefold.com\/lisa\/2012\/10\/31\/yaps-about-ssrs-branding-in-2008-r2\/","title":{"rendered":"YAPS about SSRS Branding in 2008 R2"},"content":{"rendered":"<p style=\"text-align: left;\">&nbsp;<\/p>\n<p style=\"text-align: left;\">Octoni writes with an intriguing question:<\/p>\n<blockquote>\n<p>Hi there,<\/p>\n<p>I&#8217;ve read your article about SSRS report manager branding from url &#8211;&gt; <a href=\"\/lisa\/2010\/06\/28\/Quicker-branding-of-SQL-Server-Report-Manager-2008-R2\/\">https:\/\/spacefold.com\/lisa\/2010\/06\/28\/Quicker-branding-of-<br \/>SQL-Server-Report-Manager-2008-R2.<\/p>\n<p><\/a>What I&nbsp;want to ask is there any techniques to customize the breadcrumb link, so I can all the breadcrumb link flow, except the &#8220;Home&#8221;. I want to hide the &#8220;Home&#8221; breadcrumb link..<\/p>\n<p>thanks<\/p>\n<\/blockquote>\n<p>Hmmm.&nbsp; I figured there might be some way to do this with CSS, so I verified with Octoni that s\/he is, in fact, using SSRS 2008 R2. (As you may recall, there are significant differences in the CSS between 2005\/2008 and 2008 R2\/2012.)<\/p>\n<p>Then I took a look at the breadcrumbs in question, on my local\/vanilla SSRS 2008 R2 implementation, which looks something like this:<\/p>\n<p><img decoding=\"async\" style=\"display: block; margin-left: auto; margin-right: auto;\" src=\"\/lisa\/wp-non\/migrated\/2012\/10\/Breadcrumb1.png\" alt=\"\" \/><\/p>\n<p><em>View<\/em>ing<em> Source<\/em> for Report Manager shows me that we&#8217;re getting this line from a table, with the opening tag looking like this:<\/p>\n<p class=\"code\">&lt;<span style=\"color: #a31515; font-size: x-small;\"><span style=\"color: #a31515; font-size: x-small;\">table <\/span><\/span><span style=\"color: #ff0000; font-size: x-small;\"><span style=\"color: #ff0000; font-size: x-small;\">class<\/span><\/span><span style=\"color: #0000ff; font-size: x-small;\"><span style=\"color: #0000ff; font-size: x-small;\">=&#8221;msrs-topBreadcrumb&#8221; <\/span><\/span><span style=\"color: #ff0000; font-size: x-small;\"><span style=\"color: #ff0000; font-size: x-small;\">cellpadding<\/span><\/span><span style=\"color: #0000ff; font-size: x-small;\"><span style=\"color: #0000ff; font-size: x-small;\">=&#8221;0&#8243; <\/span><\/span><span style=\"color: #ff0000; font-size: x-small;\"><span style=\"color: #ff0000; font-size: x-small;\">cellspacing<\/span><\/span><span style=\"color: #0000ff; font-size: x-small;\"><span style=\"color: #0000ff; font-size: x-small;\">=&#8221;0&#8243; <\/span><\/span><span style=\"color: #ff0000; font-size: x-small;\"><span style=\"color: #ff0000; font-size: x-small;\">border<\/span><\/span><span style=\"color: #0000ff; font-size: x-small;\"><span style=\"color: #0000ff; font-size: x-small;\">=&#8221;0&#8243; <\/span><\/span><span style=\"color: #ff0000; font-size: x-small;\"><span style=\"color: #ff0000; font-size: x-small;\">width<\/span><\/span><span style=\"color: #0000ff; font-size: x-small;\">=&#8221;100%&#8221;&gt;<\/span><\/p>\n<p>&#8230; so I figured we might be able to do something with that msrs-topBreadcrumb class.<\/p>\n<p>Sure enough, ReportingServices.css has a definition for that class as follows (remember, this file belongs to Report Manager and will be found somewhere like <strong>&lt;MSSQLServer Location&gt;\\&lt;InstanceName&gt;\\Reporting Services\\ReportManager\\Styles<\/strong>):<\/p>\n<p class=\"code\">table.msrs-topBreadcrumb {background-color: #EBF3FF; <br \/>&nbsp;&nbsp; font-family: Verdana, Arial, Helvetica, sans-serif; <br \/>&nbsp;&nbsp; font-size: 84%; font-weight:normal; color:#666666; }<\/p>\n<p>&#8230; after dinking around with this for a while, I found that the following produced pretty good results in all browsers.&nbsp; My additions to the style are<span style=\"background-color: #ffff99;\"> highlighted:<\/span><\/p>\n<p class=\"code\">table.msrs-topBreadcrumb {<span style=\"background-color: #ffff99;\">margin-left:-55px;width:105%;<\/span>&nbsp;<br \/>&nbsp;&nbsp; background-color: #EBF3FF; font-family: Verdana, Arial, Helvetica, sans-serif; <br \/>&nbsp;&nbsp; font-size: 84%; font-weight:normal; color:#666666; }<\/p>\n<p>&#8230; as you can see here:<\/p>\n<p><img decoding=\"async\" style=\"display: block; margin-left: auto; margin-right: auto;\" src=\"\/lisa\/wp-non\/migrated\/2012\/10\/Breadcrumb2.png\" alt=\"\" \/><\/p>\n<p>&#8230; and that&#8217;s about as good a way of doing it as I can think of, without rewriting the Report Manager UI.**<\/p>\n<p>Caveats and further comments:<\/p>\n<ul>\n<li>The negative margin value I&#8217;ve added is obviously the key trick. I&nbsp;then added the width value to stretch the table a little bit, so as not to have white space on the right side of the breadcrumb table. There&#8217;s probably a better way to do this but I will leave that as an exercise for those of you who actually understand CSS much better than I do. Which is probably most people &lt;g&gt;.<\/li>\n<li>The actual margin and width values&nbsp;that work in&nbsp;your environment will vary according to the font characteristics in your ReportingServices.css for this class.&nbsp; So you can&#8217;t just plop in my mods, you have to play with it for a while, as I did. <br \/>OTOH, once I did find the right margin value for my CSS, it did look reasonably good in different browsers and window sizes,&nbsp;and even&nbsp;at different zoom levels.&nbsp;<\/li>\n<li>As you can see above, you can still get to the &#8220;Home&#8221; (root) of your folders, either typing an explicit URL into your address bar or using the &#8220;Home&#8221; link on the right side of the same row of the breadcrumb table.&nbsp; Octoni didn&#8217;t ask for a way of removing that&nbsp;right-side link,&nbsp;and I&#8217;m not sure it&#8217;s germane to his\/her requirements.&nbsp; <br \/>Maybe s\/he just wants to make the breadcrumb trail neater since the &#8220;Home&#8221; breadcome is kind of redundant.&nbsp; Or maybe&nbsp;the folder names are long and s\/he doesn&#8217;t want to waste the space.<\/li>\n<li>&#8220;Reasonably good&#8221; doesn&#8217;t mean that this change&nbsp;erases any of the other deficiencies of Report Manager CSS in many modern browsers. **<br \/>&nbsp;<br \/>**But then, <a title=\"blog post on why you shouldn't use the Report Manager\" href=\"\/lisa\/2011\/07\/03\/Nixing-the-Report-Manager\/\">some of us think<\/a> that you shouldn&#8217;t expose Report Manager to your users anyway. \ud83d\ude09<\/li>\n<\/ul>\n<p>Good luck !&nbsp; Let me know how it goes&#8230;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; Octoni writes with an intriguing question: Hi there, I&#8217;ve read your article about SSRS report manager branding from url &#8211;&gt; https:\/\/spacefold.com\/lisa\/2010\/06\/28\/Quicker-branding-of-SQL-Server-Report-Manager-2008-R2. What I&nbsp;want to ask is there any techniques to customize the breadcrumb link, so I can all the breadcrumb link flow, except the &#8220;Home&#8221;. I want to hide the &#8220;Home&#8221; breadcrumb link.. thanks<a class=\"more-link\" href=\"https:\/\/spacefold.com\/lisa\/2012\/10\/31\/yaps-about-ssrs-branding-in-2008-r2\/\">Read more<\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[],"class_list":["post-42","post","type-post","status-publish","format-standard","hentry","category-reporting"],"_links":{"self":[{"href":"https:\/\/spacefold.com\/lisa\/wp-json\/wp\/v2\/posts\/42","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/spacefold.com\/lisa\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/spacefold.com\/lisa\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/spacefold.com\/lisa\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/spacefold.com\/lisa\/wp-json\/wp\/v2\/comments?post=42"}],"version-history":[{"count":1,"href":"https:\/\/spacefold.com\/lisa\/wp-json\/wp\/v2\/posts\/42\/revisions"}],"predecessor-version":[{"id":494,"href":"https:\/\/spacefold.com\/lisa\/wp-json\/wp\/v2\/posts\/42\/revisions\/494"}],"wp:attachment":[{"href":"https:\/\/spacefold.com\/lisa\/wp-json\/wp\/v2\/media?parent=42"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/spacefold.com\/lisa\/wp-json\/wp\/v2\/categories?post=42"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/spacefold.com\/lisa\/wp-json\/wp\/v2\/tags?post=42"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}