Добавление собственных css в меню "Styles" элемента управления Reach Html Editor

tvsmetanina — Thu, 28 Jun 2007 00:06:00 GMT

Для начала опишу о чем идет речь. Речь идет вот об этом элементе управления:

и вот об этом выпадающем списке с возможностью выбрать css для выделенного кусочка текста:

Как вы видите, по умолчанию нет ни одного css класса, доступного для выбора. Это нам и предстоит исправить.

Как добавить свои стили:

1. Идем в папку стандартных стилей SharePoint c:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033\STYLES

2. Копируем файлы HtmlEditorCustomStyles.css и HtmlEditorTableFormats.css в папку Style Library (или любую другую папку вашей коллекции сайтов).

HtmlEditorCustomStyles.css - отвечает за стили текста

HtmlEditorTableFormats.css - отвечает за таблицы

3. Открываем эти файлы в SharePoint Designer, VS 2005 или любом другом удобном вм редакторе и пишем туда необходимые стили.

Пример заполнения файла HtmlEditorCustomStyles.css

/* .ms-rteCustom - это обязательная часть по которой Reach Html Editor определяет стили, которые от будет давать выбирать

вместо redHeadline вы можете написать любое, необходимое вам название */

.ms-rteCustom-redHeadline { font-weight: bold; font-family: Arial; font-size: 14pt; color: red; }

Пример заполнения файла HtmlEditorTableFormats.css:

/* здесь можно менять только номер (в нашем случае это 1) */ 
.ms-rteTable-1 {border-collapse:collapse;border-top:gray 1.5pt;
    border-left:gray 1.5pt;border-bottom:gray 1.5pt;
    border-right:gray 1.5pt;border-style:solid;}
.ms-rteTableHeaderRow-1 {color:Green;background:yellow;text-align:left}
.ms-rteTableHeaderFirstCol-1 {padding:0in 5.4pt 0in 5.4pt;}
.ms-rteTableHeaderLastCol-1 {padding:0in 5.4pt 0in 5.4pt;}
.ms-rteTableHeaderOddCol-1 {padding:0in 5.4pt 0in 5.4pt;}
.ms-rteTableHeaderEvenCol-1 {padding:0in 5.4pt 0in 5.4pt;}
.ms-rteTableOddRow-1 {color:black;background:#FFFFDD;}
.ms-rteTableEvenRow-1 {color:black;background:#FFB4B4;}
.ms-rteTableFirstCol-1 {padding:0in 5.4pt 0in 5.4pt;}
.ms-rteTableLastCol-1 {padding:0in 5.4pt 0in 5.4pt;}
.ms-rteTableOddCol-1 {padding:0in 5.4pt 0in 5.4pt;}
.ms-rteTableEvenCol-1 {padding:0in 5.4pt 0in 5.4pt;}
.ms-rteTableFooterRow-1 {color:blue;font-style:bold;
    font-weight:bold;background:white;border-top:solid gray 1.0pt;
    border-bottom:solid gray 1.0pt;border-right:solid silver 1.0pt; 
    border-style:solid;}
.ms-rteTableFooterFirstCol-1 {padding:0in 5.4pt 0in 5.4pt;
    border-top:solid gray 1.0pt;text-align:left}
.ms-rteTableFooterLastCol-1 {padding:0in 5.4pt 0in 5.4pt;
    border-top:solid gray 1.0pt;text-align:left}
.ms-rteTableFooterOddCol-1 {padding:0in 5.4pt 0in 5.4pt;
    text-align:left;border-top:solid gray 1.0pt;}
.ms-rteTableFooterEvenCol-1 {padding:0in 5.4pt 0in 5.4pt;
    text-align:left;border-top:solid gray 1.0pt;}
 4. Открываем master page и добавляем между тэгами <head> ... </head>
 <link rel="stylesheet" type="text/css" href="http://blogs.technet.com/Style%20Library/HtmlEditorCustomStyles.css" />
 <link rel="stylesheet" type="text/css" href="http://blogs.technet.com/Style%20Library/HtmlEditorTableFormats.css" />
 Примечание: Если правильно называть стили см. п. 3 с примерами заполнения, то хранить эти стили не обязательно в файлах HtmlEditorCustomStyles.css и HtmlEditorTableFormats.css,  т.е. можно назвать эти файлы подругому или вообще соединить в один.
   
Используемые материалы:
http://office.microsoft.com/en-us/sharepointdesigner/HA101741401033.aspx

MOSS 2007 Css customization trick

tvsmetanina — Mon, 19 Feb 2007 12:03:00 GMT

Как уже неоднократно и многими писалось, тут можно посмотртеть практически полное описание CSS для SharePoint Server 2007. Возможно, на днях я его дополню, описав стили для левой навигационной панели(в этой статье почему-то этот момент упущен).

А вообще, уважаемые разработчики, существует такая штука как IEDevToolBar, которая 100% решает проблему незнания чего делает, как называется и где применяется тот или иной стиль. Эта штука крайне полезна, удобна и имеет много интресных возможностей, а так же занчительно экономит время разработчика.

Вердикт: качать всем кастомизаторам.

Sharepoint изнутри : CSS

Добавление собственных css в меню "Styles" элемента управления Reach Html Editor

MOSS 2007 Css customization trick