In a recent Extreme Makeover class, a student asked how they could close a Post in a SharePoint blog site for comments. They still wanted users to be able to read the blog post and read existing comments, but they didn't want them to be able to post comments on it. Kevin Pine and I worked together to create the following solution using some JavaScript in a Content Editor Web Part on the Posts.aspx page.
Add a Custom Column to the Posts List to Allow Comments
We needed some way for the blog owners to indicate when a post had been closed. On the Posts list, we added a new column named Allow Comments. We set the Type as Yes/No (check box) and the Default Value to Yes.
Update the Posts.aspx Page to Show the Value of the Allow Comments Column
Users can only submit comments while reading an individual post. This view of a blog post is generated by the Posts/Posts.aspx page. I clicked on the title of one of my blog posts to view the post in this page.
The Post Footer is displayed at the bottom of the post and above the comments section.
We needed the value of our new Allow Comments field to show up in the Post Footer. To accomplish this, we edited the current view by doing the following:
- Click on Site Actions, Edit Page.
- On the Posts web part, click on edit, Modify Shared Web Part.
- In the task pane, click on Edit the current view.
- Check the box beside Allow Comments, and click OK.
- View the blog post again and notice that the Allowed Comments value is now visible in the Post Footer.
Add the JavaScript to Hide the New Comment Fields If the Post is Closed for Comments
The form to submit new comments only appears on the Posts/Posts.aspx page. This means that we can add some JavaScript to this page to hide it if the phrase Allow Comments: No appears in that bottom line. Here is what we did to get the JavaScript on the page.
- While viewing a post in the Posts/Posts.aspx page, click on Site Actions, Edit Page.
- In the Right Web Part Zone, click on Add a Web Part.
- Select the Content Editor Web Part.
- Click the link to open the tool pane.
- Click on the Source Editor button.
- Paste in the following JavaScript code and click the Save button. Note that the code is fairly well commented if you are interested in what it is actually doing.
<script language="JavaScript">
//add an entry to the _spBodyOnLoadFunctionNames array//so that our function will run on the pageLoad event
_spBodyOnLoadFunctionNames.push("hideComments");
function hideComments() {
//Create an array to store all elements to which
//the ms-PstFooter class have been applied
var PostFooterArray = getElementsByClass('ms-PostFooter');
//Check to see if the first element of the array contains
//the text "Allow Comments: No"
if(PostFooterArray[0].innerHTML.indexOf('Allow Comments: No')!= -1){
//create an array to store the SPAN tag with the ID of part1
var commentSPAN = document.getElementById("part1");
//Replace the comment form controls with my own HTML statement
commentSPAN.innerHTML = '<b>Comments have been closed on this post.</b>';
}
}
function getElementsByClass(theClass) {
//From: http://www.seandempsey.com/code/getElementsByClass.php
var allPageTags = new Array();
//Populate the array with all the page tags
allPageTags=document.getElementsByTagName("*");
var Elements = new Array();
//Cycle through the tags
var n = 0;
for (i=0; i<allPageTags.length; i++) {
//Pick out the tags with our class name
if (allPageTags[i].className==theClass) {
Elements[n] = allPageTags[i];
n++;
}
}
return Elements;
}
</script>
- In the tool pane, expand the Appearance section.
- Set the Chrome Type to None.
- Click OK to close the tool pane.
- Click Exit Edit Mode.
Testing the Solution
My first blog post had the check box for the Allow Comments field checked. I can see the fields to post a comment.
If I uncheck the Allow Comments field and view the post, I can see that the comments have been closed.
