Forum Replies Created

  • I thought I would share an update on my problem.
    It actually turned out that the Jetpack Photon CDN worked with my original code. However, it broke the responsive image update in WP4.4 – only delivering the original size image.

    I haven’t been able to figure out a way to fix this but looking at the code on my start page (not using the ACF-plugin) it returns the image with a resize “value” and on the pages using ACF it returns with a fit “value”. Don’t know if this has anything to do with it but someone else might have an idea?

    Start page:

    ACF page:

  • <?php echo apply_filters( 'jetpack_photon_url',wp_get_attachment_image(get_field('hero_image_3'), 'full', 0, array('class' => 'bilder2'))); ?>

    This code shows the site correctly but I’m not sure Photon actually is working? (PageSpeed gives me the same result as the original code)

  • Hi!

    Could someone help me out with getting photon working for me. My code for ACF images looks like this:

    <div id="section-2" class="wrapper">
    <div class="wrapper2">
    <?php echo wp_get_attachment_image(get_field('hero_image_2'), 'full', 0, array('class' => 'bilder2')); ?>

    I understand that I need to add
    apply_filters( 'jetpack_photon_url')
    but I’m not really sure how.

    Much appreciate some help!

  • Thank you for replying NatHobson!

    I’m not really sure I understand exactly how the lazysizes-plugin works/will help me but I trust you do 😉 Will it handle the sizes attribute for me?
    Right now I’m using this wordpress plugin for lazy load that I found works for custom fields which I then guess I won’t need anymore?

    Right now the code I use to load the image field looks as follows:
    <?php echo wp_get_attachment_image(get_field('hero_image_3'), 'full', 0, array('class' => 'bilder2')); ?>

    I can’t figure out how to implement the code you provided in order for it to work on my website. The ID parameter is not in the code I use right now. Am I right thinking this is the issue?

  • Okay! I feel like a fool 🙂 That explains why me playing around with sizes in the Developer Tool didn’t change a thing.

    Right now this is the values that I have for sizes
    sizes="(max-width: 1920px) 100vw, 1920px"

    I’m still trying to get my head around how the “break points?” actually work but I guess this is the reason why it’s either the 800×533 or the full size (1920) image that is being loaded?
    Where in my code would I be able to customize this? The image size is always 75% so if I understand it correctly that should be my value for sizes?

    Much appreciate all of the help!

  • Thank you for the feedback NatHobson. Something (cant’t remember what) was broken on that page. I haven’t implemented your code but the distortion is no longer there.

    However, I’m still struggling to get a smaller size image to load. I have been playing around with the sizes-property but I’m starting to doubt that’s actually the issue here. I can see that the different image sizes is “loaded” under img scrset but the browser doesn’t seem to be able to access them.
    What am I missing?

  • Thank you so much! That took me somewhere!

    However the resizing of the images doesn’t seem to work properly. The images seem to be stuck at a low resolution. Have I missed something?

  • Hi,

    This looks like it is exactly what I’m trying to do but I can’t seem to get it to work. I’m not a very experienced code writer. Sorry for that 🙂

    I have added timstl’s function-code to my function.php and then in my template added:

    <div class="wrapper">
    	<div class="wrapper2">
    	<img class="bilder2" src="<?php echo wp_get_attachment_image(get_sub_field('hero_image'), 'full'); ?>					    						</div>

    Also I have changed the field to return image ID. But it doesn’t seem to work for me.
    Anyone who could point me in the right direction?

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