Categories

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

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

Guillaume Dumas Сентябрь 4, 2015
Rating: 5.0/5. From 2 votes.
Please wait...

Из этого туториала Вы узнаете, как добавить аудиотрэк 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

Шаблоны Wordpress
Эта запись была размещена в WordPress туториалы и помечена как audio, auto-play, background, html5, WordPress. Добавьте в закладки постоянную ссылку.

Submit a ticket

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