Tab Web part is not an OOTB web part of SharePoint 2013. It makes to jQuery and jQuery UI CSS. I have implemented this to many project. Here are following steps implement to SharePoint web part page
Steps for create Tab Web part in SharePoint 2013
1- Open the SharePoint Designer 2013.
2- Open the site collection which used tab web part.
3- Go to the Site Assets Navigation in site.
4- Create a new JavaScript File in Asset Ribbon button.
5- For this I have created a new JavaScript file and written the following code in JavaScript file.
The script looks for the Web Parts specified by the Web Part Titles passed into the “HillbillyTabs” function. A jQuery UI tab is created for each Web Part. The title for the tab is the Title of the Web Part. Then the contents of that Web Part are moved into the created tab’s content area. Finally, the title of the Web Part is hidden since the tab contains the Title. That’s all there is to it. There are following screen shot.
How To Use The Script
1- Create a Web Part Page.
2- Add the various Web Parts into the webpage that you want to make appear in the tabbed view.
3- Add a Content Editor Web Part to the page.
4- Edit the above script so that the call to the “HillbillyTabs” function contains the titles of the Web Parts you wish to appear in the tabbed view. For instance. If you had a Web Part with the title “Key Documents” and another Web Part with the title “HR Forms”, the section of script I have changed would look like this:
jQuery(document).ready(function($) {
HillbillyTabs(["Key Documents","HR Forms","Policies", "Regional sites", "Benefits","Comp-Training Mngt","Admin"])
});
Go to the webpage and add the web part as shown below
After that existing content editor web part select the property as shown below in screen shot.
Add existing java script file URL to the Content Editor Web Part.
When you finished all process the page will look like as following screen shot
