How to display more than 3 views in document library?
Question
I have 4 views "All Documents" "Agreements" "Permits" "Deeds" I want to display all 4 of them above my document library but only 3 get displayed and the fourth gets placed in the "..." section. I believe this modification is possible through sharepoint designer, but I was curious if anyone knew how to achieve this through the web environment.
Thank you
Solution
Since you are using SharePoint 2013 I would recommend you to consider the following approach. In SharePoint 2013 was introduced a so called Client Rendering Mode (CSR)
which is intended for rendering of List Views and Forms using HTML and JavaScript and which is a default rendering mode.
About View selector menu
As part of CSR ClientPivotControl
control (clienttemplates.js
) is intended for rendering View selector menu, SurfacedPivotCount
property defines the amount of view menu options rendered horizontally (default value is 3
)
How to display custom amount of view options for List View using CSR
The following template demonstrates how to override SurfacedPivotCount
property in order to display 4 view menu options:
function renderHeaderTemplateForDocuments(renderCtx, fRenderHeaderColumnNames){
var viewData = eval(renderCtx.ListSchema.ViewSelectorPivotMenuOptions);
ClientPivotControl.prototype.SurfacedPivotCount = 4;
return RenderHeaderTemplate(renderCtx, fRenderHeaderColumnNames); //render default Header template
}
SPClientTemplates.TemplateManager.RegisterTemplateOverrides({
Templates: {
Header: renderHeaderTemplateForDocuments
}
});
How to apply the changes
There are at least two options how to apply the changes:
- Using JSLink property of XLV web part
- Place JavaScript template on page via
Script Editor
/Content Editor
web parts
Here is how to apply the changes using the second option:
- Switch the page (
NewForm.aspx
) into edit mode - Add
Script Editor
webpart right below the list view web part. - Put the specified code by wrapping it using
script
tag code into the Script Editor, for example:<script type="text/javascript">{Template JS code goes here}</script>
- Save the page
Result
OTHER TIPS
I do not think that can be done. It shows the 4th view only once we click on it. (Dynamic HTML)
But I found a workaround.
- Go to Edit Page.
- Click on Add web part and add a content editor with the links to all 4 views.
- Edit list view web part and disable the view selector menu. Also if needed, set tool bar to no tool bar and remove search. (Look where to edit using screenshot)