Support

Account

Forum Replies Created

  • In the end I have gone with option 1 – tedious but effective

  • Hi John

    Ah I see – I completely mis-understood

    Thanks
    Sheree

  • EDIT –

    It actually is working sorry! It wasn’t displaying for an entirely different reason

    Apologies

    *** original question ***

    Hi John

    I know this solution is really old but is it still valid?

    I am trying to get it to work with a slider using a repeater field from an ACF options page like below but it returns nothing?

    I cant see what I am doing wrong

    <section class="latest-publications">
    
    	<h2>Latest Publications</h2>
    	
    	<div class="pink-divider"></div>
    	<div class="publications-row">
    			
    			<div class="posts-carousel">
    		
    					<?php if (have_rows('publication', 'option' )) {
    					  $count = 1;
    					  while (have_rows('publication', 'option')) {
    						the_row();
    						?>
    						
    						
    								
    						<div class='publication-slide'>
    							
    							
    							<a href="/publications#<?php echo sanitize_title( get_sub_field( 'publication_title' )); ?>" target="_blank"><?php the_sub_field( 'publication_title' ); ?></a></h4>
    							<?php the_sub_field( 'publication_description' ); ?>
    							<p class="icon-date"><?php the_sub_field( 'date' ); ?></p>
    		
    						
    						</div>
    						
    	
    						
    						<?php $count++;
    						if ($count > 3) {
    						  break;
    						}
    					  }
    					}
    				
    				
    				?>
    				
    
    			</div>		
    			
    	</div>		
    </section> 
  • Yeah maybe, though the doesn’t explain why it differs when using the thumbnail size. Very strange!

  • Hi john,

    When you inspect it, if you hover over each URL a wee dialogue box shows the details of the image including the natural (intrinsic) size if the image.

    I have changed the bottom one to ‘Thumbail’ for the size to demonstrate. You will see that now when you hover over the URL it shows the intrinsic size as 150 x 150 because that is the size of the ….150×150.jpg image it’s using

    But if you look at the sizes on the upper image which is set to medium, it always shows the dimensions for the largest image, almost as if it’s not actually using the smaller one. It does the same for my custom image sizes and I can’t work out why.

  • Hi John

    Thanks so much for that code, I added it today and it’s fetching the title which is brilliant.

    I am still struggling with the srcset images though.

    If you look here (it’s a tiny url to bypass the coming soon page and to stop the domain coming up in search results)

    tinyurl.com/8kvx77u8

    You’ll see the 2 identical images of food stacked on top of eachother. When you inspect them, the size is listed as 741 x 1000 which is correct BUT when you look at the src image, even though the file name has -741×1000.jpg at the end of it, the intrinsic size is actually the full size? It’s the same for every image listed in the srcset?

    it does this if I have it set to medium or home_portrait but not if I switch it to thumbnail

    I’m sorry if the answer to this is in the comments you have already made but I jusy don’t get why? If I copy one of the URLS and paste it in a new window, the dimensions of the image appear to be correct so I don’t get why the intrinsic size seems to be listed wrong?

    Am I missing something here?

  • Hi John,

    My image dimensions aren’t 1000×1000, it’s actually just a portrait image but I wanted it to display with a max height of 1000px and I figured the width could then never exceed that given it’s taller than it is wider so I just did a max width of the same. I have read somewhere that you can do 1000 x 9999 aswell?

    I just wanted a max height of 1000px and I don’t care what the width is because I am using object fit:cover anyway.

    If I add more sizes that all use 9999 as the width, will they be considered the same ratio and show up?

    If not, because I am using object fill for all my images except in the gallery, I suppose I could just make them all an equal ratio that was good enough anyway, close to 1:1 but maybe something a little more in line with Landscape or portrait.

    Sorry, I appreciate your patience.

  • Hi John,

    Sorry for my confusing posts!

    I will have to try this in the morning, but to start, I made my custom image 1000px by 1000px. Even though this is a different ratio from the original size, this seems to work now?

    I thought it would just choose which hit 1000px first (the width or the height) and the other would be proportionate. For example, one of my ACF fields uses my custom image size and now outputs this which seems to be doing as I described

    img width=”741″ height=”1000″ src=”https://www.website.com/wp-content/uploads/2021/08/website-image-741×1000.jpg&#8221; alt=”Image of dish” followed by all the other sizes

    I need to make the other images sizes more custom, they are all theme defaults except the home_portriat one of 1000px by 1000px. Is this not correct?

    I have found the whole responsive images side of ACF incredibly confusing. I understand srcset and retina image when defining set images in html but I can’t get my head around how to use them with ACF.

    I was expecting it to be something that looked a little more like media queries, a bit like

    $home_portrait[‘sizes’][‘medium’]

    @media (max-width:480px) {
    $home_portrait[‘sizes’][‘small’]
    }

    that kind of thing (I realise this code is just completely invented but it’s just to illustrate how I thought it would work)

    I also would have preferred more control because I am using object fit for images which complicates things a little.

  • I got this working in the end by changing my functions php to:

    // Make sure featured images are enabled
    add_theme_support( 'post-thumbnails' );
    
    // Add featured image sizes
    add_image_size( 'home_portrait', 1000, 1000, false ); // width, height, crop
    
    // Register the three useful image sizes for use in Add Media modal
    add_filter( 'image_size_names_choose', 'wpshout_custom_sizes' );
    function wpshout_custom_sizes( $sizes ) {
    	return array_merge( $sizes, array(
    		'home_portrait' => __( 'Home Portrait' ),
    
    	) );

    Though I am still unsure why the initial code did not work

  • After understand Srcset a bit more I see I don’t really need to do anything – the srcset attributes are generated automatically.

    However I still can’t understand why my custom image size is not working

  • Hi John

    I am very sorry, I did not see this reply until just now!

    I found a solution but not a great one, so I will try this.

    Sheree

  • After all that – I realised I had the field value set to label not value!

  • Solved – I had missed a closing bracket AND entered a value for the last if/else statement

  • Apologies the undefined function is not the error – it is a critical error that takes the site down

Viewing 14 posts - 1 through 14 (of 14 total)