I am building a WordPress website and on the homepage is a category of music genres. The site is created so that can listen to music beat of different genre then go ahead to buy the beat. I have created pages that match genres(hip hop, reggae, rnb, rap etc), however my problem is displaying the music content(ie the ones on the homepage) on their respective pages.
Like for example Hip hop, Afro beat etc has their own pages, so I want a situation where when users click on the navigation link for Afrobeat page it takes them to the page displaying all the music content that matches the genre Afrobeat, which is Fine Girl. I want to music content to display on the Afrobeat page with same styling as the ones in the image below
I used the Adavanced Custom Fields plugin's Text field to display the genre's title
Here is the code:
<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>