В канун Нового года хочется создать праздничное настроение не только для себя, но и для всех читателей! Поэтому собрал небольшую подборку скриптов, чтобы можно было украсить свой сайт или блог на новогодние праздники.
Как всегда, приведу ниже пример как вставить код и сделаю в конце поста ссылку для скачивания в подарок, чтобы можно было скачать его и вставить.
<h4 style="color:#FF5733;" > Новогоднее настроение</h4>
<style>
.brd {
border: 4px double black; /* Параметры границы */
width: 180px;
background: #9acd32; /* Цвет фона */
padding: 10px; /* Поля вокруг текста */
}
</style>
<audio controls class="brd">
11
<source src="audio/music.ogg" type="audio/ogg; codecs=vorbis">
12
<source
13
src="https://secrwsemsvet.addsalesforce.com/wp-content/uploads/2022/01/dean-martin-let-it-snow.mp3" type="audio/mpeg">
14
</audio>
Вставка плеера для новогодней мелодии
Это код плеера для прослушивания новогодней мелодии. Вставляется межу тегами <header >…</header> файла header.php вашей темы. Параметры стиля такие как ширина и цвет фона можно изменить на свои, а так же добавить другую музыку. Незабудте прописать путь к папке, в которой она находится.
Делать это лучше через FileZilla — бесплатный FTP-клиент, предварительно сделав копию файла.
Можно так же воспользоваться специальным плагином— WP code, вставка кода гораздо упрощается, так как делать это можно из админпанели WordPress.
Но всегда надо помнить, что все плагины влияют на скорость загрузки страниц сайта! В пакет тем для вордпресс входят так называемые виджеты, чтобы упростить вставку любой информации без знания программирования.
Они находятся так же в админке вордпресса. Виджет называется html-код, перейти к нему можно из вкладки Внешний вид> Виджеты>html-код «добавить».
Ниже предоставлю скрипт новогодней гирлянды, который добавляется так же точно, как описано выше.
<style type="text/css">
#garland {position:absolute;top:0;left:0;background-image:url('http://phpbb3.x-tk.ru/store/phpbb3_kabb_ru/images/nov-god-animi-bl-girlianda.png');height:36px;width:100%;overflow:hidden;z-index:99}
#nums_1 {padding:100px}
.garland_1 {background-position: 0 0}
.garland_2 {background-position: 0 -36px}
.garland_3 {background-position: 0 -72px}
.garland_4 {background-position: 0 -108px}
</style> <div id="garland" class="garland_4">
<div id="nums_1">
1</div>
</div>
<script type="text/javascript">
function garland() {
nums = document.getElementById('nums_1').innerHTML
if(nums == 1) {document.getElementById('garland').className='garland_1';document.getElementById('nums_1').innerHTML='2'}
if(nums == 2) {document.getElementById('garland').className='garland_2';document.getElementById('nums_1').innerHTML='3'}
if(nums == 3) {document.getElementById('garland').className='garland_3';document.getElementById('nums_1').innerHTML='4'}
if(nums == 4) {document.getElementById('garland').className='garland_4';document.getElementById('nums_1').innerHTML='1'}
}
setInterval(function(){garland()}, 600)
</script>
Такое украшение создаст праздничную атмосферу и хорошее настроение.
А вот и ссылка на архив с файлами для скачивания, останется только скопировать их и вставить в нужное место.
