Select Page
Learn how to effortlessly crop an image into a circle with Divi, directly on your website. No coding required! @hellosammunoz www.makingwebsitemagic.com

How to Crop an Image into a Circle with Divi

Cropping an image into a perfect circle might seem like something you need to do BEFORE you upload it to your website. However, using the power of Divi (have we mentioned yet that we LOVE Divi?!) you can crop an image into a perfect circle directly from the website.

The best part is that you don’t sacrifice a shred of image quality by cropping ahead of time AND it’s really easy. So if circles are a part of you or your client’s brand identity, you’ll want to watch this one or read the steps.

We know everyone learns differently – if you prefer video, please watch the video tutorial below! If you’re more of a step-by-step person, we’ve written out the steps under the video.

Watch the Tutorial:

How to crop an Image into a Circle with Divi – Step by Step:

  1. Log into the website, go to the page you’re working on. In this example, we’re going to edit the Contact Page on The Piper Effortless Website Kit.
  2. Enable the Visual Builder.
  3. Add an image module.
  4. Select the image, and be sure it’s cropped as a true square with equal height and width dimensions. This will allow your image to display as a perfect circle later on.
  5. Go to the design tab and select Border.
  6. Change the border-radius to 100%.
  7. That’s it! Go ahead and save your changes.

Don’t Yet Have the Divi Theme?

We absolutely LOVE building with Divi. Not only is it an extremely flexible page-building Wordpress theme, but it is also very user-friendly for our clients. One of the best things about Divi is it is a powerful tool for both web designers AND developers alike. 

Whether you're more of a visual, front end person or you like to dig into the code and create dynamic websites - Divi is flexible enough for any project.

(Note this is our company affiliate link & should you choose to purchase through our link we will earn a commission. Thank you, you will adore Divi!!)

Get Started with Divi Now →
Article by

Karyn Paige

Karyn is a web developer at Sam Munoz Consulting, LLC. She's also a mentor at the Making Website Magic School of Business, working with women web designers to create values-driven businesses that are aligned with their personal visions.

Keep Learning & Reading