We are using the out-of-the-box Blog Details template in a current SharePoint 2010 solution we are building. Our problem is that out-of-the-box, when you click on the body of the blog post, or on the comments at the bottom, the ribbon is shown at the top of the page, hiding our custom page header and displaying tools that our site visitors should not see.

After doing some investigation, it seems that the onclick event of the containing div was firing the Command UI JavaScript helper on the page after it was loaded. We can toggle whether the Command UI should show or not using an object model, but only at the time the page is rendered and not when it's dynamically rendered when the post is selected with a mouse down click.

What we ended up doing is using jQuery to remove the click event. Here is what we did:

  1. We registered the jQuery scripts as shown in my previous blog post here. This explains how to get your scripts registered.
  2. In the 'PreRender' method (ours was called 'RatingControlDelegate' in the post linked above) we added one more script block registration.
        if (!SPContext.Current.Web.UserIsSiteAdmin)
                    initScript = new StringBuilder("$(document).ready(function() {");
                    // register inline script block
                        this, "disableRibon", initScript.ToString()

What this script does is quite straight forward — it finds elements with class 'ms-commentsWrapper' and then looks for the first parent element with class 's4-wpcell' and it removes the 'onmousedown' attribute. It does the same with all 'ms-blogpostdatecol' elements. We only remove the ribbon for users who are not Site Administrators, as Site Administrators will likely need ribbon. There may be a better way to do this, but this works quite effectively.