Новогоднее украшение блога — снеговик и сугробы внизу экрана

Автор статьи
Денис Иванов
Время на чтение: 5 минут
АА

Украсить сайт к новому году быстроВот уже наступил декабрь месяц. Очень скоро самый любимый праздник большинства Новый Год. Страна наряжается. Повсюду устанавливаются елки, развешиваются праздничные гирлянды. В воздухе витает предвкушение скорого торжества. Так же можно украсить сайт к Новому Году, чтобы создать у своих посетителей ощущение праздника. Сегодня мы добавим на сайт сугробы и симпатичного снеговичка. Про украшение сайта новогодней гирляндой я уже писал на своем блоге. Гирлянда выглядит очень симпатично и мелодично звучит при наведении мышки на шары. К исходному варианту были добавлены синие шары. В итоге в моем варианте гирлянды присутствуют три цвета шаров: белый, красный и синий. И самое главное, эта гирлянда не мешает просматривать ваш сайт, создавая праздничное настроение.
На этот раз мы добавим в нижнюю часть сайта снеговика и снежные сугробы. Если к этому еще добавить падающий снег, то получится логичная картинка.

Как украсить сайт к новому году

Чтобы сделать задуманное, сначала скачайте две картинки снега и снеговика. Эти картинки нужно положить в папку images вашего шаблона.
Далее в файл шаблона footer.php перед тегом </body> вставляем следующий код

[php]<span class=»snowman»></span>
<span class=»snow-layer»></span>[/php]

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

[css].snowman {
background: transparent url(«images/snowman.png») no-repeat scroll right top / 80px auto;
bottom: 0;
display: block;
height: 110px;
position: fixed;
right: 2%;
width: 100px;
z-index: 3;
}
.snow-layer {
background: transparent url(«images/snow-layer.png») repeat-x scroll center top / auto 20px;
bottom: 0;
display: block;
height: 20px;
position: fixed;
width: 100%;
z-index: 1;
}
@media screen and (max-width: 1024px){
.snowman, .snow-layer {display: none;}
}[/css]

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

[css].snowman {
background: transparent url(«images/snowman.png») no-repeat scroll right top / 80px auto;
bottom: 0;
display: block;
height: 110px;
position: fixed;
right: 2%;
width: 100px;
z-index: 3;
}[/css]

на

[css].snowman {
background: transparent url(«images/snowman.png») no-repeat scroll left top / 80px auto;
transform: scale(-1, 1);
bottom: 0;
display: block;
height: 110px;
position: fixed;
right: 2%;
width: 100px;
z-index: 3;
}[/css]

Вот в принципе и все. Вы смогли украсить сайт к Новому Году. Счастья и удачи вам в новом году!

Очередной шедевр от Enjoykin чисто отдохнуть

Рейтинг автора
Автор статьи
Денис Иванов
Автор блога, всея заработка в этих ваших интернетах
Написано статей
183
Помогла статья? Оцените её
Звёзд: 1Звёзд: 2Звёзд: 3Звёзд: 4Звёзд: 5 Оценка: 4,83 (голосов: 6)
Загрузка...
Комментарии
  1. Татьяна

    Праздничное настроение своими руками :) Кому елку, кому шарики, для кого-то и снежинки в радость

    • Денис Иванов

      Главное не переборщить. :) Видел тут на одном сайте гирлянду с моргающими лампочками. Так убого выглядит. Плюс постоянно моргает. Бррр.

  2. Максим Бойко

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

    Т.е. таким приёмчиком — украшенным сайтом, некоторые получали постоянных читателей)

    • Денис Иванов

      Интересное наблюдение. Никогда раньше об этом не задумывался.

  3. Сергей Петров

    Я очень люблю всякие подобные украшения для сайта. Один минус — они часто сильно его грузят. Раньше у меня было несколько сайтов по различным тематикам. К новому году мы всегда их украшали: всякими «дедморозовскими» шапками, елочками и падающими снежинками.

    Денис, шарики на Вашем сайте очень понравились. Подумаю, чтобы сделать так же.
    Всех с наступающим новым годом!

    • Денис Иванов

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

      • Виталий

        Ранее, когда я шаблоны менял «как перчатки» (это было в первые 4-6 лет моего блогерства), под Новый год тоже использовал отдельный, праздничный, дизайн шаблона (есть и среди бесплатных довольно неплохие). Притом на 2-3 недельки особенно ничем мои захудалые бложики не рисковали.
        Сейчас же, когда полюбившийся дизайн не меняю уже 3 года, на НГ его менять рисковать не буду. ;-)

        • Денис Иванов

          На его основе можно тоже новогодний сделать. Фрилансеры быстро переделают.

  4. Ольга mescher410

    Как-то было дело — украшала свои сайты. Но потом решила больше времени не тратить на это. Да и знакомая сказала, что «прокололась» на работе: зашла на мой сайт, а там гирлянда с песней «Джингер белл»)))
    Теперь просто буду поздравлять постом с пожеланиями и планами на следующий год. Вот как-то так…

  5. Денис Иванов

    Так звук можно и не ставить. Да и не всем, например, нравится та же джингер. :).

  6. Виталий

    А что? Гулять — так гулять! :-)
    Принимаю данную статью как призыв к действию. За технические рекомендации — большое спасибо! Что-то обязательно использую и в своих блогах.
    «Перебарщивать» не буду. Посмотрю, что и как гармонирует с моим шаблоном.

    • Денис Иванов

      Гирлянду, снег и снеговика уже второй год вешаю. Всякие мигающие лампочки лично меня раздражают. Пару плагинов пробовал — такая фигня.

  7. NI4KA

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

    • Денис Иванов

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

  8. Рита Молчанова

    Здорово, спасибо! Люблю Новый Год! И поэтому все украшаю,что только возможно, к этому самому лучшему празднику. Я обычно ставлю гирлянду на блог. Но в этом году, что-либо не хочу. А хочется чего-то новенького. Спасибо, воспользуюсь вашим уроком.

    • Денис Иванов

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

  9. Максад Исаев

    Я раньше, тоже особо не беспокоился в этом направлении, но наверное «Ностальджи настигло!». Хочется праздника! Здесь в Швеции, как и везде за кордоном, отмечают только Рождество! И никаких утренников или корпоративов! Так что я считаю, что можно и нагрузить немного сайт, всего то недели на две!

    • Денис Иванов

      Как же они там без корпоративов то? Скукотища же. :)

  10. Kanapiya.ru

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

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