When using our Timeline Express – Popups Add-On there are times when you have announcements on the timeline that contain no actual content, and when the ‘Read More’ link is clicked the popup is empty with the title and date visible but no content, confusing the users of your site.

To help out your readers, you can remove the ‘Read More’ links from the announcement containers, which prevents users from accessing the popup. This can be done using some nifty JavaScript to dynamically remove the ‘Read More’ links when the containers contain no content in them.

We’ve gone ahead and taken the liberty to write out a sample script that can be used to remove the ‘Read More’ links from your announcement containers that have no content.

Code Sample

You will want to add this code into your themes functions.php file, exactly as it’s written below. Ideally, you would want to add the code inside of the tags below into a separate JavaScript file and then you would want to use wp_enqueue_script() to load the script on the appropriate page, to help minimize JavaScript conflicts with your theme or other plugins running on your site. But adding it directly into your themes functions.php file will work as well.

/**
 * Remove the 'Read More' links from the announcement containers
 * when the announcement content is empty
 *
 * Note: This should be written in a separate .js file and enqueued
 * on the appropriate page to prevent conflicts
 *
 * @return mixed HTML markup for the script
 */
function remove_readmore_empty_popups() {
	
        ?>

	<script type="text/javascript">

	jQuery( document ).ready( function() {

		var $timeline = jQuery( '.timeline-express' );

		$timeline.children( 'div' ).each( function() {

			var $content  = jQuery( this ).find( '.the-excerpt' ).text().replace( 'Read more', '' ).trim(),
			    $readmore = jQuery( this ).find( '.popups-read-more-link' );

			if ( '' === $content ) {

				$readmore.remove();

			}

		} );

	} )

	</script>

	<?php

}
add_action( 'wp_head', 'remove_readmore_empty_popups' );