We recently purchased the Fancy Product Designer plugin for a WordPress client who prints photos onto chocolate bars. Yum! Unfortunately the plugin is not as intuitive as a developer or user would want it to be. We need help!
For example, we have a Fancy Product of “Custom Photo Bar” where a user should be able to upload a photo via the filesystem, Facebook or Instagram. The final product needs to be an image that’s 3.5 inches x 3.5 inches, with a white border around the image the customer uploads, which translates to 1050 pixels x 1050 pixels, as in Figure A here:
To achieve this effect, we first set the size of the Product Designer Stage to 1050 pixels x 1050 pixels.
Next, we created the square frame view for our “Custom Photo Bar” Fancy Product, which is basically a thin, white border around the edge of the image.
Then we set this image as our initial element with “stay on top” checked, so when the customer uploads their image, the image is masked by the frame so that the frame prints in the exported image, as in Figure A above.
The problems occurred when we created an image that was 1050 pixels x 1050 pixels and tried to upload it. Since the product stage is set to 1050 pixels x 1050 pixels, we assumed that uploading an image of the same size would produce something like this:
Instead, when we upload our 1050×1050 image to the 1050×1050 Product Stage, we get this:
Apparently, something, somewhere, is resizing the image the customer uploads. Note that the scale for our view is set to 1.0 under the “General” tab of the Product Builder:
Yet, when we click on the image in the Export Viewer, we see that the scaling has been adjusted to .62, as shown in Figure B below:
The only thing in the Settings that might explain this is the option to resize when width is larger than height (or vice-versa):
However, we uploaded a square image of 1050×1050, so these settings should not apply, because they are conditional: they are to apply only when width is larger than height, or vice-versa. So perhaps these settings are applying even when the uploaded image is square? To test that assumption, we changed the “resize to” settings to 1050 pixels, and on the next upload things looked as expected in the Product Stage:
Happy with this, we added the product to the cart, checked out and logged onto the backend to retrieve the exported image. The Order Viewer gives us the following preview:
So far, so good, but things get confusing when we go to export the image. At this point, you would expect the exported image to be a PDF that’s 1050 pixels wide by 1050 pixels tall, looking exactly like what’s shown in the Order Viewer preview, since both the size of the Product Stage and the uploaded image are 1050×1050. However, looking below, we can see the PDF width and PDF height are both set to 278mm:
We don’t know where that figure comes from, it appears to be pre-loaded into the export field. 278mm x 278mm translates to approximately 11 inches by 11 inches, and when you export the PDF it adds margins along the left and bottom sides. The image is also resized to 3041 pixels by 3163 pixels:
None of this makes sense, we’ve read through all the relevant documentation and we’re exhausted all known settings. Can anybody out there point us in the right direction?
However, when you open it in Photoshop, the exported PDF comes out looking like this: