advanced custom fields - How to display genre of music content from one page to another page in wordpress

admin管理员组

文章数量:1305101

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>

Below is an image of the music genres displaying on site:

Image of the site pages displaying navigation links:

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>

Below is an image of the music genres displaying on site:

Image of the site pages displaying navigation links:

• advanced-custom-fields

Share Improve this question edited Jan 27, 2021 at 21:36 fuxia♦ 107k3838 gold badges255255 silver badges459459 bronze badges asked Jan 27, 2021 at 19:59 Adekola OlawaleAdekola Olawale 1111 bronze badge

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

If I'm understanding your approach correctly, you seem to have hard coded music items?

I'm suggesting that you create custom post type, which whould be Music. You should also add custom taxonomy for the post type Music.

After this you can add music items under Music post type and set music items' genres as taxonomy. When this is done, you can add category url to menu.

Creating custom post type and custom taxonomy will help you to maintain your music items.

本文标签： advanced custom fieldsHow to display genre of music content from one page to another page in wordpress