Collapse & expand SP 2013 Webparts

Question

Is there a way to place a lot of Content Editor Web parts on a page in minimized form allowing the user to expand and collapse them?

The controls in each webpart suggest this can be done but the control doesn't appear on each control when the page is published?

Answer 1

If you want to expand and collapse web part in SharePoint 2013, there is a solution as follows:

1. Find the classes of div tags of title and content of this web part using IE developer(F12), in my environment, they are like ms-webpart-chrome-title and ms-wpContentDivSpace.

2. Then use the script below to expand and collapse your web part:

   <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
   
   <script type="text/javascript">
   
   jQuery(document).ready(function() {
      jQuery(".ms-wpContentDivSpace ").hide();
      //toggle the component with class msg_body
      jQuery(".ms-webpart-chrome-title ").click(function(){
         jQuery(this).next(".ms-wpContentDivSpace ").slideToggle(500);
      });
   });
   </script>
   

3. Then when we click the title of the web part, it will expand or collapse.

Expanding and Collapsing Webparts in SP 2013

Minimize webparts in SharePoint 2013