Обновление фирменной символики существующих сайтов и областей страниц SharePoint
Вы можете обновить фирменную символику на существующих сайтах и семействах веб-сайтов SharePoint, а также настроить регионы страниц SharePoint. Это может потребоваться, например, при обновлении до новой версии сайта.
Важно!
Такая расширяемость доступна только для классического интерфейса SharePoint. Эту возможность нельзя использовать вместе с современным интерфейсом в SharePoint Online, например на сайтах для общения.
Обновление фирменного стиля существующих сайтов и дочерних сайтов
В примере Branding.Refresh в проекте шаблоны и методики разработчика Office 365 на GitHub показано, как использовать библиотеку OfficeDevPnP.Core для итерации существующих сайтов и дочерних сайтов, чтобы проверить и обновить примененную фирменную символику. Пример иллюстрирует обновление фирменной символики сайта, но ту же концепцию можно использовать для выполнения других действий, таких как развертывание новой библиотеки на нескольких сайтах или обновление настраиваемого действия, которое было развернуто во время подготовки. Тот же процесс можно использовать для обновления существующих сайтов до новой версии.
Операция состоит из двух этапов:
- получение сайтов, которые требуется обновить;
- Обновите фирменную символику сайта.
Получение сайтов, которые требуется обновить
Сначала получите список сайтов и дочерних сайтов, которые вы хотите обновить. В примере показано, как это сделать с помощью функции поиска, но есть и другие варианты, такие как чтение из каталога сайта или реализация пользовательского интерфейса управления, где администраторы могут указать список сайтов. Ниже показано, как создать список с помощью функции поиска.
// Get a list of sites. Search is one way to get this list, an alternative can be a site directory.
List<SiteEntity> sites = cc.Web.SiteSearchScopedByUrl("https://bertonline.sharepoint.com");
// Generic settings (apply changes on all webs or just root web).
bool applyChangesToAllWebs = true;
// Optionally further refine the list of returned site collections.
var filteredSites = from p in sites
where p.Url.Contains("13003")
select p;
List<SiteEntity> sitesAndSubSites = new List<SiteEntity>();
if (applyChangesToAllWebs)
{
// You want to update all sites, so the list of sites is extended to all subsites.
foreach (SiteEntity site in filteredSites)
{
sitesAndSubSites.Add(new SiteEntity() { Url = site.Url,
Title = site.Title,
Template = site.Template });
GetSubSites(cc, site.Url, ref sitesAndSubSites);
}
sites = sitesAndSubSites;
}
Вызов GetSubSites является рекурсивным, поэтому он извлекает дерево дочернего сайта. После получения дерева убедитесь, что возвращено правильное число.
Обновление фирменной символики
После выбора сайта для обработки можно использовать методы OfficeDevPnP.Core для работы с ним. В примере показано, как это сделать для фирменного стиля, но таким же образом можно обрабатывать любые изменения.
В этом примере используется шаблон, который применяет контейнер веб-свойств для хранения сведений о текущих параметрах. Код сначала считывает значения контейнера веб-свойств и выполняет соответствующие действия для каждого значения.
// Verify that you have a property bag entry.
string themeName = cc.Web.GetPropertyBagValueString(BRANDING_THEME, "");
if (!String.IsNullOrEmpty(themeName))
{
// If no theme property bag entry, assume no theme has been applied.
if (themeName.Equals(currentThemeName, StringComparison.InvariantCultureIgnoreCase))
{
// The applied theme matches to the theme you want to update.
int? brandingVersion = cc.Web.GetPropertyBagValueInt(BRANDING_VERSION, 0);
if (brandingVersion < currentBrandingVersion)
{
DeployTheme(cc, currentThemeName);
// Set the web propertybag entries
cc.Web.SetPropertyBagValue(BRANDING_THEME, currentThemeName);
cc.Web.SetPropertyBagValue(BRANDING_VERSION, currentBrandingVersion);
}
}
else
{
if (forceBranding)
{
DeployTheme(cc, currentThemeName);
// Set the web propertybag entries.
cc.Web.SetPropertyBagValue(BRANDING_THEME, currentThemeName);
cc.Web.SetPropertyBagValue(BRANDING_VERSION, currentBrandingVersion);
}
}
}
Код, который затем обновляет тему, довольно прост и основан на методах OfficeDevPnP.Core.
string themeRoot = Path.Combine(AppRootPath, String.Format(@"Themes\{0}", themeName));
string spColorFile = Path.Combine(themeRoot, string.Format("{0}.spcolor", themeName));
string spFontFile = Path.Combine(themeRoot, string.Format("{0}.spfont", themeName));
string backgroundFile = Path.Combine(themeRoot, string.Format("{0}bg.jpg", themeName));
string logoFile = Path.Combine(themeRoot, string.Format("{0}logo.png", themeName));
if (IsThisASubSite(cc.Url))
{
// Retrieve the context of the root site of the site collection.
using (ClientContext ccParent = new ClientContext(GetRootSite(cc.Url)))
{
ccParent.Credentials = cc.Credentials;
cc.Web.DeployThemeToSubWeb(ccParent.Web, themeName, spColorFile, spFontFile, backgroundFile, "");
cc.Web.SetThemeToSubWeb(ccParent.Web, themeName);
}
}
else
{
cc.Web.DeployThemeToWeb(themeName, spColorFile, spFontFile, backgroundFile, "");
cc.Web.SetThemeToWeb(themeName);
}
Настройка регионов страницы SharePoint
Если вы хотите настроить регионы страницы SharePoint, можно использовать сочетание удаленной подготовки и настраиваемых каскадных таблиц стилей (CSS) для файлов, связанных с регионами страницы. Сначала необходимо знать, какие файлы SharePoint связаны с различными регионами страницы SharePoint.
Таблица 1. Регионы страницы SharePoint и связанные файлы
Область страницы | Связанные файлы | Дополнительные сведения |
---|---|---|
Ribbon | Любые главные страницы по умолчанию. Соответствующая CSS:
|
Можно скрыть с помощью кнопки Сосредоточиться на контенте. |
Комплексная навигация | Любые главные страницы по умолчанию. | Можно скрыть с помощью кнопки Сосредоточиться на контенте. |
Комплексные ссылки | Можно скрыть с помощью кнопки Сосредоточиться на контенте. | |
Меню приветствия | *. master | Можно скрыть с помощью кнопки Сосредоточиться на контенте. |
Меню настроек или значок шестеренки | *. master | |
Справка | *. master | |
Контекстные вкладки ленты | Любая главная страница по умолчанию. | Примеры см. ниже: |
Панель быстрого доступа | *. master | Можно скрыть с помощью кнопки Сосредоточиться на контенте. |
Эмблема сайта | *. master Соответствующий CSS: .ms-sitelcon-img |
|
Верхняя панель навигации | Панель навигации CSOM или JSOM *. master Соответствующая CSS (не в режиме редактирования):
|
|
Заголовок страницы | Соответствующая CSS (в режиме редактирования):
|
|
Поле поиска | Nav CSOM/JSOM *.master Соответствующий CSS:
|
|
Левая область навигации | Nav CSOM/JSOM *.master | Дополнительные сведения см. в следующих разделах. |
Представление в виде дерева | *. master | Дополнительные сведения см . в разделе Настройка встроенного навигатора Treeview. |
Содержимое страницы | Макет страницы или страницы содержимого Зона веб-частей или веб-частиКорвечая CSS (зона веб-части и веб-часть):
|
Дополнительные сведения см. в статье Создание макета страницы в SharePoint. |
Примеры, связанные с настройкой регионов страницы, см. ниже в проекте Office 365 шаблоны и методики разработчика на сайте GitHub:
Обязательные заполнители "минимального" содержимого на страницах SharePoint по умолчанию master
Sharepoint. master страницах требуется использовать заполнители контента, которые отрисовывает основное содержимое и структурные элементы, необходимые странице SharePoint для поддержки жизненного цикла страницы. В таблице 2 описываются заполнители контента.
Табл. 2. Минимальный обязательный заполнитель содержимого для страницы master SharePoint
Заполнитель контента | Хранит контент для |
---|---|
PlaceHolderAdditionalPageHead | Дополнительные элементы в \<head\> разделе страницы. |
PlaceHolderBodyAreaClass | Дополнительные стили в заголовке страницы. |
PlaceHolderBodyLeftBorder | Левый граничный элемент основной части страницы. |
PlaceHolderBodyRightBorder | Правый граничный элемент основной части страницы. |
PlaceHolderCalendarNavigator | Элемент выбора даты для навигации в календаре, когда он отображается на странице. |
PlaceHolderFormDigest | Элемент управления безопасностью "дайджест формы". |
PlaceHolderGlobalNavigation | Глобальная иерархическая навигация (верхняя панель навигации). |
PlaceHolderGlobalNavigationSiteMap | Карта сайта в глобальной навигации (верхняя панель навигации). |
PlaceHolderHorizontalNav | Верхнее меню навигации для страницы (верхняя панель навигации). |
PlaceHolderLeftActions | Нижняя левая область навигации (левая область навигации). |
PlaceHolderLeftNavBar | Левая область навигации. |
PlaceHolderLeftNavBarDataSource | Источник данных для левого меню навигации (левая область навигации). |
PlaceHolderLeftNavBarTop | Верхняя левая область навигации (левая область навигации). |
Placeholdermain | Основной контент страницы (контент страницы). |
PlaceHolderMiniConsole | Команды на уровне страницы, такие как "Изменить страницу", "Журнал" и "Входящие ссылки" на корпоративной вики-странице. |
PlaceHolderNavSpacer | Ширина левой области навигации. |
PlaceHolderPageDescription | Описание содержимого страницы. |
PlaceHolderPageImage | Значок страницы в левом верхнем углу страницы (лента). |
PlaceHolderPageTitle | Заголовок страницы (\<title\> ) (заголовок страницы), отображаемый в строке заголовка страницы браузера. |
PlaceHolderPageTitleInTitle | Заголовок страницы отображается непосредственно под строкой навигации. |
PlaceHolderQuickLaunchBottom | Нижняя часть навигации панели быстрого запуска (верхняя панель навигации). |
PlaceHolderQuickLaunchTop | Верхняя часть навигации панели быстрого запуска (верхняя панель навигации). |
PlaceHolderSearchArea | Область, где отображается элемент управления "Поле поиска" (поле поиска). |
PlaceHolderSiteName | Имя сайта (комплексная навигация). |
PlaceHolderTitleAreaClass | Область заголовка страницы (комплексная навигация). |
PlaceHolderTitleAreaSeparator | Тени в области заголовка (комплексная навигация). |
PlaceHolderTitleBreadCrumb | Область контента строки навигации. |
PlaceHolderTitleLeftBorder | Левая граница области заголовка (комплексная навигация). |
PlaceHolderTitleRightMargin | Правая граница области заголовка (комплексная навигация). |
PlaceHolderTopNavBar | Верхняя область навигации. |
PlaceHolderUtilities | Дополнительный контент, который должен отображаться в нижней части страницы (контент страницы). |
SPNavigation | Включает операции, связанные с навигацией. |
WSSDesignConsole | Элементы управления редактированием, когда страница находится в режиме редактирования. |
Если удалить один из заполнителей контента, перечисленных в таблице 2, из SharePoint . master странице SharePoint выдает ошибку. Вы можете добавить заполнитель контента со скрытой видимостью, который скрывает контент.
Дополнительные сведения см. в разделе Windows SharePoint Services эталонных страницах по умолчанию (в этой статье описаны функциональные возможности в SharePoint Services 3, но содержимое по-прежнему применяется). См. также статью Работа с элементами-заполнителями содержимого.
Страницы SharePoint по умолчанию master, такие как seattle.master и oslo.master, содержат гораздо больше заполнителей контента, чем требуется SharePoint. Например, эти master страницы включают <SharePoint:Themes runat="server">
элементы управления и <SharePoint.CssRegistration runat="server">
.
Элементы управления Themes и CssRegistration используются во время жизненного цикла страницы. С помощью шаблона удаленной подготовки можно добавить серверный элемент управления для регистрации пользовательских CSS.
Невидимые заполнители контента по-прежнему работают должным образом, но любое содержимое, которое они создают, опущено из источника HTML, распознаваемого браузерами. Заполнитель содержимого с Visible="false"
скрытым.
Важно!
Не создавайте настраиваемые заполнители на пользовательских master страницах, которые существуют на встроенных страницах .master, таких как seattle.master и oslo.master. Это приведет к серьезным ошибкам.
Элемент управления Suite Navigation в SharePoint Online
В SharePoint Online представлена новая разметка страницы master для элемента управления Навигация по набору, который отображает верхнюю навигацию. Разметка элемента управления комплексной навигации по умолчанию зависит от того, предназначен ли сайт для интрасети или Интернета. Дополнительные сведения об элементе управления комплексной навигации и примеры для обоих видов сайтов, которые можно добавлять на главные страницы, см. в разделе SharePoint Online Suite Navigation control.
Настройка регионов страницы SharePoint с помощью CSOM
Как правило, рекомендуется использовать класс UserCustomAction для добавления или удаления ссылок и других элементов. Это вариант SharePoint, использующий элемент CustomAction , который можно распознать как часть платформы функций, если вы знакомы с моделью кода полного доверия. Хотя шаблон подготовки элемента CustomAction и платформы компонентов не поддерживается явно в клиентской объектной модели (CSOM), в коде CSOM можно использовать те же идентификаторы расположения, что доступны элементу CustomAction.
<CustomAction
RequiredAdmin = "Delegated | Farm | Machine"
ControlAssembly = "Text"
ControlClass = "Text"
ControlSrc = "Text"
Description = "Text"
FeatureId = "Text"
GroupId = "Text"
Id = "Text"
ImageUrl = "Text"
Location = "Text"
RegistrationId = "Text"
RegistrationType = "Text"
RequireSiteAdministrator = "TRUE" | "FALSE"
Rights = "Text"
RootWebOnly = "TRUE" | "FALSE"
ScriptSrc = "Text"
ScriptBlock = "Text"
Sequence = "Integer"
ShowInLists = "TRUE" | "FALSE"
ShowInReadOnlyContentTypes = "TRUE" | "FALSE"
ShowInSealedContentTypes = "TRUE" | "FALSE"
Title = "Text"
UIVersion = "Integer">
</CustomAction>
Настройка ленты SharePoint
При настройке ленты HTML-код, отображаемый сервером, назначается классу, который вы назначили пользовательскому стилю. Для использования этой функции перейдите к библиотеке стилей и создайте CSS-файл для каждого стиля, который требуется добавить на ленту. Вы можете добавить настраиваемые стили в два раздела ленты:
- Для раздела Элементы страницы :
span.ms-rteElement-{{YOUR_OWN_DEFINED_NAME}}
. Или же можно использовать стили H1, H2, H3 или H4, которые будут обтекать текст, к которому применяется стиль. - Для раздела Стили текста :
.ms-rteEStyle-{{YOUR_OWN_DEFINED_NAME}}
.
Затем в определении класса CSS добавьте следующую строку:
-ms-name:"The name visual in the ribbon for your style";
Теперь можно завершить определение сведений о пользовательском классе CSS в вашем CSS-файле.
Настройка навигации по набору на странице веб-части
В SharePoint пользовательский интерфейс имеет современный внешний вид, основанный на плитках страниц. Например, по умолчанию на странице SharePoint по умолчанию отображаются динамические плитки. Верхняя навигация упрощает просмотр и доступ к социальному контенту и OneDrive для бизнеса. Вы можете настроить внешний вид этих областей с помощью сочетания CSS и JavaScript.
После создания страницы веб-части добавьте веб-часть редактора скриптов в доступную зону веб-частей. Эту веб-часть можно использовать для добавления JavaScript на страницу. Вы можете добавить код JavaScript в веб-часть редактора скриптов, которая идентифицирует верхнюю панель навигации по элементу ElementId, а затем скрыть ее, задав свойству видимости значение hidden.
Изменение меню настроек или значка шестеренки
Вы можете использовать класс UserCustomAction и записи контейнера свойств для настройки меню параметров любого сайта SharePoint, как показано в следующем примере кода.
public void AddCustomActions(ClientContext clientContext)
{
// Add a site settings link if it doesn't already exist.
if (!CustomActionAlreadyExists(clientContext, "Sample_CustomSiteSetting"))
{
// Add a site settings link.
UserCustomAction siteSettingLink = clientContext.Web.UserCustomActions.Add();
siteSettingLink.Group = "SiteTasks";
siteSettingLink.Location = "Microsoft.SharePoint.SiteSettings";
siteSettingLink.Name = "Sample_CustomSiteSetting";
siteSettingLink.Sequence = 1000;
siteSettingLink.Url = string.Format(DeployManager.appUrl, clientContext.Url);
siteSettingLink.Title = "Modify Site Metadata";
siteSettingLink.Update();
clientContext.ExecuteQuery();
}
// Add a site actions link, if it doesn't already exist.
if (!CustomActionAlreadyExists(clientContext, "Sample_CustomAction"))
{
UserCustomAction siteAction = clientContext.Web.UserCustomActions.Add();
siteAction.Group = "SiteActions";
siteAction.Location = "Microsoft.SharePoint.StandardMenu";
siteAction.Name = "Sample_CustomAction";
siteAction.Sequence = 1000;
siteAction.Url = string.Format(DeployManager.appUrl, clientContext.Url); ;
siteAction.Title = "Modify Site Metadata";
siteAction.Update();
clientContext.ExecuteQuery();
}
}
Настройка древовидного представления
Чтобы изменить ширину представления дерева, добавьте <div>
тег вокруг тега дерева на странице .master и назначьте класс CSS с атрибутом style width для <div>
. Вы можете увеличить ширину навигации быстрого запуска , добавив следующее определение стиля в файл *.css .
.ms-nav {
width: 220 px;
}
Настройка контента страницы
Требования к настройке содержимого страницы зависят от содержимого, включаемого на страницу. Что касается настройки меню Действия сайта , можно использовать объект UserCustomAction для подготовки фирменной символики для веб-частей.
Если вы создаете сайт публикации, ознакомьтесь с разделом Создание макета страницы в SharePoint , чтобы узнать об основных принципах. Макеты страниц зависят от доступности класса ContentTypeId в CSOM. Что касается других участников, недоступных в CSOM, вы можете использовать службу Windows Communication Foundation (WCF) для работы с ContentTypeId в качестве временного обходного решения.