afsdigital

Thank you for being so prompt! I’m not sure why this isn’t working for me. Here is a snippet of my CSS and code for function.php. But it’s not affecting the custom layout. Any thoughts?

/* This targets the title link inside our custom layout */
.ymc-smart-filter-container-834 .yacht-card h3.title a {
font-size: 28px;
font-family: 'Tenor Sans', sans-serif;
font-weight: 700;
color: #111;
text-decoration: none;
line-height: 1.2;
}

/**
 * Creates the custom HTML layout for a single yacht card in the results grid.
 */
function gsy_custom_yacht_card_layout( $html, $post ) {
    $post_id    = $post->ID;
    $permalink  = get_permalink($post_id);
    $title      = get_the_title($post_id);
    $excerpt    = get_the_excerpt($post_id);
    $image      = has_post_thumbnail($post_id) ? get_the_post_thumbnail($post_id, 'medium_large') : '<img src="' . esc_url('https://via.placeholder.com/400x300.png?text=No+Image') . '" alt="Placeholder">';
    $price      = get_field('price', $post_id);
    $year       = get_field('year_built', $post_id);
    $location   = get_field('location', $post_id);
    $status_key = get_field('status', $post_id);

    ob_start(); ?>
    <article class="yacht-card">
        <div class="yacht-card-image">
            <a href="<?php echo esc_url($permalink); ?>"><?php echo $image; ?></a>
        </div>
        <div class="yacht-card-content">
            <?php // The only change is adding class="title" to the h3 tag ?>
            <h3 class="title"><a href="<?php echo esc_url($permalink); ?>"><?php echo esc_html($title); ?></a></h3>
            
            <?php if (!empty($excerpt)) : ?><p class="excerpt"><?php echo esc_html($excerpt); ?></p><?php endif; ?>
            
            <ul class="yacht-card-details">
                <?php if (!empty($price)) : ?><li><strong>Price:</strong> <?php echo esc_html($price); ?></li><?php endif; ?>
                <?php if (!empty($year)) : ?><li><strong>Year:</strong> <?php echo esc_html($year); ?></li><?php endif; ?>
                <?php if (!empty($location)) : ?><li><strong>Location:</strong> <?php echo esc_html($location); ?></li><?php endif; ?>
            </ul>
            
            <?php if ($status_key === 'available') : ?>
                <div class="yacht-card-status"><a href="<?php echo esc_url($permalink); ?>">View Detail</a></div>
            <?php endif; ?>
        </div>
    </article>
    <?php return ob_get_clean();
}
add_filter( 'ymc_post_custom_layout_834_1', 'gsy_custom_yacht_card_layout', 10, 2 );
add_filter( 'ymc_post_custom_layout_852_1', 'gsy_custom_yacht_card_layout', 10, 2 );

The code within the page (using Insepector) however, is this:

.ymc-smart-filter-container .container-posts .post-custom-layout .post-item a, .ymc-extra-filter .container-posts .post-custom-layout .post-item a, .ymc-extra-search .container-posts .post-custom-layout .post-item a, .ymc-extra-sort .container-posts .post-custom-layout .post-item a {
    display: block;
    font-size: 12px;
    color: #098ab8;
    text-decoration: underline;
    margin-top: 5px;
}

• This reply was modified 10 months, 2 weeks ago by afsdigital.