-
gadgetgurlz
I am trying to create an archive page of podcasts and I want a player to appear underneath the thumbnail. I have created a custom field for ‘podcast_link’ and I can bring it in dynamically using a heading, but there isn’t a way to wrap it with HTML.
https://directionsprod.wpengine.com/resources/podcasts/
The page contains a gp element w/ query loop. How can I bring in the custom field dynamically for this output:
<div class=”player”>
<audio controls=””>
<source src=”https://www.directionsonmicrosoft.com/sites/default/files/samples/podcasts/Season2Ep8Josh.mp3″>
</audio>
</div> -
Fernando
Hello there,
Try adding a Container Block with class
inject-custom-link
.Adding Custom Classes: https://wordpress.com/support/wordpress-editor/adding-additional-css-classes-to-blocks/
Then, add this snippet:
add_filter( 'render_block', function( $block_content, $block ) { if ( !is_admin() && ! empty( $block['attrs']['className'] ) && strpos( $block['attrs']['className'], 'inject-custom-link' ) !== false ) { $my_html = get_post_meta( get_the_ID(), 'YOUR-CUSTOM-META-FIELD-NAME', true ); $output = '<div class="player"> <audio controls=""> <source src="'. $my_html . '"</audio></div>'; return $output; } return $block_content; }, 10, 2 );
Adding PHP: https://docs.generatepress.com/article/adding-php/#code-snippets
Replace
YOUR-CUSTOM-META-FIELD-NAME
in the code. -
gadgetgurlz
Awesome! Thanks so much. Works perfectly (and is very handy for future needs).
-
Fernando
You’re welcome!
- You must be logged in to reply to this topic.