Падающий снег на jQuery или html шаблон Новогодней поздравительной открытки. Падающий снег на jQuery или html шаблон Новогодней поздравительной открытки jSnow – универсальный скрипт падающего снега на jQuery

Украшать свои сайты и блоги в период Новогодних и Рождественских праздников дело хорошее. Приятно как-то даже такие сайты посещать:).

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

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

Совсем недавно в google появилась новая фишка. Я о ней сообщал в — это падающий снег и замораживающийся экран, который потом можно стирать пальцем. Попробуйте, введите в поисковик запрос “let it snow ”.

Мне очень понравился такой подход по двум причинам:

1 . Выглядит очень симпатично ;

2 . Снег начинает падать лишь по запросу пользователя.

Вот такое украшение по мне. Но реализовать заморозку экрана я не смогу — не программист, хочу заказать программисту, но не уверен что поспеет к этому Новому году. А вот с падающим снегом в стиле гугла и «по заказу» посетителя — это можно:). Правда опять же не своими силами, а с помощью одного хорошего «иносранца»:), но не суть.

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

Новогодние плагины падающего снега для WordPress

Очень даже хороший плагин. Не мало разного рода настроек: скорость анимации, цвет падающего снега, размер хлопьев, количество одновременно падающих снежинок и др. Есть даже что-то вроде замораживания, но я не смог его запустить:(.

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

Но мне этот плагин не подошел. Во-первых я не очень люблю плагины и пользуюсь ими только при острой необходимости, а во-вторых снег начинает «валить» сразу после загрузки страницы (второй пункт помните?) и иной раз отвлекает от основного контента сайта (мелькают мухи перед глазами, блин:)), да и снежинки все одного размера.

Говорят хороший плагин. У меня почему-то не запустился, хотя установился нормально, а снега нет:). Попробуйте, может у вас получится лучше.

Этот плагин делает точно такой же снег, как сейчас у меня. Настроек никаких особо нет, просто — установили и пошел снег. Хотя если захотеть, то кое-что настроить все же можно (цвета, скорость и т.д.) в редакторе плагинов, т.е. редактируя сам файл плагина.

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

Этот плагин можно назвать универсальным праздничным плагином. По мимо собственно снега этот скрипт может и шарики надувные пускать и листочки всякие:).

Очень интересный плагин…даже захотелось установить. Но…, есть у меня уже свой снег:).

Снег на сайт по запросу пользователя

Вот собственно то решение, которое на мой взгляд лучше всего из всех перечисленных выше. Конечно здесь не все так круто, как в том же «Snow, balloons and more», но проще не значит хуже.

Самый главный плюс этого скрипта — это «снег по заказу». Снег не пойдет сам по себе, его надо будет вызвать нажатием кнопки. Таким образом посетитель не будет напрягаться по поводу бесконечно мешающих читать белых хлопьев на экране. Если он захочет снега, он его увидит.

Для начала скачайте эти файлы и залейте на ваш сервер в нужную папку: , . Кнопка, кстати, вот так выглядит:

Затем между тегами пропишите путь к скриптам:

< script type= "text/javascript" src= "путь/jquery.min.js?ver=1.7" > < script src= "путь/jquery.letsinsnow.js" >

Обратите внимание, если у вас уже есть подключенная библиотека jquery, то повторно подключать ее совсем не требуется. Тогда просто пропишите путь к jquery.letsinsnow.js.

В файле jquery.letsinsnow.js в строке 15 (‘color’ : ‘#79B3EC’,) можно изменить цвет снежинок. Остальное думаю можно оставить по-умолчанию;).

Осталось лишь кнопку на сайт добавить, по клику на которую повалит снег. Для этого необходимо выполнить пару легких шагов:

1 . Разместить код кнопки в нужном месте сайта:

< input name= "snowbutton" TYPE = "button" onclick= "$("body").snowFall();" title= "Снежинки!" class= "snowbutton" />

У меня кнопка размещена в шапке блога. Потому код я добавлял в файл header.php своего wordpress шаблона.

2 . Добавить в файл стилей (обычно это style.css) следующий стиль:

.snowbutton { background : url ("snowflake.png" ) 100% no-repeat ; width : 64px ; height : 64px ; overflow : visible ; margin-top : 80px ; margin-left : 740px ; cursor : pointer ; border : 0 ; }

Здесь вам понадобится откорректировать пару параметров:

— путь к изображению кнопки: background:url(«snowflake.png») 100% no-repeat; .

— место расположения кнопки на сайте: margin-top:80px; (отступ сверху экрана) и margin-left:740px; (отступ слева).

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

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

Удачи Вам друзья! С наступающим Новым годом и Рождеством!

Сладкое на сегодня: Приятная мелодия, приятная песня, приятный Рождественский клип. Наслаждайтесь 🙂

Украшаем свой блог к Новому году. Предлагаю вашему вниманию старый но не забытый и любимый блогерами виджет ПАДАЮЩИЕ СНЕЖИНКИ.

Гуляя по просторам интернета наткнулась на удивительный блог и такой вот текст в статье прочитала: « Я старый солдат и не знаю слов любви и потому у себя в блоге снежинки не добавил, несолидно как-то».

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

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

Как установить гаджет « Падающие снежинки»

Заходим Административная панель Blogger > Дизайн > Добавить гаджет HTML/JavaScript . В окно вставляем код.

После того, как вставили код в гаджет, желательно поднять его как можно выше. Сделать это не трудно, захватываем левой кнопкой мышки гаджет HTML/JavaScript и тащим вверх под шаблон и отпускаем, не получилось с первого раза, повторите еще раз.

Доброе время суток и с наступающим. В преддверии Нового года я хочу с вами поделить очень легким, красивым и неприхотливым плагином падающего снега. Этот скрипт действительно очень легкий и спокойно помещается в html файле, не затрудняя работы с самим html кодом сайта. Правда его можно и вынести в отдельный файл. Но для удобства я сделал все в одном файле.

Тут мало что можно сказать, лучше посмотреть демонстрацию этого падающего снега. Вдобавок там очень красивый фон и надпись "С Новым годом", написанная красивым шрифтом "Lobster" от Google. Вы с легкостью этот файл можете превратить в интернет открытку с поздравлением.

Подключение скрипта падающих снежинок на готовый сайт 1. Подключаем библиотеку jQuery

Подключается она так: между тегами и вставляете следующий код:

2. Подключаем стили

Вставьте css-код в свой css файл (обычно это style.css):

#canvas { border: 1px solid black; position: absolute; z-index: 10000; } #flake { color: #fff; position: absolute; font-size: 25px; top: -50px; }

3. Создаем файл snow.js

Создадим файл snow.js и вставляем туда следующий javascript-код:

var t = setInterval(function(){ var documentHeight = $(document).height(); var startPositionLeft = Math.random() * $(document).width() - 100; var startOpacity = 0.5 + Math.random(); var sizeFlake = 10 + Math.random() * 20; var endPositionTop = documentHeight - 40; var endPositionLeft = startPositionLeft - 100 + Math.random() * 200; var durationFall = documentHeight * 10 + Math.random() * 5000; $("#flake") .clone() .appendTo("body") .css({ left: startPositionLeft, opacity: startOpacity, "font-size": sizeFlake } ) .animate({ top: endPositionTop, left: endPositionLeft, opacity: 0.2 }, durationFall, "linear", function() { $(this).remove() }); }, 500); var snow = {}; var snowflex = {}; snowflex.create = function(){ var flex = document.createElement("div"); flex.innerHTML = "❄"; flex.style.fontSize = 10 + Math.random() * 20 + "px"; flex.style.top = - 50 + Math.random() * 20 + "px"; flex.style.left = Math.random() * 1500 + "px"; flex.style.position = "absolute"; flex.style.color = "#F3F3F3"; flex.style.opacity = Math.random(); document.getElementsByTagName("body").appendChild(flex); return flex; }; snow.snowflex = function(){ var flex = snowflex.create(); var x = -1 + Math.random() * 2; var t = setInterval(function(){ flex.style.top = parseInt(flex.style.top) + 5 + "px"; flex.style.left = parseInt(flex.style.left) + x + "px"; if (parseInt(flex.style.top) > 1500) { clearInterval(t); document.getElementsByTagName("body").removeChild(flex); } }, 45 + Math.random() * 20); }; snow.storm = function(){ var t = setInterval(function(){ snow.snowflex(); }, 500); }; //snow.storm(); var fog = {}; fog.draw = function(ctx, x, y){ ctx.fillStyle = "rgba(255, 255, 255, " + Math.random() + ")"; ctx.arc(x, y, 10,0,Math.PI*2,true); ctx.closePath(); ctx.fill(); }; fog.start = function(){ var ctx = document.getElementById("canvas").getContext("2d"); var x = 0; var y = 0; var t = setInterval(function(){ x = 300 + 300*Math.sin(x); y = 300 + 300* -Math.cos(x); x += 2; fog.draw(ctx, x, y); }, 100); }; //fog.start();

Подключаем js-файл в :

4. Вставляем html код

Ну и осталось самое главное - вставить html код падающего снега в любое места в :

❄

Если вы все сделали правильно, то у Вас на сайте начнет падать снег.

Подключение фоновой картинки, большого заголовка и падающих снежинок

Этот вариант отличается тем, что у него есть фоновое изображение и большой заголовок «С Новым годом». Подключить этот вариант скрипта падающего снега на сайт достаточно просто. Нужно:

1. Скачиваем архив и его разархивировируем 2. Подключаем библиотеку jQuery

Обязательно подключить библиотеку jQuery (не обязательно, если у Вас уже подключена эта библиотека). Подключается она так: между тегами и вставляете следующий код:

3. Подключаем шрифт "Lobster"

Аналогично подключению бибилиотеки jQuery, подключаем шрифт для нашей надписи "С Новым годом":

Естественно, если Вам не нужна эта надпись и шрифт, вы можете его не подключать, но тогда и в css уберите у атрибута H1 "font-family: "Lobster", cursive;", или замените его на свой шрифт

4. Подключаем стили

Вариант А. Вставьте css-код в свой css файл. Вот код:

Img.bg { /* Set rules to fill background */ min-height: 100%; min-width: 1024px; /* Set up proportionate scaling */ width: 100%; height: auto; /* Set up positioning */ position: fixed; top: 0; left: 0; } h1 { font-family: "Lobster", cursive; color: #FFF; font-size: 90px; text-align: center; line-height: 95px; font-weight: normal; margin-top: 300px; text-shadow: 5px 5px 5px #000; } @media screen and (max-width: 1024px) { /* Specific to this particular image */ img.bg { left: 50%; margin-left: -512px; /* 50% */ } } html, body { font-family: Helvetica, Arial, sans-serif; font-size: 12px; line-height: 16px; padding: 0; margin: 0; color: #333; } .bar { background-color: #111; color: #f0f0f0; box-shadow: 0px 0px 2px #333; line-height: 25px; padding: 0px 20px; opacity: 0.7; } .bar:hover { opacity: 1; } .bar a { color: #DDD; } .bar a:hover { color: #FFFFFF; } a { color: #FFFFFF; text-decoration: none; } a:hover { color: #CCC; } #canvas { border: 1px solid black; position: absolute; z-index: 10000; } #flake { color: #fff; position: absolute; font-size: 25px; top: -50px; } #page { position: relative; }

Вариант B. Также можно создать отдельный файл, например snow.css и вставить этот же код туда, правда его надо будет подключить в head следующим образом:

5. Подключаем скрипт падающего снега

Вариант А. Для этого нам нужно вставить в самый низ сайта (до закрытия ) следующий javascript-код:

var t = setInterval(function(){ var documentHeight = $(document).height(); var startPositionLeft = Math.random() * $(document).width() - 100; var startOpacity= 0.5 + Math.random(); var sizeFlake= 10 + Math.random() * 20; var endPositionTop= documentHeight - 40; var endPositionLeft= startPositionLeft - 100 + Math.random() * 200; var durationFall= documentHeight * 10 + Math.random() * 5000; $("#flake") .clone() .appendTo("body") .css({ left: startPositionLeft, opacity: startOpacity, "font-size": sizeFlake }) .animate({ top: endPositionTop, left: endPositionLeft, opacity: 0.2 }, durationFall, "linear", function() { $(this).remove() }); }, 500); var snow = {}; var snowflex = {}; snowflex.create = function(){ var flex = document.createElement("div"); flex.innerHTML = "❄"; flex.style.fontSize = 10 + Math.random() * 20 + "px"; flex.style.top = - 50 + Math.random() * 20 + "px"; flex.style.left = Math.random() * 1500 + "px"; flex.style.position = "absolute"; flex.style.color = "#F3F3F3"; flex.style.opacity= Math.random(); document.getElementsByTagName("body").appendChild(flex); return flex; }; snow.snowflex = function(){ var flex = snowflex.create(); var x = -1 + Math.random() * 2; var t = setInterval(function(){ flex.style.top = parseInt(flex.style.top) + 5 + "px"; flex.style.left = parseInt(flex.style.left) + x + "px"; if (parseInt(flex.style.top) > 1500) { clearInterval(t); document.getElementsByTagName("body").removeChild(flex); } }, 45 + Math.random() * 20); }; snow.storm = function(){ var t= setInterval(function(){ snow.snowflex(); }, 500); }; //snow.storm(); var fog = {}; fog.draw = function(ctx, x, y){ ctx.fillStyle = "rgba(255, 255, 255, " + Math.random() + ")"; ctx.arc(x, y, 10,0,Math.PI*2,true); ctx.closePath(); ctx.fill(); }; fog.start = function(){ var ctx = document.getElementById("canvas").getContext("2d"); var x = 0; var y = 0; var t = setInterval(function(){ x = 300 + 300*Math.sin(x); y = 300 + 300* -Math.cos(x); x += 2; fog.draw(ctx, x, y); }, 100); }; //fog.start();

Вариант B. Также как и с css-кодом, javascript можно вынести в отдельный файл и также его назвать snow.js и подключить его в head:

6. Заливаем изображение фона

Залить картинку bg.jpg из архива в корень Вашего сайта

7. Вставляем html код

Ну и осталось самое главное - вставить html код падающего снега:

С Новым годом! ❄

Скрипт падающего снега успешно подключен. Обязательно посмотрите его в работе. Всего доброго!

Всем привет дорогие друзья! Хоть и кончилась зима, но все равно хочу рассказать вам как создать падающие снежинки на сайте WordPress, чтобы немного вспомнить зимние деньки:-). Делать падающие снежинки мы будем с помощью скрипта и плагина.

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

Как сделать падающие снежинки WordPress с помощью плагина?

Побродив по интернету в поисках лучшего варианта я остановил свой выбор на плагине – WP Super Snow. В некоторых статьях я встречал и другие варианты, но у всех у них авторы давно не занимаются обновлениями своих творений. А вордпресс постоянно обновляется и развивается. Поэтому здесь нужно постоянно поддерживать свой проект, чтобы была совместимость со всеми версиями.

Итак, зайдем в раздел Плагины – Добавить Новый и установим плагин падающих снежинок для WordPress.

Нажимаем на кнопку Установка, все делаем как обычно. Кстати, если вы до сих пор не знаете, как , то моя статья вам в этом поможет.

Отлично! Плагин мы установили и активировали. После этого в левой части вашей панели администратора WordPress появится раздел Super Snow.

Перейдя внутрь вы увидите, что плагин отключен и его нужно включить.

Сейчас мы с вами пробежимся по основным настройкам.

Первый раздел Deactivation Safeguards (Безопасность при деактивации) – оставляем первый пункт в выпадающем списке как есть, ничего не меняем. Тем более он рекомендуемый. Здесь нас просто предупреждают, что если вы удалите плагин из общего меню, то ничего не потеряно. Если вы хотите стереть все следы пребывания плагина на сайте, то тогда должны нажать на первый вариант. Показано здесь:

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

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

Например, вы можете запускать падающие снежинки только на специфических страницах указав это с помощью специальной функции (Они приведены на странице)

Вот примеры функций:

Wp_is_mobile () && is_page ("christmas-promo" ) — если эта страница не мобильная, то показывать на странице Christmas-promo

Wp_is_mobile () && ! is_ssl () – не показывать если это не мобильное устройство и не защищенный протокол https и SSl

Wp_is_mobile () && time () >= strtotime ("2015-12-01" ) && time () подключаем наш скрипт вот такой строчкой:

Для наглядности покажу куда я его вставил:

Обязательно сохраните все изменения и вот, что у вас должно получиться на сайте:

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

Вставим следующий код ниже в область футера:

snowStorm.snowColor = "#99ccff"; // голубоватые снежинки, цвет можно менять snowStorm.flakesMaxActive = 100; // Показывать количество снежинок на странице snowStorm.useTwinkleEffect = true; // мерцающий эффект

В шаблоне все это будет выглядеть так:

Теперь посмотрим, что получилось в браузере:

Как мы видим наши снежинке на сайте стали нежно голубоватого цвета, прямо настоящий снегопад на сайте получился 🙂

Другие настройки скрипта снежинок

Для того, чтобы еще более «поизвращаться» над скриптом я пробегусь по другим опциям.

snowStorm . autoStart = true ; — выбор между тем будет ли снег автоматически появляться при загрузки страницы или нет.

snowStorm . animationInterval = 33 ; — измерение интервала миллисекунд на кадр. При значение = 20 быстрая и гладкая, но будет нагружать процессор. Если поставить = 50, то более консервативно, но медленнее.

snowStorm . flakeBottom = null ; — ограничение прилипания снегу к нижней части странице. Если не указано, то снег просто прилипнет к нижней части страницы сайта и исчезнет с прокруткой или скроллингом.

snowStorm . flakesMax = 128 ; — установка значения максимального количества снежинок, выпадающих в любой части страницы за единицу времени.

snowStorm . flakesMaxActive = 64 ; — устанавливает предел падающих снежинок (т.е движущихся на экране и считающихся активными).

snowStorm . followMouse = true ; — позволяет снегу двигаться на сайте с «ветром» по отношению к движению мышки по оси X (вправо/влево).

snowStorm . freezeOnBlur = true ; — останавливаем эффект снежинок, когда пользователь в данный момент выходит из окна браузера, например переходит на другую вкладку, тогда снег останавливается. Это сберегает CPU и приятнее для пользователя.

snowStorm . snowColor = "#fff" ; — белый цвет снега (не ешьте и не используйте на сайте желтый снег:-))

snowStorm . snowCharacter = " " ; — . ( ) = bullet. · entity (·) не используется, поскольку в некоторых системах это считается квадратом. Любое изменение можно привести к обрезке нашей снежинки и может также повлечь flakeWidth (длина) / flakeHeight (высота) изменения, так что будьте осторожны.

snowStorm . snowStick = true ; — параметр позволяет снежинкам «прилипать» к низу экрана, когда выключен, то снег никогда не осядет на дно экрана.

snowStorm . targetElement = null ; — здесь немного сложнее, я это понял как html элемент прописывается по умолчанию в тело документа (body ). Может быть элементом ID строки, например ‘myDiV’ или DOM ссылкой. Как-то так.

snowStorm . useMeltEffect = true ; — при поддержке данного параметра упавший снег будет таять, при включенном значении.

snowStorm . useTwinkleEffect = true ; — позволяет снегу мерцать вне поля зрения в момент падения.

snowStorm . usePositionFixed = false ; — при булевском значение true — окно прокрутки не будет влиять на падающий снег, т.е он будет идти и идти. Это заметно увеличивает нагрузку на процессор. По умолчанию стоит false.

snowStorm . vMaxX = 8 ; snowStorm . vMaxY = 5 ; — значение быстроты снежинок по x и y для шторма. Случайная величина в этом диапазоне выбирается для каждого снежинки.

На этом все дорогие друзья, вполне возможно, что я допустил где-то ошибку в объяснении настроек скрипт, вы тогда меня поправьте. У меня, в целом, все прекрасно работает и радует глаз. Спасибо за внимание, жду ваших комментариев и дискуссий. У меня к вам вопрос — а какой эффект вы используете с наступлением зимы для сайта? 🙂

позаботится об украшение сайта . Заходишь на сайт, а там, падает снег или снежинки , чувствуется дух праздника и сразу создаётся хорошее праздничное настроение. Хотя снег виртуальный, но всё равно, радует. Согласны? Ну конечно. Тогда, я вам сегодня подскажу - Как добавить, включить, установить снег или снежинки на сайте .

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

Плагин Snow Flurry - идёт снег на сайте WordPress

Простой и полностью настраиваемый плагин. С возможностью установки: максимальный размер снежинки; как часто создаются новые хлопья; добавить минимальную и максимальную скорость падения снега, цвет снежинки, а также, возможность отключить плагин после заданного количества секунд. После установки и активации plugin, в админпанели появится раздел с соответствующим названием:

Супер плагин WFS Let It Snow - добавляет снегопад на вашем сайте

Плагин WFS Let It Snow

Отличный плагин на JQuery, с помощью его можно устроить просто настоящий снегопад на сайте, то есть, белую мглу. В настройках можно выбрать тип снегопада из четырех вариантов: слабый, средний, тяжёлый и белая мгла. А также, сделать падающие снежинки только на главной странице или на всех; включить/отключить снег; минимальный и максимальный размер снежинок; минимальная и максимальная скорость хлопьев; включите тени (для веб-сайтов с белым фоном):

Настройка WFS Let It Snow Plugin

Здесь, также после установки и активации плагина в разделе настройка появится подраздел Let It Snow, нажимаете и настраиваете. Идем далее.

Tribulant Snow Storm - метель на вашем сайте

Этот плагин мне понравился больше, даже не знаю почему, может из за направления снегопада, метель из снега реагирует на движение указателя мышки (если включить такую опцию). Прикольно, посетителям понравится. Ещё из настроек: цвет снега; количество хлопьев; интервал анимации; поддержка мобильных; снег таит внизу экрана и эффект мерцания:

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

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

Скрипт падающего снега на сайт

Скрипт падающих снежинок подойдёт для любого сайта или блога на любой платформе. Только придётся повозиться (скрипт надо загрузить на свой хостинг), можно использовать свой хостинг где расположен ваш сайт, а можно воспользоваться сторонним, например: бесплатный и Диск Google. И так вот код скрипта:

/* Snow Fall 1 - no images - Java Script Visit http://rainbow.arch.scriptmania.com/scripts/ for this script and many more */ // Set the number of snowflakes (more than 30 - 400 not recommended) var snowmax=100 // Set the colors for the snow. Add as many colors as you like var snowcolor=new Array("#b9dff5","#b9dff5","#b9dff5","#b9dff5","#b9dff5") // Set the fonts, that create the snowflakes. Add as many fonts as you like var snowtype=new Array("Times") // Set the letter that creates your snowflake (recommended: *) var snowletter="*" // Set the speed of sinking (recommended values range from 0.3 to 2) var sinkspeed=0.6 // Set the maximum-size of your snowflakes var snowmaxsize=35 // Set the minimal-size of your snowflakes var snowminsize=8 // Set the snowing-zone // Set 1 for all-over-snowing, set 2 for left-side-snowing // Set 3 for center-snowing, set 4 for right-side-snowing var snowingzone=1 /////////////////////////////////////////////////////////////////////////// // CONFIGURATION ENDS HERE /////////////////////////////////////////////////////////////////////////// // Do not edit below this line var snow=new Array() var marginbottom var marginright var timer var i_snow=0 var x_mv=new Array(); var crds=new Array(); var lftrght=new Array(); var browserinfos=navigator.userAgent var ie5=document.all&&document.getElementById&&!browserinfos.match(/Opera/) var ns6=document.getElementById&&!document.all var opera=browserinfos.match(/Opera/) var browserok=ie5||ns6||opera function randommaker(range) { rand=Math.floor(range*Math.random()) return rand } function initsnow() { if (ie5 || opera) { marginbottom = document.body.scrollHeight marginright = document.body.clientWidth-15 } else if (ns6) { marginbottom = document.body.scrollHeight marginright = window.innerWidth-15 } var snowsizerange=snowmaxsize-snowminsize for (i=0;i(marginright-3*lftrght[i])){ if (snowingzone==1) {snow[i].posx=randommaker(marginright-snow[i].size)} if (snowingzone==2) {snow[i].posx=randommaker(marginright/2-snow[i].size)} if (snowingzone==3) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/4} if (snowingzone==4) {snow[i].posx=randommaker(marginright/2-snow[i].size)+marginright/2} snow[i].posy=0 } } var timer=setTimeout("movesnow()",50) } for (i=0;i