Как изменить дизайн сайта WordPress

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

Начинающие блоггеры,  как правило устанавливают бесплатные темы или по другому шаблоны WordPress. Но шаблон он на то и шаблон, что у всех скачавших он одинаков. А скачавшие ту или иную тему измеряются десятками тысяч. И начинается настройка темы. Хорошо, если сам шаблон окажется удобным.  Но рано или поздно наступает момент, когда блоггер понимает, что сайту или блогу не хватает индивидуальности. Стандартное оформление перестает устраивать и хочется чего-то своего, неповторимого. И встает вопрос дизайна сайта: замены шапки (header) или фона, или того и другого.

Будем исходить из того, что картинку для шапки Вы уже подобрали или сделали в фотошопе – оказалось это не так уж и трудно сделать и знания фотошопа здесь нужны минимальные. В дальнейшем, я думаю, сделаю урок на эту тему.

Как заменить шапку из админпанели.Замена шапки (header) и фона из админпанели

В некоторых темах это можно сделать из админпанели. К примеру, открываем «Изображение заголовка» или «Фоновое изображение», нажимаем «Новое», потом «Выберите файл» или просто перетаскиваете туда Ваше изображение мышкой. Если Вы уже ранее загружали Ваш заголовок, то нажимаете «Загруженное» и выбираете нужное Вам изображение. Дальше регулируете «Повтор фона», «Позиция фона», «Привязка фона». И фоновое изображение на Вашем сайте меняется.

Как заменить шапку через хостинг.

Но в большинстве бесплатных шаблонов поменять шапку и фон из админки нельзя. Так что же, отказываться от удобного шаблона? Ни в коем случае. Сделать это можно на нашем хостинге, ведь все файлы нашего сайта хранятся именно на хостинге.  У меня сайт на Спринтхосте, но я думаю,  что на других хостингах делается это аналогично.

Просмотр кода элемента, шапка сайта

Итак, заменяем шапку сайта. Для замены шапки необходимо, чтобы размеры шапки в шаблоне и нашей новой шапки совпадали. Конечно, можно изменить высоту шапки на сайте, но сегодня я не буду разбирать,  как это делается. Если нужно, пишите в комментариях, объясню.

Как узнать размер шапки шаблона? Наводим мышку в любую область на шапке и кликаем на правую кнопку мыши. Появляется выпадающее окно,  и нажимаем «Просмотр кода элемента».

Определение размера шапки сайта

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

Записываем размер. И подгоняем размер нашей картинки в любом графическом редакторе, даже в программе Paint, которая есть у всех, у кого Windows. Она находится в стандартных программах. Я не буду останавливаться на изменении размера картинки, там нет ничего сложного и это уже совершенно другая тема.

Обычно картинка с шапкой в папке темы называется header.jpg. Нашу новую шапку мы называем также: header.jpg. Так же обратите внимание, чтоб название и расширение файла совпадало (оба файла должны называться header.jpg и быть с расширением jpg).  Когда я впервые меняла шапку, у меня название шапки было другое, удобное для меня. Результат – я долго искала причину, почему шапка не меняется. Так что название шапки имеет большое значение также как и расширение.

Новую шапку мы подготовили. Теперь надо ее вставить в сайт. Заходим в свой хостинг. Кликаем на нужный сайт, затем «Файловый менеджер».

Правая панель Спринтхоста

Файловый менеджер

Выбираем wp-content, затем themes, находим название темы, в которой хотим поменять шапку и кликаем на него.

Открываем свою тему

Заходим в images и ищем header.jpg.  C правой стороны в окошке ставим галочку.

header, шапка сайта

images

Идем вниз и нажимаем Delete.

Загрузить файлы в текущую директорию

Страница автоматически перезагружается,  и мы опять опускаемся вниз и нажимаем «Загрузить файлы в текущую директорию».

На открывшейся странице выбираем файл, затем нажимаем «Загрузить файл».

Выбрать и загрузить файл шапки сайта

Загрузка произведена. Теперь идем на свой сайт и обновляем его. Если Вы все сделали правильно, то у Вас на сайте новая шапка.

Таким образом, мы сегодня рассмотрели,  как заменить шапку сайта. Надеюсь моя статья окажется полезной для Вас и Вы без труда сможете заменить стандартную шапку на сайте на Вашу индивидуальную и неповторимую. Если что-то не будет получаться, пишите и я постараюсь Вам помочь.

А в следующей статье я расскажу,  как заменить фон на сайте, т.к. здесь есть отличия от замены шапки.

Если Вам понравилась статья и оказалась для Вас полезной, оставьте комментарии, а также поделитесь информацией с друзьями в социальных сетях – Вам не сложно, а мне приятно.

Интересно? Поделись с друзьями:

Опубликовать в Google Plus
Опубликовать в LiveJournal
Опубликовать в Мой Мир
Опубликовать в Одноклассники
Опубликовать в Яндекс

7 комментариев: Как изменить дизайн сайта WordPress

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Подпишитесь на новости

Новости

Ваш email:
email рассылки Конфиденциальность гарантирована
email рассылки

Отдохнём?