Hiding Empty Web Parts

[SteveE]

Here’s some code that will completely hide empty web parts in classic web part or wiki pages.

• Right click and inspect “There are no items to view…” Find the web part IDs that you wish to hide when empty.
• Add a CEWP with this script, changing the web part IDs:

<script language="JavaScript">
var pageIsInEditMode = false;
if (typeof MSOWebPartPageFormName !== "undefined") {
    if (document.forms[MSOWebPartPageFormName]._wikiPageMode !== undefined && document.forms[MSOWebPartPageFormName]._wikiPageMode.value !== "") {
        pageIsInEditMode = true;
    }
    if (document.forms[MSOWebPartPageFormName].MSOLayout_InDesignMode !== undefined && document.forms[MSOWebPartPageFormName].MSOLayout_InDesignMode.value === "1") {
        pageIsInEditMode = true;
    }
}
if(pageIsInEditMode){
    // Is in edit mode
}else{
    // Not in edit mode
if ($("#empty-WPQ12").length){
document.getElementById("MSOZoneCell_WebPartWPQ12").style.display = "none";
}
if ($("#empty-WPQ10").length){
document.getElementById("MSOZoneCell_WebPartWPQ10").style.display = "none";
}
}
</script>

One thing to note is that sometimes the web part IDs seem to change if you add or delete parts so make sure you pay attention if this occurs.

Bonus: If you just want to hide the “There are no items to view…” text and also tighten up empty web parts, use this script:

<style type="text/css">
.ms-list-emptyText-compact 
{display: none;}
</style>

• This topic was modified 2 years, 8 months ago by SteveE.
• This topic was modified 2 years, 8 months ago by SteveE.
• This topic was modified 2 years, 8 months ago by SteveE.

[Author]

Posts