Как сделать шапку для сайта
Здравствуйте друзья! Сегодня будет показано, как сделать шапку для сайта бесплатно и своими руками всего за три шага. Замена шапки сайта под силу любому новичку.
Как заменить шапку сайта
Не секрет, что шапка сайта очень важна для Вашего ресурса, по сути, это визитная карточка любого сайта или блога. Поскольку большинство новичков делают свои блоги на движке WordPress и используют стандартные темы, то часто возникает вопрос, как сделать шапку для сайта, именно свою, индивидуальную. И это правильно, шапка сайта не должна повторяться, это не совсем хорошо для его продвижения. В этой статье мы и рассмотрим, как заменить шапку сайта.
В одной из моих статей Простой шаблон сайта, как изменить шапку этот вопрос уже рассматривался, но там приводился в пример шаблон и тема моего блога, с другими темами надо поступать немного иначе. Многие новички задавали мне вопросы, как сделать шапку для сайта под ту или иную тему, сегодняшняя статья ответит на них.
Конечно, можно обратиться на фриланс и Вам это быстро сделают, но это стоит денег. Новичкам больше подойдёт создание шапки для сайта бесплатно. Сделать это может своими руками любой новичок. Процесс замены шапки сводится к замене картинки в верхней части сайта и он состоит из трёх шагов:
- находим ту папку на блоге, где хранится картинка нынешней шапки сайта;
- создаём в любом графическом редакторе новую шапку сайта;
- делаем простую замену старой картинки шапки на новую.
Определить адрес папки, где хранится картинка шапки, достаточно просто. Для этого надо навести мышкой на шапку сайта, нажать правой кнопкой мыши на картинку, всплывает окно, в котором нажимаем «Открыть фоновое изображение» (скрин).
На экране открывается картинка шапки. В адресной строке браузера появляется ссылка, где четко прописано, где размещается картинка. Ссылку надо скопировать. Картинку шапки сайта тоже надо скопировать, она понадобится нам для определения размеров.
Не все темы на WordPress позволяют так просто определить адрес папки, где хранится картинка шапки. Например, тема моего тестового блога это не позволяет сделать, при нажатии правой кнопкой мыши по шапке, записи «Открыть фоновое изображение» просто нет. С этом случае надо поступить следующим образом:
- открываем админпанель нашего блога;
- в панели инструментов выбираем «Внешний вид», «Заголовок».
В верхней части окна появляется изображение шапки сайта, теперь нажав правую кнопку мыши, появляется окно и запись «Открыть фоновое изображение» (смотрите скрин),
копируем саму картинку, а в адресной строке получаем точный адрес картинки. Все подробности показаны в прилагаемом ниже видео.
к оглавлению ↑Создание шапки сайта
Теперь переходим ко второму этапу – создание шапки сайта, точнее, изображение для нее. Этот процесс описывать не буду, в прилагаемом видео это показано. Упомяну только важную деталь – новое изображение должно быть точно такого же размера, как и старое и иметь такое же расширение, например, png. Во многих темах нужно дать картинке такое же название, какое было у старой картинки. Почему? Потому, что Вы будете просто подменять старую картинку новой, а в кодах сайта прописаны ссылки именно под название изображения шапки.
На третьем этапе осуществляется простая замена одной картинки другой. Как это делается можно посмотреть либо в предыдущей статье, либо посмотреть прилагаемое видео. Некоторые темы позволяют сделать замену изображение шапки гораздо проще. Вернемся снова на мой тестовый блог. Заходим в админпанель, «Внешний вид», «Заголовок». Нажимаем кнопку «Обзор», выбираем изображение для шапки сайта на компьютере и нажимаем «Загрузить», через несколько секунд изображение загружено.
Теперь в чек-боксе возле нужного изображения ставим точку и нажимаем кнопку «Сохранить изменения».
Идем на блог, обновляем его и видим, что установлена новая шапка для сайта. В подобных темах можно загрузить несколько изображений, которые будут переключаться случайным образом, будут показываться разные шапки. В прилагаемом видео смотрите весь процесс замены шапки:
Данная статья и видео дополнили предыдущую статью, Вы узнали, как сделать шапку для сайта бесплатно своими руками. Весь процесс занимает минут 10-15, не считая затрат времени на создание изображения новой шапки. Ведь создание картинок всегда процесс творческий. Обновляйте свои картинки и делайте блог индивидуальным и привлекательным. Удачи Вам!
С уважением, Иван Кунпан.
P.S. Для продвижения Вашего блога Вам пригодятся мои знания и трёхлетний опыт. Можете скачать интеллект карты «Пошаговый алгоритм создания блога для новичков» или «Пошаговый алгоритм написания мощных статей для блога«. Можете посмотреть также мой платный видео-курс «Как написать и оптимизировать статью на блоге. Продвижение блога статьями«. Если этих материалов будет мало, заходите на страницу библиотеки «Создание сайтов и работа с ними» и выбирайте нужный Вам видео-курс.
Шапка вещь нужная и полезная. Согласен полностью. Однако, еще хорошо бы в неё воткнуть такой баннер, который будет зарабатывать блоггеру денюжку 🙂
Григорий, приветствую! Хм, интересный подход, нужно будет подумать над этим предложением 🙂
Андрей, в шапке баннеры работают лучше всего.
На молодых блогах рекламные баннеры устанавливать не рекомендуется, поисковики это не одобряют, а вот со временем можно. Но надо помнить, что баннер будет зарабатывать при хорошей посещаемости блога.
Как всё меняется со временем…Когда-то баннеры были одним из основных источников заработка, а сейчас уже постепенно уходят в прошлое…С уважением, Анна.
Анна, баннеры сейчас работают плохо. Если есть посещаемость, лучше установить рекламу от Google Adsense.
Иван, заменить саму шапку дело действительно 10-15 минут, а вот нарисовать и придумать оное произведение, вот тут сложновато.
Согласен, сделать изображение для шапки нужно уметь и нужно время, но это отдельная история. Цель статьи показать, как можно поменять шапку, для многих новичков это проблема.
Иван, вот вы, как в зеркало глядели…Это я о новичках…Хотя, если вы никогда с этим не сталкивались, то и у не новичков возникнут проблемы…Всё нужно попробовать сделать своими ручками хотя бы один раз…С уважением, Анна.
Анна, Вы правы!Мне часто говорят: «Зачем самому делать ту или иную работу самому — отдай её на фриланс». С такими высказываниями я не согласен. Дело в том, что кроме затрат, нужно еще и понимать, а что будет делать фрилансер. Сколько это займет времени, сколько реально это будет стоить? Именно поэтому и надо сначала попробовать сделать самому.
Безусловно, абсолютно всё подряд делать самому тоже неправильно, но основное, надо уметь.
Иван, здравствуйте! Вот как хорошо оно совпало у меня…Я сейчас делаю тестовый блог, и мне туда нужно шапка блога…Ещё мне нужен фон…я тоже не знаю, как его установить…Вот я ищу ответы на эти два вопроса…Захожу к вам на блог и вижу вашу статью…Возможно, для кого-то опытного это дело — пустяк, а у меня — проблема…Благо, что это тестовый блог, и я там провожу эксперименты с этими вопросами, но пока результата нет…Сейчас посмтрю ваше видео и потом отпишусь ещё…С уважением, Анна.
Анна, по этой статье Вы все сделаете легко. Кстати, фон меняется там же достаточно просто. Вам надо зайти «Внешний вид», «Фон».
Как хорошо, когда тебе есть кому подсказать, тогда и проблемы решаются легко относительно…Спасибо вам за помощь…С уважением, Анна.
Для этого мы и общаемся в Интернете.
Иван, посмотрела ваше видео, мне показалось, что я с этим справлюсь…Теперь у меня есть ориентир, как это нужно сделать, и я попробую выполнить эту задачу…Спасибо вам за статью и видео…Мне оно очень помогло разобраться в данной проблеме…Как установлю, отпишусь или буду задавать вам вопросы, если что-то не пойдёт…С уважением, Анна.
Хорошо, после окончания работ напишите, как у Вас всё получилось, будем ждать.
Иван, здравствуйте! Хочу вас порадовать, что по вашей статье установила хедер на тестовый блог, сделала на нём даже надпись, вставила своё фото…Правда, фото почему-то получилось не качественное, поэтому пока не ставлю, а просто сохранила шапку сайта с фото…Буду продолжать ещё эксперименты…Как менять фон тоже разобралась…получился простой хедер, но со вкусом, как мне показалось…С уважением, Анна.
Что касается фото, то это уже работа в фотошопе, но если поработать, то и там можете получить хороший результат.
Иван, я работала в программе Поинт, а там можно вставить фото, вот только нужно добиться его качества…С уважением, Анна.
В PowerPoint можно делать с фото работу, но там нельзя получить высокое качество. По этой причине, я использую PowerPoint только для подготовки презентаций.
Для создания шапки лучше использовать Фотошоп, можно использовать программу немного проще — фотошоп онлайн Pixlr. Об этом я писал на блоге. Сам я пользуюсь именно этой программой. Разобраться с ней можно быстро.
Иван, Анна пишет про Поинт, а Point это или Paint не разобрать.
Шапку блога, который у меня на данный момент стоит, сам делал в программе Фотошоп. При этом свою фотографию вырезал из фона. Вырезал тоже в Фотошопе и статью на блоге написал как это сделать.
Андрей, здравствуйте! Остаётся только поздравить Вас с тем, что вы так хорошо владеете фотошопом и можете всё сделать самостоятельно…Притом, это всё будет -эксклюзив…С уважением, Анна.
Анна, блог и должен быть сделан эксклюзивно, должна быть уникальность и оригинальность.
Иван, я умею работать в этой программе фотошоп онлайн Pixlr, вообще мне этот редактор очень нравится, там можно делать всё…Только разобраться нужно…спасибо за совет…С уважением, Анна.
Да, программа классная. Не знаю почему, но многие люди её не ценят, а зря — Pixlr делает все, что делает фотошоп.
Да, Иван, он делает всё, что делает фотошоп, и не надо загружать программу на компьютер, очень удобный интерфейс, можно экспериментировать до бесконечности и всё потом изменить или сохранить…Я очень часто использую этот редактор…С уважением, Анна.
Да, это часть работы, которую Вы сделали в фотошопе. У многих новичков возникает вопрос технического характера, как заменить?
Детальные и наглядные инструкции. Спасибо за статью.
Думаю, новичкам будет легко разобраться и сделать работу.
Иван, не знаю, как кому будет легко или нет, но разобраться при огромном желании вполне можно…И научиться этому тоже можно…Зато сколько эмоций возникает, когда у тебя получается, пусть вначале примитивно, но ты делаешь сам…С уважением, Анна.
Анна, всегда так бывает — первый раз делаешь, получается коряво, второй раз, уже лучше, а дальше отлично. Это и есть опыт. Вы не представляете, какие корявые обложки на книги я делал первые разы, а сейчас уже получше. Так у всех бывает.
Иван, мне понравилось ваше слово «корявые»…вот, вот точно выразились…Так и у меня сейчас, но меня это не тревожит…Главное, я поняла, как это нужно делать…Пусть пока «коряво», но зато своими ручками…Спасибо вам за науку трудиться и получать результаты…С уважением, Анна.
Главное каждый день делать шаг вперёд, пусть даже маленький, а со временем окажется, что проделан большой путь. Если бы мне сказали три года назад, что я буду делать своими руками, то что я сейчас делаю — я бы не поверил этим людям.
Иван! Вы молодец! У вас не сайт, а целая техническая энциклопедия!С шапкой это вы здорово придумали. И все своими ручками, никого не привлекая! Удачи вам!
Спасибо, Наталья. Действительно, большинство работ я делаю самостоятельно, где-то экспериментирую. И только после получения результатов я делюсь своим опытом с читателями блога — а как иначе?
Иван, и чтобы мы делали без вашего блога и ваших таких конкретных пошаговых статей…Спасибо за ваш труд и за то, что делитесь с нами своими наработками и помогаете решать наши маленькие проблемы(хотя для нас они кажутся ОГРОМНЫМИ)…С уважением, Анна.
Спасибо Анна, за оценку моего труда, приятно слышать, что твои труды приносят пользу. Если бы меня не было в Интернете, были бы десятки других статей. Хотя все мы разные и статьи у нас разные.
Иван, действительно, статей в интернете очень много на любые темы…Но, когда так долго посещаешь блог, как ваш, то уже «прикипаешь»…А главное( для меня, конечно) — я вам ДОВЕРЯЮ…А это, как мне кажется, дорогого стоит…Спасибо вам за обучение и помощь…С уважением, Анна.
Анна, согласен — доверие это великая сила. Если есть доверие читателей, это дорогого стоит, для этого действительно надо много сделать нужного и полезного для людей. Доверие, это оценка другими людьми твоего труда, а это значит, что ты не напрасно работал. Не знаю, как другие блоггеры относятся к этому, но мне это приятно, ведь получаешь моральное удовлетворение. Хочется и дальше публиковать полезный и нужный контент.
Очень интересно. Спасибо за такую инструкцию.
Как-то делал шапку с помощью спец программы xheader, но без доп программ всегда лучше)
Руслан, согласен, без программ и плагинов всегда лучше и надежнее.
Иван, здравствуйте! Спешу сообщить, что на тестовом блоге я установила шапку или хедер(правильно говорить)…Спасибо за статью, которая помогла мне понять, как это нужно сделать…Теперь ещё потренируюсь, чтобы хорошо всё усвоить…С уважением,Анна.
Анна, я Вас поздравляю!!! Вот видите, всё просто.
Иван, я бы не сказала, что всё так просто, но, если очень нужно, то разобраться придётся…А потом это просто интересно так работать…когда ты сам что-то делаешь и сразу видишь результат…С уважением, Анна.
Согласен, если видишь результат, то это вдохновляет еще больше.
Я думаю, что все мы пришли в интернет с какими-то планами и надеждами…У всех они разные…Кто-то мечтает о большом зарабтке, а кому-то достаточно, чтобы оплатить хостинг и аккунт…С уважением, Анна.
Всё зависит от целей, которые каждый себе ставит. Насчет малого заработка, которого хватит только на оплату услуг — думаю, маловато. Если не ставить себе более высокие цели, то и результата не будет. Всё же планку надо поднять выше.
Иван, я не буду вам противоречить, так как каждый решит сам, какая планка ему нужна…Если очень хотеть, то, наверное, можно зарабатывать…С уважением, Анна.
Всё верно, много еще зависит от целей, которые мы себе ставим. Кстати, часто бывает и наоборот — цели ставим, а реализация поставленных целей, получение результатов не дотягивает и до 50%.
Мне кажется, что при постановке целей мы иногда не учитываем свои силы и возможности…Поэтому не добираем до конечного результата…А может хотим большего, чем можем сделать…Всё зависит только от нас…С уважением, Анна.
Анна, согласен. Мы часто ставим себе завышенные цели и это является причиной невыполнения. Но это гораздо лучше, чем ставить заниженные цели. В первом случае темпы роста, темпы достижения успеха получаются всегда выше, чем во втором случае. Значит, не надо бояться ставить завышенные цели!
Вы знаете, Иван, а я как-то особенно этим и не заморачиваюсь…Надумала что-то сделать — делаю, пока не получится…Как-то я спокойно отношусь к целям, заданиям для себя и так далее…Стараюсь жить более менее спокойно и уравновешенно…С уважением, Анна.
Опять же, смотря, как ставить цели. Если поставить задачу достичь цель к определенному сроку, это одно, а поставить цель сделать, завершить работу без временных ограничений, это другое.
Вот именно так я и поступаю последнее время…Живу по принципу:»Тише едешь — дальше будешь…»Ну а если человек с большими амбициями и запросами, то тогда нужно ставить цели временные,указываю дату выполнения…С уважением, Анна.
Согласен, здесь много факторов. Кто-то молодой и горячий, кто-то холерик, а кто-то меланхолик. Все мы разные и подходы разные.
Для Анны. Вы правильно заметили, что программу не надо устанавливать на компьютер. Не надо покупать программу Фотошоп — зашел в Интернет и работай.
Ну что, Иван, я Вам ответила на ваш комментарий на моём блоге…Посмотрите почту, возможно мне повезёт, и Вы получите моё уведомление об ответе …Очень хотелось бы, чтобы мои ожидания оправдались…Если снова осечка, то буду ещё раз всё проверять…Странность заключается в том, что другие читатели получают мои уведомления…Скажите, а от других посетителей вы получаете такие уведомления? Это для того, чтобы понять, что же происходит…Возможно, это связано с обновлением вашего блога? С уважением, Анна.
Анна, я ничего не получил. От других блоггеров мне приходят письма. Возможно, письмо попало в спам? Спам, обычно, удаляю быстро, делаю только беглый просмотр — проверю еще раз.
Иван, не надо больше заморачиваться…Не могло моё письмо попасть в спам…Буду работать дальше…Когда получите, тогда и сообщите мне…С уважением, Анна.
Хорошо, буду следить.
Иван, вот сейчас обратила внимание, что время отправки моего комментария выставлена у меня неправильно, сейчас 11:20, а у меня показывает 17:20…Не подскажете, как правильно выставить время? Не обращала раньше внимание на это, а сегодня вдруг обнаружила такую нелепость…С уважением, Анна.
Нужно обратить внимание на то, что показывают Ваши часы в нижней, правой трее. Если часы там показывают неправильно, надо выставить правильно часовой пояс и само время. К комментариям это отношения не имеет — это настройки компьютера. У меня пару раз так было — не мог увидеть сообщений из скайпа, а потом выяснилось, что время сбилось и сообщения публиковались в скайпе намного выше, чем были получены последние сообщения (то есть публиковались по времени). Естественно, я эти сообщения и не видел.
Всё дело в том, что в трее часы показывают правильное время…Возможно нужно порыться в настройках темы? Ладно, у вас своих проблем хватает, а тут я ещё со своей «мелочью»…Буду искать ответы в интернете…С уважением, Анна.
Анна, надо поискать ответы на форумах, надо найти подходящий форум и написать им вопрос.
Да, конечно, буду искать ответы…С уважением, Анна.
Потом расскажете нам.
Иван, спасибо большое за статью. Сколько денег, времени, нервов она сбережёт мне! Я попробовала опытному фрилансеру заказать шапку – и что вы думаете? С меня потребовали пароли и к Вордпрессу, и к панели Хостинга! Это там будут ворошить, а мне потом разгребай, что там теперь изменено? Конечно, Вы правы, прежде чем поручать работу фрилансеру, надо досконально знать свой сайт, чтобы понимать, что изменяет в нём фрилансер и не пребывать в растерянности. Фрилансеру надо давать понять, что при желании, вы бы справились с этой работой лучше него.
Алина, всё верно. Можно конечно все работы делать на фрилансе, но возникает вопрос, а зачем тогда сайт делали? Можно было его заказать и по каждому чиху бегать к специалистам. Только такой подход потребует много денег и моральных издержек.
Каждый из нас по разному относится к этому вопросу, но мне кажется, что основы своего блога надо знать и большинство вопросов надо решать самому.
Что касается доступа к сайту. Без доступа к админпанели блога, без доступа к хостингу, фрилансер работу под ключ не сделает. Если Вы хотите заказать работу, то надо давать пароли. Другое дело, перед тем, как дать доступ, надо сохранить свой блог и базу данных к себе на компьютер, а после завершения работ, пароли поменять. Это должно стать правилом.
Спасибо, Иван, за очень ценные замечания! Мне ещё не приходилось нанимать фрилансера, теперь буду знать, что перед отдачей паролей фрилансеру надо сохранить свой блог (пока не знаю как) и базу данных к себе на компьютер, а лучше ещё и на флэшку.
Ну и , естественно, потом немедленно заменить пароли.
Алина, сохранить сайт просто, надо только один раз сделать руками. У меня есть статья, как сохранить блог и базу данных на хостинге TimeWeb https://biz-iskun.ru/kak-sohranit-kopiyu-sayta-s-hostinga-timeweb.html Принцип сохранения схожий на большинстве хостингах. Только надо не забыть, что сохранить нужно две составляющие — сам блог и отдельно базу данных.
Вот я тоже не сохраняла ещё ни разу свой блог…Как-то страшновато…Это от того, что впереди неизвестное…С уважением, Анна.
Анна, найдите время, наберитесь смелости и обязательно сохраните. К сожалению, есть много примеров, когда люди теряют свои блоги навсегда.
Иван, посвятила вечер Вашему блогу. Статья — про одно, спасибо за информацию о смене шапки на сайте, это я вроде нормально проделывала, но наткнулась на очень полезную информацию о том, как сохранить сайт. Мне сейчас как раз это очень нужно, собираюсь перетаскивать продающую стр.-лендинг с одного сайта на другой и, конечно, сначала надо все скопировать. Теперь приступлю к этому процессу вооруженная знаниями. Спасибо за информацию. С уважением, Марина.
Пожалуйста Марина. Да, сайт надо сохранять, это сэкономит много времени и нервов.
Здравствуйте, Иван! Спасибо за помощь в изменении шапки блога! Пусть не за 15 минут, но за полтора часа справилась! Не так страшен черт, как его малюют! Если придётся второй раз менять шапку, справлюсь за 5 минут!
С уважением, Алина Таранец, автор блога ПУТИ К ЗДОРОВЬЮ.
Пожалуйста Алина! Всё правильно, как в поговорке: «Глаза боятся — руки делают»!
Алина, здравствуйте! Какая же вы умница и труженица!!! Я узнала, что вы получили ТИЦ -10…Поздравляю Вас!!! С уважением, Анна.
Анна, извините, что вклинился. Могу сказать, что у Алины на одном из блогов появилась сотая статья.
Давайте вместе порадуемся её успеху…Она — большая труженица…Поздравляем с успехом, Алина…С уважением, Анна.
За неё надо порадоваться, она молодчина!
Иван, а ведь это здорово, когда люди общаются на одной волне, понимают друг друга, поддерживают друг друга…Такое общение дорогого стоит…Я рада, что нахожусь среди таких друзей…С уважением, Анна.
Вы рассказываете как заменить шапку на другую. А если в шаблоне нет шапки, как быть в таком случае?
Наталья, если в шаблоне нет шапки, её можно установить, не вопрос. Другое дело, что сделать это новичку самостоятельно будет непросто, нужно уметь работать с кодом. Но можно поручить работу фрилансеру, стоимость работы небольшая.
Никогда не видел, чтобы в шаблоне не было шапки. Даже не представляю, как может выглядеть сайт без шапки.
Есть такие темы, в верхней части просто нет рисунка, хотя сам Header в шаблоне есть.
Александр, такие темы могут быть…Правда, они не радуют глаз и не привлекают к себе внимание…С уважением, Анна.
Для Александра, ветка закончилась. Ответ на комментарий»Иван, Анна пишет про Поинт, а Point это или Paint не разобрать.»
Да, согласен. И та и другая программа имеет отношение к редактированию графики.
Для Анны. Ответ на комментарий «Иван, а ведь это здорово, когда люди общаются на одной волне, понимают друг друга, поддерживают друг друга…Такое общение дорогого стоит…Я рада, что нахожусь среди таких друзей…С уважением, Анна.»
Думаю, Алине приятно будет прочитать наши комментарии.