2

I am trying to load an image transform and continually get a 404 which references an issue with the UserSessionService. I have a attached a screen shot as well as twig template for one of the transform.

{% set contributor = entry.contributorProfile.first() %}
{% set headshot = contributor.headshot.first() %}

{% set thumb = {
    mode: 'crop',
    width: 200,
    height: 200,
    quality: 80,
    position: headshot.focusPctX ~ '% ' ~ headshot.focusPctY ~ '%'
} %}

<aside class="contributor-excerpt">
    <img src="{{headshot.getUrl(thumb)}}" alt="">
</aside> 

enter image description here

2

You can't use FocusPoint like that with the default Craft Transforms, which might be your problem. You'll need to use Imager to get the position as a percentage supported.

Something like:

{% set image   = entry.listingImage.first() %}
{% set max479  = craft.imager.transformImage(image, {width: 480, height: 200, mode: 'crop', jpegQuality: 70, position: image.focusPctX ~ '% ' ~ image.focusPctY ~ '%'   }) %}
{% set min480  = craft.imager.transformImage(image, {width: 700, height: 250, mode: 'crop', jpegQuality: 70, position: image.focusPctX ~ '% ' ~ image.focusPctY ~ '%'   }) %}
{% set min700  = craft.imager.transformImage(image, {width: 960, height: 250, mode: 'crop', jpegQuality: 70, position: image.focusPctX ~ '% ' ~ image.focusPctY ~ '%'   }) %}
{% set min960  = craft.imager.transformImage(image, {width: 1280, height: 250, mode: 'crop', jpegQuality: 70, position: image.focusPctX ~ '% ' ~ image.focusPctY ~ '%'  }) %}
{% set min1280 = craft.imager.transformImage(image, {width: 1500, height: 250, mode: 'crop', jpegQuality: 70, position: image.focusPctX ~ '% ' ~ image.focusPctY ~ '%'  }) %}

{# standard Imager image transforms #}
<picture>
    <source media="(max-width: 479px)" srcset="{{ max479.url }}">
    <source media="(min-width: 1280px)" srcset="{{ min1280.url }}">
    <source media="(min-width: 960px)" srcset="{{ min960.url }}">
    <source media="(min-width: 700px)" srcset="{{ min700.url }}">
    <source media="(min-width: 480px)" srcset="{{ min480.url }}">
    <img src="{{ min1280.url }}" alt="" />
</picture>
1
  • Removing the position key in the thumb allowed it to work, Will look into Imager for future use, thanks!
    – mcclaskiem
    Dec 19 '16 at 17:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.