Получайте секретные материалы проекта на свой E-Mail:

Одна «шапка» на главной странице, а другая на остальных: как я это реализовал?

Доброго дня. Меня просто засыпали письмами с вопросами о том, как мне удалось реализовать смену шапки на своем блоге. Ну то есть, на главной странице у меня отображается одна шапка, а на всех остальных другая. Смотрится очень интересно, красиво и самое главное удобно. Не правда ли? Хотите научиться так же? Это делается очень легко, уж поверьте. Как я реализовал смену шапок на блоге?

В последнее время я замети, что данную функцию используют многие популярные инфобизнесмены на своих блогах. И мне это очень понравилось. Поэтому я начал искать способ как реализовать такую штуку в своем следующем шаблоне. И вот, как Вы видите, после смены дизайна, такая смена шапок появилась и у меня. Вам нравится? Лично мне да.

А самое классное заключается в том, что на реализацию функции уйдет совсем мало времени. У меня например ушло не более 5 минут.

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

Еще фишка такая: данную функцию можно реализовать абсолютно для любой надобности, не только для смены шапки, а например для отображения какого-то элемента или ссылки. В общем здесь уже сыграет Ваша фантазия. Я лишь покажу на своем примере, то есть как сделать смену шапки.

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

Шапка блога на главной странцие

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

Шапка блога на других страницах

Ну что ж, раз Вы до сих пор читаете данную статью значит заинтересовались тем, как же все таки реализовать такую смену.

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

2. После чего открываем файл header.php который находится в папке с темой блога и находим там строки, отвечающие за отображение шапки. Узнать какие строки за это отвечают можно следующим образом: в браузере Google Chrome наводите мышь на шапку, нажимаете правой кнопкой и выбираете «Просмотр кода элемента». После чего у Вас открывается консоль, где будет отображено какая строка отвечает за отображение шапки.

Код, отвечающие за вывод шапки

Вот у меня например за вывод шапки отвечает <div id="top_form">, у Вас будет что-то другое.

Если взглянуть на файл header.php у меня, то вот как раз этот div:

Div в файле header.php

3. Теперь наша задача перед этим дивом поставить вот такой код:

1
<?php if(is_home()) { ?>

А после закрывающего тега </div> вписывает следующее:

1
<?php } ?>

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

Код header после

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

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

1
2
3
<?php if(!is_home()) { ?>
Содержимое второй шапки
<?php } ?>

Теперь у Вас на деле две шапки, но одна появляется только на главной, а другая на всех остальных. Мы с Вами молодцы!

А теперь давайте разберем некоторые моменты. Так же, можно сделать так, чтобы элементы менялись и на других страницах блога. Для этого нам понадобятся следующие коды:

1
<?php if(is_single()) { ?> - для отображения только в записях
1
<?php if(is_page()) { ?> - для отображения только на статичных страницах
1
<?php if(is_arhive()) { ?> - для отображения только в категориях, рубриках

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

Просто вместо файла header.php редактируете другой, нужный Вам. Например, если хотите что-то изменить в подвале, то изменяете файл footer.php и т.д. Более подробнее о структуре шаблона можете прочитать здесь.

И на этому у меня все.

Пошел дописывать книгу. Выходит бомба! Уже скоро...

Спасибо за внимание.

Желаю удачи и до встречи в следующей статье.

С уважением, Константин Белан.

Белан Константин Сергеевич

С уважением, Константин Белан.

Рабочая 634570 Россия, Томская обл., г. Томск, +7 952 160 36 17
Добавить пост в избранныеПерейти к списку →
Сделайте мне приятно - нажмите на любую из кнопок:
Подпишитесь на рассылку блога и получайте новые статьи на свою почту
Количество комментариев к данной статье: 28
  1. Ответить

    Отличное сочетание новизны, информативности и комфортабельности. Опять же привлекает внимание и отражает только самое важное для читателя!

    • Именно! 🙂

      • Ответить

        А есть какие-то вариации с сайдбаром? И допустим можно же, если у тебя 2 сайдбара где-то вывести левый, а где-то правый? Ну или что-то в этом роде...

        • Можно. Все делается точно таким же образом, только изменять нужно файл sidebar.php

        • Ответить

          А, всё — сориентировался! 🙂 У тебя теперь пошли интересные статьи о всяких фишках с настройкой движка wordpress. Помню, ты и плагин делал — теперь синтезируй всё это 😉

        • Сейчас решил написать несколько статей о технических моментах WordPress, а потом примусь за фишки в ведении блога. Не хочется писать о том, что уже и так на миллион раз исписано, ну ты понимаешь 🙂

        • Вроде есть даже специальные функции, которые определят какой сайдбар загружать. Например, файл sidebar-1.php, и функция будет такая,

          Вроде так оно работает 😉

        • php код не показался в php написать get_sidebar (1);

        • Ответить

          Спасибо и Вам за совет 😉

  2. Ответить

    А у меня вот вопрос, может немного не в тему! Подписки куда лучше собрать в смартпундер или в рсс ленту!?

    • Я еще год назад отказался от сервиса FeedBurner и для rss-подписки стал использовать Смарт, позже перешел на Джаст. Что именно использовать решать только Вам!

      • Ответить

        А что лучше выбрать тогда Смарт или Джаст!?

  3. Костя, привет, попробую на пробном шаблоне что-нибудь замутить))

    Кстати, интересно знать твое мнение по поводу моего обновленного шаблона) Если будет время, зайди ко мне))

    • Привет. Зашел к тебе, посмотрел и отписался)

    • Ответить

      А почему старый дизайн не показали, я просто до этого не видел ваш сайт!

  4. Ответить

    Отличная вещь. Нужно тоже попробовать такое сделать. Если честно раньше на других блогах не встречал подобного, либо не обращал внимания.

    • Ответить

      Я видел такую шапку, но что бы она еще менялась, такого не видел!

      • Ответить

        Недавно встретил блог с подобной шапкой, но она немного не так отображается. как то не аккуратно и уходит в сторону

  5. Константин, а как Вы внедрили форму подписки в шапку? Это отличительная особенность шаблона или это выводится каким-либо кодом?

  6. Ответить

    Пускай зима, пускай метель

    Бушуют за стеною,

    Пускай мороз стучится в дверь –

    Мы празднуем с тобою!

    Желаю в Старый Новый год

    Веселья и удачи,

    Побольше радостных забот,

    Поменьше незадачи!

  7. Ответить

    Костя, привет! Отличный дизайн вышел, такой бизнес-стиль получился.

    • Ответить

      И мне понравилось оформление блога 🙂

  8. Ответить

    Добавил страницу в закладки: идея супер! Тоже захотел у себя такое реализовать — буду искать решение для Maxsite CMS.

    Благоодарю за идею.

    • Ответить

      Думаю что сделать такое можно на любой CMS принцип та один, только главное знать хорошо ваш движок

    • Ответить

      А что это у вас за движок такой, первый раз слышу!

      • Ответить

        Позиционируется как блоговый, но я считаю, что это универсальный движок. В подвале моего сайта найдёте ссылку на официальный сайт CMS.

        • Ответить

          Сейчас посмотрим что за движок такой!

  9. Ответить

    Здравствуйте, а можно такое же сделать на Blogger'e