Single Image
Add single images and make them stand out with multiple styling options.
How Single Image Works
Magezon Page Builder Single Image element allows adding single images from Media Library or external link.
Make a perfect match with the overall look and feel of your page with multiple custom options: 5 image styles, 3 hover effects, border style, width, color and radius.
Optimize images for SEO by adding title, description, alt text as well as resizing them. Especially, you can make your images auto adapt with different devices.
5 Image Styles
Choose from 5 different styles: Default, Outline, Shadow 1, Shadow 2 and 3D Shadow.
Default
Outline
Shadow1
Shadow2
3D Shadow
Resize Image
Resize original images to any wanted size based on your purposes.
Responsive Images
Single Image element gives you the possibility to adapt single images to any screen size. You can upload different images for different devices or have the image auto resized for each device, including: Desktop (>=1024px), Tablet (<1024px), Landscape Phone (<768px), Portrait Phone (<576px).
Upload Images for Each Device
Upload different images for different devices.
Auto Resize Images
Resize images automatically to adapt with the device you're using.
Image Title & Description
Single Image element allows adding image title and description with various custom options.
You can display image title and description in one out of 10 positions. Display them on hover or in full width as well as customize padding and alignment.
Freely choose font size, font weight, color and background color. In addition, it's possible to overlay images with color to make the title and description stand out.
Content with Overlay
Content with Overlay
Content with Overlay
Image Hover Effects
Add hover effects to image including: Zoom In, Zoom Out and Lift Up.
Border Control
Customize image border with style, width, color and radius.
On-click Effects
Fully control on-click effects to open images in lightbox, open video/map or add custom link to images.
Single Image Looks Great Alongside Text Content
You can insert single image element alongside text content: below, above, left, right or anywhere you want. It will definitely look awesome!
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac augue est, non porta lectus. Aenean scelerisque tellus sit amet sem fringilla sed pellentesque purus dapibus. Phasellus elementum pharetra justo, ac iaculis mauris consectetur sit amet. Proin venenatis semper nulla vitae molestie. Praesent pharetra erat lorem, dignissim auctor mi. Vivamus fringilla ultrices luctus.
Praesent rutrum felis a turpis luctus ut accumsan sem facilisis. Mauris at mi in nibh posuere molestie. Vivamus quis ante nec dolor fermentum sagittis. Ut aliquet eleifend nunc, eu pretium magna eleifend non. Nullam et orci eros.
Phasellus sodales pulvinar gravida. Aenean egestas accumsan porttitor. Sed ante odio, tincidunt ultrices congue sit amet, fringilla molestie nibh.
Phasellus elementum pharetra justo, ac iaculis mauris consectetur sit amet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac augue est, non porta lectus.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac augue est, non porta lectus. Aenean scelerisque tellus sit amet sem fringilla sed pellentesque purus dapibus. Phasellus elementum pharetra justo, ac iaculis mauris consectetur sit amet. Proin venenatis semper nulla vitae molestie. Praesent pharetra erat lorem, dignissim auctor mi. Vivamus fringilla ultrices luctus.
Praesent rutrum felis a turpis luctus ut accumsan sem facilisis. Mauris at mi in nibh posuere molestie. Vivamus quis ante nec dolor fermentum sagittis. Ut aliquet eleifend nunc, eu pretium magna eleifend non. Nullam et orci eros.
Phasellus sodales pulvinar gravida. Aenean egestas accumsan porttitor. Sed ante odio, tincidunt ultrices congue sit amet, fringilla molestie nibh.
Phasellus elementum pharetra justo, ac iaculis mauris consectetur sit amet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer ac augue est, non porta lectus.