";
foreach ( $posts_array as $post ) {
// Get the permalink for this post, or if for some reason it doesn't exist, the home url
$permalink = get_permalink( $post ) ? get_permalink( $post ) : home_url();
// Get the posts thumbnail image url and widths and heights if they exist, or use a placeholder from the web at 300x200 pixels which is the default WordPress medium image size
$post_image = ! empty( wp_get_attachment_image_src( get_post_thumbnail_id( $post ), "medium" ) ) ? wp_get_attachment_image_src( get_post_thumbnail_id( $post ), "medium" ) : false;
$image = ! empty( $post_image ) ? $post_image[0] : "https://via.placeholder.com/300x200";
$image_width = ! empty( $post_image ) ? $post_image[1] : 300;
$image_height = ! empty( $post_image ) ? $post_image[2] : 200;
// Then for each post object in the post array, we create a subcontainer with the class dahlia-dowler-single-post
$posts .= "
";
// Scrim, a dark element allowing text above it to be legible over any imagery underneath
$posts .= "";
// We'll start with the title
$posts .= "
";
// Now we want to manually truncate the title if it's longer than 50 characters. This is a great candidate for inclusion as a modifiable attribute, or as a settings field. Otherwise, we could do this via CSS or JavaScript, with either being able to easily truncate depending on the number of lines output.
$maximum_title_length = 50;
// If the title length is longer than the maximum length, we truncate it from characters 0 to $maximum_title_length and add three ellipses to the end, otherwise we just use the given title.
$short_title = strlen( $post->post_title ) > $maximum_title_length ? substr( $post->post_title, 0, $maximum_title_length ) . "..." : $post->post_title;
// Enter the title and close its tag.
$posts .= $short_title . "
";
// Close the content container tag
$posts .= "";
// Close the anchor tag
$posts .= "