How can I allow customers to crop a custom dimension?
Note: this feature is currently in BETA, if you want to try it out, you have to request it via the support button in the app.
If you want to let customers crop a custom dimension that they can enter using a dimension input, follow the steps below.
Dimension option
Create an option of type Dimension to let the customer enter their custom dimension:
It's recommended to configure a initial value for X and Y. In the example below we've setup the values as 5/5 which is a ratio of 1, resulting in the initial crop box being set to a square:
Next, there are two different ways to allow custom crop dimensions:
Upload option
Using the standard upload option:
On the Advanced tab, Connect the Upload option with the previously configured Dimension option:
IMPORTANT: this setup requires setting up the live preview with Live Crop setting enabled as described in our guide here: Live Crop
The entered dimensions will be used to update the defined crop box on the Upload layer on the live preview: (The app scales up the entered dimension to the max possible dimensions while keeping the ratio)
When the setup is completed, open the product on your store and try entering a new dimension, the app should then automatically open the crop mode to adjust the crop box according to the entered ratio: View Demo
Upload-Lift option
If you are using the Upload-Lift app for advanced file uploads, you can also connect it to a dimension option to dynamically update the crop ratio of the editor:
On the Advanced tab, Connect the Upload option with the previously configured Dimension option:
On the Upload-Lift app, make sure to enable the Show image editor setting. The app will then dynamically update the image crop ratio based on the entered dimension:
Note: it is also possible to use the Upload-Lift option in combination with the Live crop setup, in this case you would disable the Image editor setting.
When the setup is completed, open the product on your store and try entering a new dimension, if the ratio of the dimension does not match the currently uploaded file, the crop button will be made visible below the upload option: View Demo
Note: If the customer does not crop the image manually, the add to cart validation will automatically open the image editor.