Clip Path - Adding a clipping path to shape an image
A clipping path will alter the appearance of the child image by clipping the image to the coodinates specified in the path.
Examples of images with clipping paths applied.
Online path generators
Clippy is a good online resource to get a preset style, or create your own. You can copy the required css code from the bottom of the page.
Example Clip Path (Hexagon)
This could be copy-pasted into the field to clip to a pentagon shape. To get a standard pentagon shape ensure the images are set to crop to square.
polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%)
Where to add the clip path
You can add a clip path via the Image Properties popup when hovering over an image.
Example of the clip path location in the Crop Image popup.
More From This Section
The Smaller Animals thumbnailer is great tool if you want to create smaller image file sizes before uploading lots of photos, or if you want to watermark your photos.
It is easy to create a popup of higher resolution images. Learn how
With the Drag-drop and Contentbox editors you can add a clipping path to an image
In the Drag-drop and Contentbox editors, you can set an image to blend with its background colour via the STYLE EDITOR modal.
This is the old method of adding rotating images to your website
You can add pins over the top of the image with a link and small description on hover.
You can add image dimensons (image height and image width) to your images via the Style Editor Popup
FAQ Topics
Building your site
Advanced Page Types
E-Commerce
- Shopping Basics
- Category Management
- Products
- Product Options
- Layout and Formatting
- Payment Options
- Processing Orders
- Advanced Ecommerce
- Product Pricing, Currencies
- Plugins
- Wholesale
- Rental, Booking and Appointment Systems
- Freight - Couriers
- Stock & Quantities
- Vouchers, Discounts, Loyalty Points
- Selling Photos / Prints
- Shopping Cart Add-on Page types
- Advanced APIs / Add ons
- Point of Sale (POS)
- Reports
- Orders / Invoices
Email & Membership
- Member Management
- Members Pages / Template Customisations
- From Addresses and Reply To Email Notifications
- Global Enquiry form options
- Standard Field Names
- Webmail
- Bulk Email
- CRM Features
- Email Campaigns
- Forums & Blogs
- Pop3/Imap Email Services
- Scams and Hoaxes
- Lead Magnets / Growing Your Customer Database
- Form Spam Filtering
