Help Changing Image Sizes for Photos Uploaded to the Blog Add On

    I'm using the perch blog add on, and when I go to upload an image file, it seems to create 4 sizes of images/thumbnails on the server:


    A file called 01.jpg creates the following files:


    Code
    1. /public_html/perch/resources/01-thumb@2x.jpg
    2. /public_html/perch/resources/01-w50h50.jpg
    3. /public_html/perch/resources/01-w320h240.jpg
    4. /public_html/perch/resources/01.jpg


    I would like to add another size there. I have tried this on a template that displays the blog to the front end:


    Code
    1. <perch:if exists="image">
    2. <img src="<perch:blog id="image" type="image" width="400" height="267" />" alt="<perch:blog id="postTitle" />" /></perch:if>


    But it's not working. I also am somewhat confused on whether this is even the right place since this is a "display" template. But this is all I seem to be able to find. I got the idea from this page: https://docs.grabaperch.com/pe…mage-generate-many-sizes/


    And, I re-uploaded the images each time I tested by going into a post and adding a new image.

    I am noting that my tag is in the perch:blog world, whereas the example here is perch:content. Can you do this with blog posts?


    Let me know what I'm missing here.

  • drewm

    Approved the thread.

    The post.html file is the file that is being used when creating the blog post. In this file you can specify which and how many resolutions you would like to generate from an image. Here is a snippet of my code, which generates multiple resolutions of the same image:


    Code
    1. <perch:blog id="image" type="image" width="1980" height="1020" crop="true" label="Afbeelding" bucket="blog" />
    2. <perch:blog id="image" type="image" width="730" height="487" crop="true" suppress="true" bucket="blog" />
    3. <perch:blog id="image" type="image" width="327" height="500" crop="true" suppress="true" bucket="blog" />
    4. <perch:blog id="image" type="image" width="327" height="280" crop="true" suppress="true" bucket="blog" />


    Just make sure all ID's are the same for every resolution and Perch will do the rest for you.


    Now you can use one or multiple of those in your display template.