Как отредактировать верхнюю картинку (Header) в шаблоне блога.

исходная картинка сайта
Вы подобрали шаблон для блога. Всё хорошо, но верхний рисунок Вас не удовлетворяет.

Вот таким мой блог был вчера. Поскольку шаловливые ручонки бывшего технаря «мне покоя не дают», решил я немного улучшить картинку вверху блога. А то помощи просят, а помощи и не видно. Нужно бросить спасательный круг.
Сказано-сделано. Сравните два изображения – по-моему, стало лучше.

И не надо искать премиум шаблоны блогов wordpress.

Хотите попробовать сделать изменения в вашем блоге?


Сначала нужно найти картинки из которых мы будем собирать рисунок.
Заходим в яндекс. В моем случае запрос выглядел так:

яндекс поиск слова

Нажимаем на слово «картинки», получаем:

яндекс поиск картинки

Мне понравился этот спасательный круг. Для простоты дальнейших действий выбирайте рисунок на белом (или другом однотонном тоне, отличном от цвета рисунка).

спасательный круг 01
Теперь поищем картинку, которую нам будет необходимо изменить. У Вас должен быть шаблон блога в формате ZIP.
Разархивируем его, открываем папку «images», не ошибетесь, она там одна. Раскрываем папку.

Нас интересует файл под названием «Header», это то изображение, которое мы будем изменять.

 

Скриншот 2016-06-23 16-47-00
Скопируем графический файл в редактор (активная ссылка для бесплатного скачивания с официального сайта скачивания) paint-net .

Скриншот 2016-06-21 22-35-18

 

Устанавливаем и запускаем редактор.

Загружаем изображение в редактор. Просто перетащим из папки с шаблоном в окно редактора.

 

В открывшемся диалоговом окне кликаем на открытие изображения.

Скриншот 2016-06-23 16-52-26
Получаем такую картинку.
Нажимаем меню «Слои» и «Добавить новый слой».

 

Скриншот 2016-06-23 16-54-52

 

Снова «слои» и «импорт из файла»

 

Скриншот 2016-06-23 16-58-42

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

Щелкаем на изображение и нажимаем «открыть»

Скриншот 2016-06-23 17-06-43 (1)

Получаем такую картинку.

Скриншот 2016-06-23 17-22-09

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

Скриншот 2016-06-23 17-33-53 (1)

Теперь нам нужно убрать белый фон с рисунка спасательного круга.

Используем функцию «волшебная палочка».

Скриншот 2016-06-23 17-45-40

В вертикальном меню «инструменты» нажмите клавишу, на которую указывает стрелка. Или нажмите на клавиатуре «S». После этого щелкните левой клавишей мыши на белое поле. Программа автоматически выделит область, которую потом будем убирать. Как мы видим, результат не очень. Уменьшим чувствительность (верхняя стрелка).

Скриншот 2016-06-23 17-48-09

Как видим, границы изображения очерчены правильно. Нажимаем клавишу «Delet». О чудо!

Скриншот 2016-06-23 18-04-07 (1)

Так же поступаем с оставшимися белыми областями.

Заходим в меню «Слои» и выбираем «Объединить со следующим слоем»

Скриншот 2016-06-23 18-57-33

Полученный рисунок сохраняем.

Скриншот 2016-06-23 19-03-45

Заходим в меню «Файл», выбираем «Сохранить как», выбираем место сохранения и сохраняем в формате «Jpeg».

Теперь осталось заменить в папке исходный файл  «Header» на полученный, изменить имя папки с шаблоном — можно просто добавить цифру 1, архивируем в архив в формате ZIP. Загружаем полученный шаблон на блог.

Вуаля!

Можно полностью заменить изображение. Нужно только помнить, что размеры новой картинки в пикселах должны соответствовать исходному, сохранить имя файла Header и формат JPEG.

 

 

Поделись в соцсетях!

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

11 комментариев на “Как отредактировать верхнюю картинку (Header) в шаблоне блога.”

  • Спасибо за информацию,Олег!
    Давно мечтал подкорректировать шапку своего блога, но нигде не мог найти информацию, кроме той, где предлагают отдать на откуп специалисту. И вот теперь все прояснилось.
    Еще раз спасибо!!!

  • Спасибо за статью, полезная. Я свою шапку переделывал с помощью фотошопа. А файл header вытаскивал из папки thames корневой директории. В остальном аналогично Вам делал.

  • В любом случае мы сэкономили немного денег и получили удовольствие от сделанной работы. Спасибо за комментарий. читатели смогут выбрать свой вариант решения проблемы.

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

  • Привет Олег. Я долго выбирал шаблон и действительно, если он мне подходил, то в шапке обязательно была какая то надпись или рисунок не соответсвующей моей тематике. Статья очень актуальная. Буду экспериментировать. Спасибо !!!

  • Здравствуйте!
    Я и не собирался редактировать верхнюю картинку, но после вашей статьи захотелось это сделать.
    Спасибо вам за полезную информацию)

  • Здравствуйте!
    Шапка сайта, это, конечно, хорошо! Но в этой шапке и помимо картинки должен быть порядок.
    Вы считаете, что специалист «пошил бы» новую шапку хуже?

Оставить комментарий

Реклама
Бесплатный интенсив. Записывайтесь!
заработок в интернете
Счетчик посещений