Below is snapshot of OOTB SharePoint 2010 Blog:
If you have similar requirement then this post will help you. To hide comments, you have do following:
1. You have to remove Comments Listing web-part (that is easy!!!)
2. You have to remove Comments Form web-part (that is easy!!!)
3. Hiding comments links (this is one of the requirement from my client) using jQuery/javascript OR blog.xsl
Before writing javascript, I did some research/investigation that how comments are rendered. I found an blog.xsl located at /_layouts/XSL/blog.xsl
I don't want to touch the OOTB blog.xsl as it would apply to every site collection. So I decided to write javascript function to hide comments.
From above picture, you can see the div for comments link. I need to find that div and find the last SPAN which contains comments link.
I googled and found the javascript to get that elements by class. Once I got that div, I iterated and scan the word 'comments' and made that span hidden.
Below code will grab the div element for class 'ms-PostFooter'
function getElementsByClass(theClass) { var allPageTags = new Array(); allPageTags = document.getElementsByTagName("*"); var Elements = new Array(); var n = 0; for (i = 0; i < allPageTags.length; i++) { if (allPageTags[i].className == theClass) { Elements[n] = allPageTags[i]; n++; } } return Elements; }
If you pay attention to above html source code, you will find there are two divs for class = 'ms-PostFooter', so we need to skip the first one and work on second div.
function hideComments() { var desiredElements = getElementsByClass('ms-PostFooter'); if (desiredElements.length > 0) { for (var i = 0; i < desiredElements.length; i++) { var desiredElement = desiredElements[i]; if (desiredElement.innerHTML.indexOf('Comment(s)', 0) >= 0) { var spans = desiredElement.getElementsByTagName("SPAN"); for (var j = 0; j < spans.length; j++) { if( (spans[j].innerHTML.indexOf('comment(s)', 0) >= 0) || (spans[j].innerHTML.indexOf('Comment(s)', 0) >= 0) ) { spans[j].style.visibility = 'hidden'; } if( spans[j].innerHTML.indexOf('Number of Comments', 0) >= 0 ) { spans[j].style.visibility = 'hidden'; } } } } } }
Now, you have got codes. Copy all javascript code to a file and place it to /_layouts/YourProjectName/Js/BlogCommentsHider.js Now add a content editor web-part on page and write below markup:
<script src="/_layouts/YourProjectName/Js/BlogCommentsHider.js" type="text/javascript"></script><script language="javascript"> _spBodyOnLoadFunctionNames.push("hideComments");</script>
That's it.
No comments:
Post a Comment