Remove group headings

Summary: when grouping a library the column that is selected for grouping displays before each header. Use remove group headings to only show the columns values.

Instructions:

1. Copy and paste this script into a txt file: (ex: notepad)
   <script type=”text/javascript” language=”javascript”>
   _spBodyOnLoadFunctionNames.push(“HideHeaders”);
   function HideHeaders() {
   var elements = getElementsByClassName(document, “td”, “ms-gb”);
   var elem;
   for (var i = 0; i < elements.length; i++) {
   elem = elements[i];
   elem.childNodes[3].style.display = “none”;
   elem.childNodes[4].nodeValue = elem.childNodes[4].nodeValue.replace(‘:’, ”);
   }
   elements = getElementsByClassName(document, “td”, “ms-gb2”);
   for (var i = 0; i < elements.length; i++) {
   elem = elements[i];
   elem.childNodes[3].style.display = “none”;
   elem.childNodes[4].nodeValue = elem.childNodes[4].nodeValue.replace(‘:’, ”);
   }
   }
   function getElementsByClassName(oElm, strTagName, strClassName) {
   var arrElements = (strTagName == “*” && oElm.all) ? oElm.all : oElm.getElementsByTagName(strTagName);
   var arrReturnElements = new Array();
   strClassName = strClassName.replace(/\-/g, “\\-“);
   var oRegExp = new RegExp(“(^|\\s)” + strClassName + “(\\s|$)”);
   var oElement;
   for (var i = 0; i < arrElements.length; i++) {
   oElement = arrElements[i];
   if (oRegExp.test(oElement.className)) {
   arrReturnElements.push(oElement);
   }
   }
   return (arrReturnElements)
   }
   </script>
   <script type=”text/javascript” language=”javascript”>
   _spBodyOnLoadFunctionNames.push(“HideHeaders”);
   function HideHeaders() {
   var elements = getElementsByClassName(document, “td”, “ms-gb”);
   var elem;
   for (var i = 0; i < elements.length; i++) {
   elem = elements[i];
   elem.childNodes[0].childNodes[1].nodeValue = “”;
   elem.childNodes[1].nodeValue = elem.childNodes[1].nodeValue.replace(‘:’, ”);
   }
   elements = getElementsByClassName(document, “td”, “ms-gb2”);
   for (var i = 0; i < elements.length; i++) {
   elem = elements[i];
   elem.childNodes[1].childNodes[1].nodeValue = “”;                elem.childNodes[2].nodeValue = elem.childNodes[2].nodeValue.replace(‘:’, ”);
   }
   }
   function getElementsByClassName(oElm, strTagName, strClassName) {
   var arrElements = (strTagName == “*” && oElm.all) ? oElm.all : oElm.getElementsByTagName(strTagName);
   var arrReturnElements = new Array();
   strClassName = strClassName.replace(/\-/g, “\\-“);
   var oRegExp = new RegExp(“(^|\\s)” + strClassName + “(\\s|$)”);
   var oElement;
   for (var i = 0; i < arrElements.length; i++) {
   oElement = arrElements[i];
   if (oRegExp.test(oElement.className)) {
   arrReturnElements.push(oElement);
   }
   }
   return (arrReturnElements)
   }
   </script>Disclaimer: I did not write this script; it is from here: Bistesh Jois’s blog.
2. Save the file at site collection level / top level site. I like to use the site collection documents library – this clearly identifies the content in there as documents used across the site
   
3. Navigate to the library/ webpage that is displaying with groupings
4. Edit the page
   1. Top right hand corner of the page, select the settings cog then edit page
5. Add a content editor web part to the page
   1. Select Add a web part, in the Media and content folder, select content editor
6. Edit the web part
   1. Select the dropdown arrow to the right of the web part ribbon, then select edit web part
7. In the webpart editor window on the right side of the page
   1. Paste the url to the text file at the top, in the content link box
   2. Under the appearance section, update the title to Remove Group Headings and change the chrome type to none. This will make the web part ribbon not display
8. The groups should now display with the values only – without the column name.