Upload and crop image and add text from frontend in wordpress
My client needs for his visitors to be able to upload, zoom and crop an image, add text over the cropped image and choose a position of the text.
Something like example on this image: http://devadesign.biz/example.jpg
After clicking on submit button the cropped image, with text on it, has to be saved in a specific folder.
Is there any plugin or tutorial for something like that?
I've already tried some plugins and scripts like those:
https://artisansweb.net/upload-crop-resize-image-using-jquery-php/
https://www.sanwebe.com/2012/05/ajax-image-upload-and-resize-with-jquery-and-php
https://www.sitepoint.com/crop-and-resize-images-with-imagemagick/
http://www.croppic.net/
https://foliotek.github.io/Croppie/
...but none of them supports adding text.
Thank you!
You can do that in Imagemagick. Here is an example:
Input:
line 1: read input and put into memory and delete input
line 2: add contast to memory input
line 3-5: add white to memory input
line 6-7: create a white image with a black rectangle in the middle as a mask
line 8: composite the two modified input images using the mask
line 9: set up the fill and stroke for creating a black outline around the middle
line 10: draw the black polygon rectangle
line 11: set up the pointsize and colors for the text
line 12: draw the text with annotate
line 13: save the output
convert lena.jpg -write mpr:img +delete \
\( mpr:img -level 10x100% \) \
\( mpr:img -alpha set \
-channel a -evaluate set 80% +channel \
-background white -flatten \) \
\( -clone 0 -fill white -colorize 100 \
-fill black -draw "rectangle 64,64 192,192" -alpha off \) \
-compose over -composite \
-fill none -stroke black \
-draw "polygon 64,64 192,64 192,192 64,192" -alpha off \
-gravity center -pointsize 24 -fill white -stroke white \
-annotate +0+0 "TESTING" \
result.png
For drawing options see https://imagemagick.org/Usage/draw
Wordpress has an Imagemagick plugin. See https://wordpress.org/plugins/tags/imagemagick/