How To Create A Tab In Sharepoint 2010

Last year I wrote a blog article describing how to turn a standard SharePoint 2010 web part zone into Tabs (Adding Tabbed Web Parts in a SharePoint Page Layout). Recently I was asked for downloadable source code – and I thought now would be a good time to revisit the code, refactor it a bit, and also adapt it for SharePoint 2013.

Now on CodePlex…

Before I go into more detail and show some screenshots, for those of you wanting to dive into the source code right away, here it is:

sharepointtabs.codeplex.com

In CodePlex, you'll find 2 solutions: 1 for SP2010, 1 for SP2013. Each simply contains 1 Page Layout with a working deployable example of how to implement tabbed web part zones (essentially my previous blog article in practice). The description of how the 2010 version works were largely covered here, and the source code is largely similar save some refactoring and switching over to a CDN for JQuery.

Differences between Tabs in 2010 vs 2013

Essentially we can use the same page layout as in SharePoint 2010, with only minor modifications in the "Tabify" javascript:

2013 Tabs In Action

And then once deployed, this is what it looks like (using JQuery UI theme "Redmond" for styling):

And Voila! We have easy to use, reusable tabs in SharePoint 2013. No additional features, server-side code, and easy to maintain.

Update!

I fixed a bug on CodePlex, so if you were noticing this issue, please get the latest code and wsps for either the 2010 or 2013 version.

Learn more about Softlanding's SharePoint Related Services

Ready-to-go corporate intranet on Office 365 and SharePoint.agileIntranet is a corporate intranet solution combining the "quick to deploy" out of the box expectations of cloud platforms with the power and flexibility of an on-premises intranet installation. Crafted and designed by Softlanding, our intranet solution incorporates the knowledge and best practices evolved over many years of successful SharePoint implementations.
Office 365 Cloud Migration Services. Office 365 Migrations change your organization's dependencies of 'being in the office' in order to access files and folders to 'anywhere, anytime'. Softlanding can assist in migrating your SharePoint, email system, OneDrive to Office 365's online resources.
Connect Strategy to Execution. Spend three-days within Softlanding's Cloud Envisioning Workshop to discover your Cloud roadmap and achieve the results specific to your business.

Azure AD Benefits and Differences from Active Directory

At first glance, on-prem Active Directory Domain Services (AD DS) and Azure Active Directory (AAD) may seem like two versions...

IDC Info Snapshot – Why It Matters: Navigating Data Loss Prevention in the Cloud

Organizations Get Serious About Data Security Over the past few years, we have heard the...

Top Benefits of Cloud Computing for Healthcare

Cloud computing is truly a revolutionary technology and the underpinning for digital transformation across many commercial industries....