Вот уже наступил декабрь месяц. Очень скоро самый любимый праздник большинства Новый Год. Страна наряжается. Повсюду устанавливаются елки, развешиваются праздничные гирлянды. В воздухе витает предвкушение скорого торжества. Так же можно украсить сайт к Новому Году, чтобы создать у своих посетителей ощущение праздника. Сегодня мы добавим на сайт сугробы и симпатичного снеговичка. Про украшение сайта новогодней гирляндой я уже писал на своем блоге. Гирлянда выглядит очень симпатично и мелодично звучит при наведении мышки на шары. К исходному варианту были добавлены синие шары. В итоге в моем варианте гирлянды присутствуют три цвета шаров: белый, красный и синий. И самое главное, эта гирлянда не мешает просматривать ваш сайт, создавая праздничное настроение.
На этот раз мы добавим в нижнюю часть сайта снеговика и снежные сугробы. Если к этому еще добавить падающий снег, то получится логичная картинка.
Как украсить сайт к новому году
Чтобы сделать задуманное, сначала скачайте две картинки снега и снеговика. Эти картинки нужно положить в папку images вашего шаблона.
Далее в файл шаблона footer.php перед тегом </body> вставляем следующий код
|
1 2 |
<span class="snowman"></span> <span class="snow-layer"></span> |
Необходимо добавить стили в файл шаблона style.css (возможно у вас он называется по другому, но расширение будет .css или в некоторых шаблонах в настройках есть возможность добавления пользовательских стилей)
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 |
.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;} } |
В коде предусмотрено скрытие снеговика при просмотре на смартфонах. Так же можете поместить снеговика с левой стороны, заменив
|
1 2 3 4 5 6 7 8 9 10 |
.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; } |
на
|
1 2 3 4 5 6 7 8 9 10 11 |
.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; } |
Вот в принципе и все. Вы смогли украсить сайт к Новому Году. Счастья и удачи вам в новом году!
Очередной шедевр от Enjoykin чисто отдохнуть
Оценка: 4,83 (голосов: 6)
Загрузка...
Праздничное настроение своими руками
Кому елку, кому шарики, для кого-то и снежинки в радость
Главное не переборщить.
Видел тут на одном сайте гирлянду с моргающими лампочками. Так убого выглядит. Плюс постоянно моргает. Бррр.
Тоже подумаю об украшениях на блоге. Знаю таких людей, в основном девушек, которые заходили на украшенные сайты, восхищались ими и потом добавляли в закладки. Тем более, там была полезная информация.
Т.е. таким приёмчиком — украшенным сайтом, некоторые получали постоянных читателей)
Интересное наблюдение. Никогда раньше об этом не задумывался.
Я очень люблю всякие подобные украшения для сайта. Один минус — они часто сильно его грузят. Раньше у меня было несколько сайтов по различным тематикам. К новому году мы всегда их украшали: всякими «дедморозовскими» шапками, елочками и падающими снежинками.
Денис, шарики на Вашем сайте очень понравились. Подумаю, чтобы сделать так же.
Всех с наступающим новым годом!
В идеале конечно для новогодних праздников нужен отдельный дизайн. Тогда никакие плагины и украшения не понадобятся. Однако не каждый блогер может себе позволить купить два варианта дизайна шаблона.
Ранее, когда я шаблоны менял «как перчатки» (это было в первые 4-6 лет моего блогерства), под Новый год тоже использовал отдельный, праздничный, дизайн шаблона (есть и среди бесплатных довольно неплохие). Притом на 2-3 недельки особенно ничем мои захудалые бложики не рисковали.
Сейчас же, когда полюбившийся дизайн не меняю уже 3 года, на НГ его менять рисковать не буду. ;-)
На его основе можно тоже новогодний сделать. Фрилансеры быстро переделают.
Как-то было дело — украшала свои сайты. Но потом решила больше времени не тратить на это. Да и знакомая сказала, что «прокололась» на работе: зашла на мой сайт, а там гирлянда с песней «Джингер белл»)))
Теперь просто буду поздравлять постом с пожеланиями и планами на следующий год. Вот как-то так…
Так звук можно и не ставить. Да и не всем, например, нравится та же джингер.
.
А что? Гулять — так гулять!
Принимаю данную статью как призыв к действию. За технические рекомендации — большое спасибо! Что-то обязательно использую и в своих блогах.
«Перебарщивать» не буду. Посмотрю, что и как гармонирует с моим шаблоном.
Гирлянду, снег и снеговика уже второй год вешаю. Всякие мигающие лампочки лично меня раздражают. Пару плагинов пробовал — такая фигня.
А все эти новогодние украшения не перегружают сайт? И насколько корректно это выглядит на мобильных устройствах? Я подписана на блог о красоте и здоровье, его автор меняет дизайн каждый сезон. Отрисовано четыре дизайна по временам года, смотрится очень мило и каждый раз интересно смотреть, что изменилось с приходом зимы или весны.
Эти не грузят. Вот гирлянда возможно. Так как там скрипты подгружаются.
Отдельный вариант шаблона для каждого времени года по любому лучше и интереснее.
Здорово, спасибо! Люблю Новый Год! И поэтому все украшаю,что только возможно, к этому самому лучшему празднику. Я обычно ставлю гирлянду на блог. Но в этом году, что-либо не хочу. А хочется чего-то новенького. Спасибо, воспользуюсь вашим уроком.
Новый год любимый праздник с детства. Лично для меня даже лучше дня рождения.
Я раньше, тоже особо не беспокоился в этом направлении, но наверное «Ностальджи настигло!». Хочется праздника! Здесь в Швеции, как и везде за кордоном, отмечают только Рождество! И никаких утренников или корпоративов! Так что я считаю, что можно и нагрузить немного сайт, всего то недели на две!
Как же они там без корпоративов то? Скукотища же.
Да можно украшать, блог, сайт и т.д , но как и говорилось выше если грузит сайт, то не стал бы это делать. И это при каком условии набора клавиатуры, исходить звук?