Просмотр кода элемента WordPress.

15

Posted by Виктория Павловна Дончик | Posted in О блоге | Posted on 02-11-2011

Метки: ,


Просмотр кода элемента

Просмотр кода элемента WordPress.

Сегодня давайте изменим шрифт текста записи, используя редактор Просмотр кода элемента WordPress.

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

Мне, например, тоже не нравится размер шрифта и самое главное стиль шрифта. Я имела опыт работы с двумя бесплатными темами WordPress и в обоих мне не нравился шрифте Georgia , а именно он стоял по умолчанию.

Очень некрасиво в шрифте Georgia выглядят цифры. О вкусах, конечно, не спорят, но думаю, что Вы со мной согласитесь, что такие цифры не симпатичны.

Сравнение шрифтов St 53_1

А вот еще пример:

Шрифт Georgia St 53_11

Давайте поэкспериментируем и отредактируем файл CSS. Но сначала ответим на вопросы:

  1. Как называется файл CSS, в котором описаны стили форматирования текста?
  2. Как называется класс стилей, который нужно редактировать?

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

  1. Открыть ПУА.
  2. Открыть  любую запись.
  3. Выделить  текст на странице.
  4. Нажать ПКМ-Просмотр кода элемента.

В результате внизу экрана появится окно, разбитое на две части. Справа часть отображает html-код элементов, а слева – стили, которые применяются для форматирования данных элементов. Вот здесь нам придут на помощь не только знания html, но и желательно, еще и CSS.

Окно редактора Просмотр кода элемента St 53_3

Для начала давайте почитаем код CSS и посмотрим на тег font (для body): font: 13px/19px Georgia, "Times New Roman", "Bitstream Charter", Times, serif

Что здесь написано? Размер шрифта 13 пикселей, по умолчанию стиль шрифта Georgia, если шрифт не установлен на ПК пользователя, то текст будет отображаться шрифтом Times New Roman (ВНИМАНИЕ: "Times New Roman" в кавычках, т.к. название шрифта состоит более чем из одного слова.). Если шрифтов  Georgia, Times New Roman и всех перечисленных в списке не нашлось на ПК, то текст будет отображаться любым шрифтом с засечками (serif).

Итак, устанавливаем курсор и пробуем удалить из списка Georgia,  смотрим на результат. Не скажу, что метод работает на 100%, но попробовать можно. И мне кажется, что получилось. Не огорчайтесь, если в Вашей теме этот способ не работает. Будем продолжать работать над этим вопросом и искать способы его решения. Самый верный способ - это зайти в сам файл стилей, который расположен на хостинге,  и отредактировать его вручную. Это работает на 101%.

Подведем итоги. Сегодня мы узнали:

  • как пользоваться редактором Просмотр кода элемента WordPress;
  • как читается код CSS в таблице стилей;
  • изменять список шрифтов для данной записи.


Ваш e-mail: *
Ваше имя: *


Вернуться на главную.

Comments (15)

Спасибо за поучительную статью

Это я давно уже знал.

да, профи я думаю и без подробных разъяснений все понятно. Они сами дадут любые советы. С удовольствием почитаю как Вы работаете в админке и поучусь тому, что не знаю.

Спасибо за тему — она очень актуальна для моего сайта. Обязательно изучу.

Спасибо, буду смотреть!

Спасибо интересная статья,я учитывая недостаток знаний никогда туда не заглядывала

ВСЕ ПОДРОБНО И ПОНЯТНО ОБЪЯСНИЛИ.

Спасибо за полезную статью! Почаще буду к вам заглядывать за советами!

Проходили!:) Полезная информация для непосвященных!

Да, вместе мы сила!

Еще бы с таким помощником как у Вас, должно все получаться отлично!

Да, самое главное, чтобы мой помощник давал мне работать :)) Ну и помогал иногда … Это тоже нужно :))

Не задумывался об изменении шрифта, больше внимания уделял содержанию, спасибо за информацию

Спасибо за статью:) У меня тоже Georgia стоит, кстати, по-умолчанию.

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

Write a comment