Charlie Cooper

Can confirm I had the same issue with a different theme and that 3.1.1 update fixed it

• This reply was modified 1 year, 11 months ago by Charlie Cooper.

CLS was 0.308 before and without it it’s 0.017

That’s a good shout – they’re rendering tiny so they may as well be. I’ll give that a go.

Thanks

Yes, this is what I did – sorry I should have been more clear. Try again now – the CLS issue seems to go when I remove YARPP.

Thanks for your quick response.

That’s what I was thinking – there’s no JS in the template it’s just PHP.

Take a look here: https://www.epianos.co.uk/tv/yamaha-clp725-vs-clp735-piano-comparison-and-buying-advice/

Template is as follows:

<?php 
/*
YARPP Template: Simple
Author: Charlie Cooper
Description: Custom EPTV Template
*/

 if (have_posts()):?>
    
	 <h2 class="feattitle">Related Videos</h2>
	<?php while (have_posts()) : the_post(); ?>
	
<?php
$id = get_the_id();
$perm   = get_permalink($id);
$imgurl = get_the_post_thumbnail_url($id, 'full');
$title = get_the_title($id);

// if video link exists...
if (get_field('video_link',$id)){
    // grab it
    $x = get_field('video_link',$id);
    // remove everything before 'v=' so we just have the video ID
    $videoid = substr($x, strpos("$x", "v=") + 2);
    // Remove stuff after it
    $videoid = str_replace("&feature=emb_logo", '', $videoid);
    }

// if duration exists get it
if (get_field('duration',$id)){
    $duration = get_field('duration',$id);
    }

$starring = get_field('cast', $id);

if (stripos($starring, 'chris') !== false){
    $starringimg = 'https://www.epianos.co.uk/wp-content/uploads/2021/01/chris.png';
} else if (stripos($starring, 'david') !== false){
    $starringimg = 'https://www.epianos.co.uk/wp-content/uploads/2021/01/c09f3369-2aca-44df-bdce-e61e0565f2f5.png';
} else {
    $starringimg = 'https://www.epianos.co.uk/wp-content/uploads/2019/09/Favicon.png';
} ?>

<a class="posterlink" href="<?php echo $perm ?>/?referral=EPTVrelated">
    <div class="videoposter">
        <img class="posterimg" width="285" height="160" src="https://img.youtube.com/vi/<?php echo $videoid ?>/mqdefault.jpg">
        <span class="videoduration"><?php echo $duration ?></span>
    </div>
    <div class="video-info">
        <img class="video-starring" src="<?php echo $starringimg ?>">
        <div class="info-right">
            <span class="videotitle"><?php echo get_the_title() ?></span>
            <div class="video-creator" style="font-weight:500;">ePianos <i class="fas fa-check-circle"></i></div>
        </div>
    </div>
</a>

<?php endwhile; ?>
<?php else: ?>
<?php endif; ?>

Thanks for your response. That’s not far from what I did! We spotted a div that changes and wrote this to recalculate. Note the timeout of 0.5 secs allows the page to update.

jQuery(function($){
	
	$( ".variations_form" ).on( "woocommerce_variation_select_change", function () {
		setTimeout(function (){
		if ( $( ".in-stock" ).length ) {
        $('div.getit').show('fast');
        } else {
        $('div.getit').hide('fast');
		}
		}, 500);
        }
	)});

Thanks so much – worked a treat. We’ve bought the full version ??