Сохранить включенный HTML-элемент только на домашней странице - PullRequest
0 голосов
/ 04 февраля 2019

У меня есть сайт WordPress, который содержит аудио элемент, поэтому песня автоматически запускается, когда кто-то посещает сайт.Это выглядит так:

<figure><audio controls autoplay loop src="song-path.mp3"></audio></figure>

Это пользовательский HTML-виджет.Мне нужно, чтобы этот тег был активен только на домашней странице, поэтому я сделал этот CSS:

audio, canvas, progress, video {
display: none;
 }

.home audio, canvas, progress, video {
display: inline-block;
}

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

Есть ли способ полностью отключить или отключить звук песни для всех страниц, кроме дома?

Спасибо

Ответы [ 2 ]

0 голосов
/ 04 февраля 2019

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

https://wordpress.stackexchange.com/questions/76959/how-to-add-a-specific-widget-to-only-1-page

Однако, если это невозможно, вы можете остановить звук с помощьюJavaScript.Сначала добавьте идентификатор к вашему аудиоэлементу.

<audio id="myAudio" controls autoplay loop src="song-path.mp3"></audio>

Затем добавьте этот код там, где это необходимо.

<script>
var myHomeAudio = document.getElementById("myAudio"); 
myHomeAudio.pause(); 
</script>

Обновление: если вы идете по маршруту JavaScript, имя идентификаторане имеет значения - просто позаботьтесь о том, чтобы идентификатор элемента и способ ссылки на него в JS совпадали.Если вы хотите попытаться автоматически определить имя слагаемого «home», это может сработать.

var pathArray = window.location.pathname.split('/');
var currentPage = pathArray[0];
if (currentPage !== "home"){ // Not equal to the Home page
  var myHomeAudio = document.getElementById("myAudio"); 
  myHomeAudio.pause(); 
}

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

0 голосов
/ 04 февраля 2019

Почему вы не добавляете его только на домашнюю страницу?

if ( is_front_page() ) :
    the_widget( 'play_mp3_widget' );
else :
    the_widget( 'dontplay_mp3_widget' ); //* Or do Nothing *//
endif;
...