Как поменять шрифт в форме для сообщений на форум и в статьях?
Хочу предупредить: на данный момент благодаря стараниям держателей хостинга управление системой ucoz изменилось. Некоторые моменты могут не совпадать с тем, что описано в уроках. Если у вас что-то не получается - не стесняйтесь обращаться на ФОРУМ нашего сайта, разберёмся вместе.
1. Шрифт в форме для сообщений
Поскольку есть много любителей тёмных дизайнов, я выношу этот вопрос в отдельную тему. На сайтах ucoz с тёмным дизайном существует одна существенная проблема: Форма (поле) для сообщений тёмная (например тёмно-синяя), а текст, который вы набираете в этой форме - тёмно-серый. Получается, что сообщение набирать приходится почти вслепую или выкручивать на 100 % яркость монитора. Цвет и размер шрифта, которым Вы набираете сообщение, можно поменять в стилях. Точно так же, как можно поменять цвет, размер, а так же и сам шрифт во всём форуме. Это можно сделать следующим не очень сложным способом:
1. Заходим в панель управления сайтом (Панель администратора, ПА).
2. В ПА нажимаем на ссылку "Управление дизайном".
3. В управлении дизайном выбираем: "Таблица стилей (CSS)" - она выделена оранжевым цветом.
4. Нам выпадает поле с шаблоном CSS. В шаблоне CSS надо найти начало стилей, отвечающих за форум. Выглядит это начало так:
/* ===== forum Start ===== */
Всё, что расположено ниже этого знака - это Ваш форум.
5. В форуме нужно найти следующий фрагмент:
.codeButtons {font-size:7pt;background: #5C6884;color:#FFFFFF;border:1px outset #AFBDE4;}
.codeCloseAll {font-size:7pt;background: #5C6884;color:#FFFFFF;border:1px outset #AFBDE4;font-weight:bold;}
.postNameFl,.postDescrFl {background:#131A2E;border:1px solid #1D2C57;width:400px;color:#FFFFFF;} /// Редактирование цвета текста написания в форме "Название темы:" на форуме (придобавлении новой темы).
.postPollFl,.postQuestionFl {background:#131A2E;border:1px solid #1D2C57;width:400px}
.postResultFl {background:#131A2E;border:1px solid #1D2C57;width:50px}
.postAnswerFl {background:#131A2E;border:1px solid #1D2C57;width:300px}
.postTextFl {background:#131A2E;border:1px solid #1D2C57;width:550px;height:150px;color:#FFFFFF;} /// Редактирование цвета текста написания в форме "Описание темы:" на форуме (придобавлении новой темы).
.postUserFl {background:#131A2E;border:1px solid #1D2C57;width:300px;color:#FFFFFF;} /// Редактирование цвета текста написания в форме "Текст сообщения:" на форуме (придобавлении новой темы).
Чтобы его было проще найти, можно воспользоваться Поиском в браузере (В Firefox это: Правка - Найти; в IE: Правка - Найти на этой странице...; в Opera: Правка - Найти). Вводите в форму поиска, к примеру, фрагмент: .codeButtons - и браузер выделяет вам нужный фрагмент CSS.
Далее, в найденном фрагменте вы находите строчку:
.postTextFl {background:#131A2E;border:1px solid #1D2C57;width:550px;height:150px;color:#C9D6F5;}
Красным цветом выделен цвет шрифта, которым осуществляется набор текста. Меняете его на тот цвет, который Вам нужно. Жмёте кнопочку "Сохранить" внизу страницы.
6. Если Вам так же нужно поменять цвет, которым Вы набираете в форме заголовок темы и описание темы, ищете следующий фрагмент:
.postNameFl,.postDescrFl {background:#131A2E;border:1px solid #1D2C57;width:400px; color:#C9D6F5;}
Синим я выделила тот фрагмент, в котором нужно изменить цвет шрифта. Если этот фрагмент в строчке отсутствует, его нужно добавить, соответственно с тем цветом, который Вам нужен.
Жмёте "Сохранить".
Теперь у Вас текст сообщения будет набираться тем цветом, который Вам нужен. Что весьма актуально на тёмных дизайнах.
Если вы хотите кроме цвета шрифта изменить его размер, то вам нужно добавить в строку, отвечающую за текст, вот такой фрагмент: font-size:12pt; - соответственно, подставив вместо "12"ту переменную, которую вам нужно.
Здесь же можно поменять цвет, размер или имя шрифта (font-family: Arial; font-style:italic; - соответственно шрифт arial, курсив) для всех шрифтов, которые используются в форуме. Для этого вам нужно немного поэкспериментировать, подставляя к примеру значение цвета - "red" - во все фрагменты css форума и проверяя, какой именно цвет на форуме меняется. Здесь можно найти цвет полей, форм, шрифтов, бордюров и пр., какие стоят в вашем форуме. Так что покопавшись и поэкспериментировав, вы одновременно со сменой шрифта в форме для сообщений узнаете много моментов, с помощью которых сможете видоизменять дизайн вашего форума.
2. Шрифт статей
Допустим, вас не устраивает, что шрифт в статьях вашего сайта очень мелкий или же очень крупный. Для того, чтобы изменить шрифт, который используется в разделе сайта "Статьи", нужно сделать следующее:
1. Заходим в ПА - Управление дизайном - Таблица стилей CSS (в которую мы только что заходили, меняя шрифт в форме сообщений на форуме).
2. Находим вот такой блок:
/* Entries Style */
.eBlock {}
.eTitle {font-family:Verdana,Arial,Sans-Serif;font-size:13px;font-weight:bold;color:#948549; padding: 0 0 0 17px; background: url('http://src.ucoz.ru/t/995/31.gif') no-repeat 0px 2px;}
.eTitle a:link {text-decoration:underline; color:#D13702;}
.eTitle a:visited {text-decoration:underline; color:#D13702;}
.eTitle a:hover {text-decoration:underline; color:#000000;}
.eTitle a:active {text-decoration:underline; color:#D13702;}
.eMessage {text-align:justify;padding-bottom:5px;}
.eText {text-align:justify;padding-bottom:5px;padding-top:5px;border-top:1px solid #EBD98E}
.eDetails {border-top:1px dashed #DBB270;border-bottom:1px dashed #DBB270;font-family:Tahoma,Arial,Sans-Serif;color:#A88956;padding-bottom:5px;padding-top:3px; text-align:left;font-size:7pt;}
.eDetails1 {border-top:1px dashed #DBB270;border-bottom:1px dashed #DBB270;font-family:Tahoma,Arial,Sans-Serif;color:#A88956;padding-bottom:5px;padding-top:3px; text-align:left;font-size:8pt;}
.eDetails2 {border-bottom:1px dashed #DBB270;font-family:Tahoma,Arial,Sans-Serif;color:#1A1A1A;padding-bottom:5px;padding-top:3px; text-align:left;font-size:8pt;}
.eRating {font-size:7pt;}
.eAttach {margin: 16px 0 0 0; padding: 0 0 0 15px; background: url('http://src.ucoz.ru/t/995/32.gif') no-repeat 0px 0px;}
/* ------------- */
Это и есть "классы" для статей, подобно тому, как мы находили классы для форума. Поэкспериментировав, можно определить, какой класс за что отвечает. К примеру:
.eTitle - отвечает за заголовок статьи.
.eText - за шрифт, которым набрана статья.
И так далее.
Нам нужен именно второй вариант:
.eText {text-align:justify;padding-bottom:5px;padding-top:5px;border-top:1px solid #EBD98E}
3. В этом фрагменте размер шрифта не стоит (возможно, на вашем дизайне он стоит и его нужно только изменить). Если атрибут, отвечающий за размер, не стоит - мы его поставим: font-size:14px;
Получится вот что:
.eText {text-align:justify; padding-bottom:5px; padding-top:5px; border-top:1px solid #EBD98E; font-size:14px}
4. Не забываем нажимать на кнопку "Сохранить" внизу страницы. Теперь у вас статьи будут 14-м шрифтом. Так же, как мы добавляли атрибуты в соответствующие строчки для форума, сюда тоже можно добавить не только шрифт, но и цвет и пр.
Примечания:
1. Не забывайте, что обязательно нужно сохранять все знаки такими, какие они есть в css. Если после того или иного атрибута стоит точка с запятой ( ; ) - обязательно должна быть точка с запятой. Если двоеточие ( : ) - значит, надо поставить двоеточие. Если фигурная скобка ( { } ) - значит, должна быть фигурная скобка. И так далее.
2. Через css можно сменить стиль (цвет, шрифт, вид ссылок и пр.), но далеко не всё. Так что в следующих уроках я расскажу, где найти в дизайне логотип и некоторые другие фрагменты.
Уроки по редактированию Таблица HTML кодов цветов. $MYINF_20$
|
Главная 
