[contact-form-7 id="24085" title="Feedback RU"]

Новые шаблоны

CherryFramework 3. Как добавить автоматически воспроизводимый фоновый аудиотрэк, используя HTML5

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

CherryFramework 3. Как добавить автоматически воспроизводимый фоновый аудиотрэк, используя HTML5

Для того чтобы вставить HTML5 аудиотрэк в шаблон WordPress, следуйте таким инструкциям:

  1. Загрузите аудиофайл в папку wp-content/themes/themeXXXXX/audio. Если такой папки ещё не существует, создайте её. Мы советуем Вам использовать аудиофайл в формате MP3, так как этот формат поддерживается всеми современными браузерами.

  2. Скопируйте файл header.php из папки wp-content/themes/CherryFramework в папку wp-content/themes/themeXXXXX, если файл отсутствует в этой папке.

  3. Откройте файл wp-content/themes/themeXXXXX/header.php в любом редакторе кода.

  4. Вставьте следующий код перед закрывающим тэгом шапки (head):

    <script type="text/javascript">
    	(function($) {
    		$(document).ready(function() {
    			var audio = new Audio();
    			audio.src = "<?php echo get_stylesheet_directory_uri(); ?>/audio/file_name.mp3";
    			audio.loop = true;
    			audio.play();
    		});
    	})(jQuery);
    </script>
    </head>
    			

    Где file_name.mp3 — это название фонового аудиофайла.

    Если Вы добавите строку audio.loop = true; — аудиофайл будет снова воспроизведён, когда его воспроизведение завершится:

    WordPress._How to_insert_an_auto-played_background_audio_using_HTML5-1

  5. Сохраните изменения в файле header.php и загрузите его на сервер. Теперь, когда Вы обновите ваш сайт, Вы услышите фоновый аудиотрэк.

Вы можете также ознакомиться с детальным видео-туториалом ниже:

CherryFramework 3. Как добавить автоматически воспроизводимый фоновый аудиотрэк, используя HTML5