Блог

Я создаю веб-сайт WordPress, и на главной странице находится категория музыкальных жанров. Сайт создан так, что вы можете слушать музыку разных жанров, а затем покупать бит. Я создал страницы, соответствующие жанрам (хип-хоп, регги, rnb, рэп и т. Д.), Однако моя проблема заключается в отображении музыкального контента (то есть на главной странице) На соответствующих страницах.

Например, у хип-хопа, афро-бит и т. Д. Есть свои собственные страницы, Поэтому я хочу ситуацию, когда пользователи нажимают на навигационную ссылку для страницы Afrobeat, она переводит их на страницу, на которой отображается весь музыкальный контент, соответствующий жанру Afrobeat, который является Fine Girl. Я хочу, чтобы музыкальный контент отображался на странице Afrobeat с тем же стилем, что и на изображении ниже

Я использовал текстовое поле плагина Adavanced Custom Fields для отображения названия жанра

Вот код:

 <div class="jp-gui jp-interface">
<div class="player_controls_box">
    <div>
        <div class="jp-controls-holder player_controls">

          <audio id="myAudio3" preload="metadata">
            <source src="<?php bloginfo('template_directory');?>./files/bensound-sunny.mp3" type="audio/mpeg">
            <p>Alas, your browser doesn't support html5 audio.</p>
          </audio>

          <button
            class="jp-play player_button"
            tabindex="0"
            onclick="tooglePlay3()"
          ></button>

        </div>
    </div>
</div>

<span class="song_details">
  <div>
    <h4>SONG TITLE:</h4> <span><?php echo $fine_girl_track['song_title'];?></span>
  </div>
  <div>
    <h4>GENRE:</h4> <span><?php echo $fine_girl_track['genre'];?> // This line is displaying the genre with the (echo $fine_girl_track['genre']) part displaying the text from the advanced custom fields genre text field
  </div>

  <div>
    <h4>PRICE:</h4> <span><?php echo $fine_girl_track['price'];?>
  </div>
</span>

<button class="button tour_button">
  <a href="<?php echo $fine_girl_track['link'];?>"><?php echo $fine_girl_track['link_text'];?></a>
</button>
 

Ниже представлено изображение музыкальных жанров, отображаемых на сайте:

Изображение страниц сайта, отображающих навигационные ссылки: