Add an Image Cropper to your Carrd site

Integrating an image cropper on your Carrd site enables your visitors to fine-tune their uploaded images, allowing images to fit better with your content and saving you time editing user photos on the backend.

This guide helps you set up CropGuide to enhance the existing Carrd file upload field with image cropping functionality.

Installing CropGuide

To get started we first need to create a CropGuide account

Log in to CropGuide and add your domain to the control panel.

The control panel will generate a unique script for your domain similar to the one shown below:

<script defer src="https://cdn.crop.guide/loader/l.js?c=123ABC">
</script>

With your CropGuide account created let’s log in to the Carrd admin, select your site, and open the page editor on the page where you want to use CropGuide.

1. Click + Add Element

2. Click </> Embed to add a new Embed element.

3. Set Type to Code.

4. Copy the CropGuide script for your domain to the Code field.

5. Set the embed Style to Body End.

6. Click Done

That's it! CropGuide will now load and transform images when they're added to a file upload field on your Carrd page.

You can adjust the behavior of CropGuide in the control panel for your domain, or you can set custom instructions per field.

Please feel free to reach out to us if you any questions.

Learn more about CropGuide

Related content

• Crop A Photo To PAN Card Size On Carrd
• Crop A Photo To Cédula Size On Carrd
• Crop A Photo To Identity Card Size On Carrd
• Crop A Photo To Aadhaar Card Size On Carrd
• Crop A Photo To Passport Size On Carrd
• Crop Circle Profile Pictures on Carrd
• Convert HEIC to JPEG on Carrd Before Upload
• Optimise Carrd: Compress User Images Before Upload