Полезная статья, отражающая все самые необходимые моменты кастомизации списков SharePoint 2013 c помощью CSR и JSLink: Использование JSLink с SharePoint 2013
Однажды, с помощью этой статьи я прикрутил плагин галереи Galleria (Responsive JavaScript Image Gallery) на представление списка. Пишите в комментариях, если кому-то интересно, расскажу.
При кастомизации представлений списков с помощью JSLink часто возникает небольшая проблема: переопределение overrideCtx.Templates.Header переопределяет заодно и меню переключения представлений. Аналогично и с overrideCtx.Templates.Footer. Но есть решение.
В файле clienttemplates.js (адрес /_layouts/15/clienttemplates.js) содержатся многие стандартные преобразования для представлений. Там можно найти стандартный заголовок — в функции SingleItem_RenderHeaderTemplate(renderCtx) { … }. Для использования кода удобно пользоваться файлом clienttemplates.debug.js.
Наш header будет выглядеть так:
...
overrideCtx.Templates.Header = customHeader;
...
function customHeader(ctx) {
var listSchema = ctx.ListSchema;
var ret = [];
ret.push("<div>");
if (listSchema.RenderViewSelectorPivotMenu == "True")
ret.push(RenderViewSelectorPivotMenu(ctx));
else if (listSchema.RenderViewSelectorPivotMenuAsync == "True")
ret.push(RenderViewSelectorPivotMenuAsync(ctx));
ret.push("</div>");
//наша добавленная разметка
ret.push("<div id='galleria' ></div>");
return ret.join("");
}
Вообще, полезно поизучать clienttemplates.debug.js. В этом файле есть часть стандартных JSLink представлений SharePoint 2013.