Редактируем шаблон вашего сайта на примере (CMS) WordPress.

Редактируем шаблон вашего сайта на примере (CMS) WordPress.

В интернете найти шаблон для вашего сайте не проблема, но при этом сохранить индивидуальность не просто. Остаётся два варианта либо изучить CSS (Cascading Style Sheets — каскадные таблицы стилей), либо заплатить профессионалу чтобы он изготовил вам оригинальный шаблон. А если мы не собираемся платить деньги и вникать в тонкости языка CSS не хотим, можно воспользоваться браузером Mozilla Firefox. В этом браузере есть встроенные функции для редактирования шаблонов. Начнём редактировать шаблона и в качестве примера выберем мой блог inetеsecret. ru созданный на (CMS) WordPress.

Наведем курсор на элемент, который хотим редактировать, нажимаем правую кнопку мыши и выбираем <исследовать элемент>.

После чего появится окно с кодом. В правом верхнем углу выбираем кнопку <правила>. И перед нами появляется скомпонованный CSS код. Теперь нам не нужно зарываться в код, пытаясь найти какой тег за что отвечает. В нашем распоряжении весь код отвечающий за конкретный элемент.

Теперь пробуем редактировать надпись в header сайта, изменив размер inetsecret. ru с 32 px до 45 px.

Смотрим на надпись, видим, что она увеличилась до нужного нам размера.

Но это изменение не имеет ни какого отношения к нашему сайту, все изменения происходят в браузере и если мы обновим страницу, то все наши изменения пропадут..! По этому нам нужно сделать изменения непосредственно в консоли. Но для начала нажмем на стиль css справа, появится окно с кодом. Запоминаем часть кода для более легкого поиска его в консоли управления.

Переходим к консоли: внешний вид —> редактор.

По умолчанию открывается таблица стилей (style. css). Если нам нужен другой стиль, находим соответствующий стиль CSS, который мы редактируем в Mozilla Firefox и вносим изменение непосредственно в шаблон нашего сайта.

После изменения нажимаем кнопку <Обновить файл>. Теперь наши изменения шаблона сайта вступили в действие.

Еще одно интересное и полезное свойство Mozilla Firefox в возможности 3D просмотра сайта. Это свойство оказывается очень полезным, когда не легко выделить нужный код нажатием мыши, так как блоки сайта имеют наложение друг на друга. С помощью 3D можно просматривать шаблон с любого ракурса и выделить именно тот элемент, который нужен. Нажмите в правом нижнем углу кнопку <3D вид>.

Теперь мы можем добраться до любого слоя и выделить его css код. Таким образом мы с вами отредактировали шаблон вашего сайта.


Карта сайта


Информационный сайт Webavtocat.ru