Блог Сергея Байдачного

Мой блог о технологиях

SharePoint 2010: Темы

7 комментариев

В SharePoint 2010 изменения коснулись core.css. Теперь это не один файл, а целый набор файлов, разбивающих старый мега-стиль на несколько стилей, сгрупированных по назначению. Кроме того, в стандартный набор предопределенных списков входит список под названием Style Library. Даный список (библиотека) может быть использован разработчиком для размещения картинок, стилей и других элементов, связанных с оформлением сайта, полагаясь на то, что список всегда присутствует.

А вот вопрос тем требует более детального рассмотрения. Если Вы сталкивались с SharePoint 2007, то знаете, что для изменения внешнего вида сайта можно было использовать темы. Благодаря темам можно было задать цвета для различных элементов интерфейса, определить основные шрифты, а также фон. Темы представляли собой файл CSS, который переписывал стили, указанные в core.css. Кроме того, тема содержала набор изображений, используемых для фона. Найти темы достаточно легко, достаточно перейти в каталог C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\THEMES. Тут находится список каталогов, каждый из которых содержит CSS файл и набор изображений. Однако, если Вы попробуете войти на один из сайтов, созданных в SharePoint 2010 и изменить тему (Site Actions->Site Settings->Site Theme), то не увидите ни одного знакомого названия в списке тем.

@1.7

@1.7 Выбор темы

Фактически, все старые темы остались в SharePoint 2010 для успешной миграции со старой версии продукта. Новые же темы находятся в папке C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\GLOBAL\Lists\themes. Данная папка содержит набор файлов с расширением thmx и шаблон скрытого списка Theme, который будет являться хранилищем для этих и подобных файлов. Поскольку список Theme определяется в шаблоне Global, то он будет присутствовать на любом из сайтов, так как все шаблоны используют Global в качестве фундамента. В свою очередь функциональность для пользователя была переписана таким образом, чтобы он работал со списком Theme при выборе новой темы.

Давайте разберемся, что представляет собой файл с расширением thmx. Оказывается это файл, поддерживаемый пакетом Microsoft Office, при этом его может создать любой пользователь, например, используя Microsoft Office PowerPoint, используя команду New->Themes.

@1.8

@1.8 Создание темы

Создав тему, ее можно легко модифицировать, используя вкладку Design и такие кнопки как Colors и Fonts для установки цветов и шрифтов темы. Редактируя эти параметры, Вы можете установить определенное количество именованных цветов и шрифтов, которые и будут использоваться в SharePoint 2010 для наложения на текущий CSS.

@1.9

@1.9 Модификация цветов темы

Получив желаемую тему, ее можно сохранить в виде thmx файла и загрузить в список тем Theme. В результате этого действия тема станет доступной в списке и готова к использованию.

Как разработчиков, нас интересуют несколько вопросов:

· Как это работает вместе с CSS;

· Как на темы можно влиять программно;

· Как развернуть свою тему программно.

Попробуем ответить на эти вопросы.

Если Вы откроете corev4.css файл, который можно найти в папке C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\1033\STYLES, то сможете найти тут стили, подобные этому:

table.ms-toolbar{
height:45px;
border:none;
/* [RecolorImage(
themeColor:"Light2",includeRectangle:{x:0,y:610,width:1,height:42})] */ 
background:url("/_layouts/images/bgximg.png") repeat-x -0px -610px;
 
/* [ReplaceColor(themeColor:"Light1")] */ 
background-color:#fff;
}

Тут без труда можно заметить специальные тэги, которые указаны в виде комментариев, это ReplaceColor и ReplaceImage. Это специальные комментарии, которые понятны только SharePoint 2010 (а теперь и нам). Если в качестве комментария используется тэг ReplaceColor, то при использовании темы, цвет в CSS будет заменен на тот, который указан в тэге. Естественно тут используется одно из стандартных имен тем. Аналогично, тэг ReplaceImage способен заменить изображение на прямоугольник заданного цвета из темы. Кроме этих тэгов, существует тэг ReplaceFont, способный заменить шрифт. Таким образом, если Вы решились на разработку своих CSS файлов и хотите сохранить возможность установки тем, то подобными комментариями следует снабдить и собственный CSS.

Теперь перейдем к API. Чтобы управлять темами программно, разработчика снабдили классом ThmxTheme.

Ниже показан пример кода, который получает ссылку на текущую тему для сайта:

SPWeb web = new SPSite("http://sbaydach64/").RootWeb;
string themeurl = ThmxTheme.GetThemeUrlForWeb(web); 
ThmxTheme theme = ThmxTheme.Open(web.Site, themeurl );

Используя полученную ссылку, можно легко модифицировать тему (не сам файл, а те параметры, которые были установлены в ходе применения темы – все они хранятся в базе), используя такие свойства, как AccentColor1, AccentColor2 и т. д. Чтобы изменения вступили в силу, необходимо вызвать метод Save.

Чтобы применить новую тему к сайту, достаточно воспользоваться статическим методом SetThemeUrlForWeb:

ThmxTheme.SetThemeUrlForWeb(SPWeb web, string ThemeUrl) 
 
ThmxTheme.SetThemeUrlForWeb(SPWeb web, string ThemeUrl, bool shareGenerated)) 

Наконец, если Вы создаете собственный шаблон, который включает темы, то развернуть собственные темы в список достаточно просто. Для этого используется элемент Module, который описывает имя списка для развертывания, а также сам файл:

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <Module Name="ThemesElement" Url="_catalogs/theme" RootWebOnly="TRUE" Path="Themes">
    <File Type="GhostableInLibrary"  Url="CustomTheme.thmx" IgnoreIfAlreadyExists="true" />
  </Module>
</Elements>
Реклама

Written by Sergiy Baydachnyy

19.04.2010 в 10:48

Опубликовано в SharePoint

Tagged with

комментариев 7

Subscribe to comments with RSS.

  1. Интересная тема про темы :))))

    Алекс

    23.06.2011 at 23:13

    • Здравствуйте,
      при задании пользовательской темы можно определить только 12 цветов для различных элементов. Sharepoint при этом формирует табличку цветов 5х10, которую использует на сайте. Можно как то задать все цвета из таблички 5х10?

      Илья

      27.01.2012 at 07:51

  2. […] сделать с помощью функционала тем SharePoint, создав тему в Microsoft Office Power Point или Microsoft Theme Builder и добавив ее в коллекцию тем сайта. В […]

  3. Мощно, спасибо!

    Андрей

    12.06.2013 at 15:04

  4. […] сделать с помощью функционала тем SharePoint, создав тему в Microsoft Office Power Point или Microsoft Theme Builder и добавив ее в коллекцию тем сайта. В […]

    Bad Человек

    18.12.2013 at 02:37

  5. Hi there! This post couldn’t be written any better! Looking at this post reminds me of my previous roommate!
    He constantly ket talking about this. I most certainly will send this post tto him.

    Fairly certain he will have a good read. Many thanks for sharing!

  6. Узаконивание водоснабжения в Сочи по низким ценам.
    Наша компания выполнит весь комплекс работ связанный с водоснабжением и канализацией в Сочи.
    Грамотные проектировщики помогут все сделать оперативно и быстро. Главное доступно и дешевле чем в водоканале.
    Работает акция — приведи соседа и получи скидку на свою услугу.
    тел. 89286650035. http://s-i23.blog.ru/221023587.html

    FabianSuew

    13.02.2016 at 18:49


Добавить комментарий

Заполните поля или щелкните по значку, чтобы оставить свой комментарий:

Логотип WordPress.com

Для комментария используется ваша учётная запись WordPress.com. Выход / Изменить )

Фотография Twitter

Для комментария используется ваша учётная запись Twitter. Выход / Изменить )

Фотография Facebook

Для комментария используется ваша учётная запись Facebook. Выход / Изменить )

Google+ photo

Для комментария используется ваша учётная запись Google+. Выход / Изменить )

Connecting to %s

%d такие блоггеры, как: