We wanted to share some code with you that we created to show content if a WordPress Custom Meta / Field exieted within a WordPress Custom Post Type. Most versions that we’ve encountered make this a bit cumbersome and we wanted a way to do it with php, but also to include full html within each command. Here’s the snippet:-

<!-- if the custom meta exists show it -->
<?php
$your_custom_meta = get_post_meta($post->ID, 'your_custom_meta', true);
if ( $your_custom_meta ) { ?>

<!-- Show Something Below-->
<div>Hello</div>

<?php } else { ?>
<!-- there is no custom meta -->
<div>Nothing to see here</div>
<?php } ?>
<!-- end  -->

A Practical Application Show a Vimeo Video (with embed code) with WordPress Custom Meta

In our application we wanted to show a Vimeo Video of a set size based on the Custom Meta (‘ecpt_cpc_video_1’ – substitute your own ‘custom_meta’) within a Custom Post Type – the Custom Meta in our case was the Vimeo Video ID. Here is the raw code:-

<!-- if the first video exists show it -->
<?php
$ecpt_cpc_video_1 = get_post_meta($post->ID, 'ecpt_cpc_video_1', true);
if ( $ecpt_cpc_video_1 ) { ?>

<div class="video"><iframe src="https://player.vimeo.com/video/<?php $url = get_post_meta(get_the_ID(), 'ecpt_cpc_video_1', true);$url = substr(strrchr($url, '/'), 1); echo $url; ?>?title=0&amp;byline=0&amp;portrait=0" width="599" height="337" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></div>

<!-- wrap the download area-->
<div class="download-wrapper">

<!-- Show embed code -->
<div class="embed-code"><h2>Embed Code</h2>
<textarea id="embed_code" onfocus="this.select()" onclick="this.select()" readonly="readonly"><iframe src="https://player.vimeo.com/video/<?php $url = get_post_meta(get_the_ID(), 'ecpt_cpc_video_1', true);$url = substr(strrchr($url, '/'), 1); echo $url; ?>?title=0&amp;byline=0&amp;portrait=0" width="599" height="337" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></textarea></div>

<?php } else { ?>
<!-- there's no video message -->
<div class="download-wrapper"> <! also wrap the download area if theres nothing-->
<?php } ?>
<!-- end first vid -->
</div> <!-- end download wrapper-->

Assumptions

This will only work if you are within the WordPress Loop. An example of a Custom WordPress loop is shown below:-

					<?php /* Start the Loop */ ?>
				<?php while ( have_posts() ) : the_post(); ?>
					<!-- replace the below -->
					<?php
						/* Include the Post-Format-specific template for the content.
						 * If you want to overload this in a child theme then include a file
						 * called content-___.php (where ___ is the Post Format name) and that will be used instead.
						 */
						//get_template_part( 'content', get_post_format() );
					?>

<!-- this replaces the above standard code -->
<?php if ( is_search() ) : // Only display excerpts for archives and search. ?>
            <div class="entry-summary">
                <?php the_excerpt(); ?>
            </div><!-- .entry-summary -->
            
    <?php else : ?>
    
            <div class="entry-content">
 	    <div <?php post_class() ?> id="post-<?php the_ID(); ?>">

<!-- Your Content Goes Here-->

</div> <!-- end post-->
            </div><!-- entry-content -->
            
    <?php endif; ?>
    
    <!-- end replacement for above -->
<?php endwhile; ?>

About the Author

Glenn

A highly experienced Web Designer / Web Developer (Webflow, WordPress, Weebly & Custom), Front-end / Back-end Developer & New Media Specialist, with extensive knowledge of a wide spectrum of technologies in the Development and Creative Industries, built up over a number of years.