Turn your images into captivating ones with just a few clicks
Add CSS effects to your image
Using CSS Gram, you can quickly apply some nice effects to your image.
There are twenty-six styles to choose from.
A built-in preview popover displays for each style.
Add some padding and a border
Adjust the padding, margin, and border with responsive support.
You can adjust padding, margin, and border for all major breakpoints.
Custom components make adjusting the dimensions as intuitive as possible.
Add a drop shadow to your images
Full drop shadow support is available and works great with overlayed captions.
Intuitive drop shadow controls allow for a real-time preview of the image.
Adjust the color, opacity, blur, and spread for some nice effects.
Set a rounded effect with intuitive cropping
Using border-radius and sizing controls, you can make the image look how you like.
Crop and set a border radius to make the image look rounded.
Set an image width and height, and adjust the object positioning.
With captions, let your imagination run wild
Set an overlay caption for a neat hover effect
Once you add a caption, you can position it on the top, bottom, or in an overlay.
Overlay captions are great for hover-only effects.
You can choose to show the overlay only when hovering.
The overlay color and opacity can be adjusted for hover and non-hover events.
Switch to multi-mode for advanced captions
Add any available block and make it part of your caption. Smart styles are available for common blocks such as paragraphs and headings.
Add any block to a caption.
Create an entirely custom caption and even overlay it.
Smart styles are available to style common child blocks.
Global styles turn effort into effortless
You can save lots of time with Global Styles
Global styles allow you to configure the block’s settings, and save them later for re-use on any additional photo blocks.
Save as many global styles as you desire for quick re-use.
Edit, delete, and override any global style.
Users can select from any available global styles.
Here are the major features of Photo Block
Intuitive uploader
There are several ways to add an image, including downloading via URL.
Cropping with Custom Ratios
Crop an image with ease and even choose your own crop ratio for better control.
Dimension and Responsive Support
Each dimension such as padding and margin is fully responsive and customizable.
Image Sizing and Object Fit
Set advanced image sizing and position your image wherever you like.
Multiline Captions
Set captions to single or multi-line for a completely customizable caption.
Overlay Captions
Set captions to overlay and set up hover effects for eye-popping captions.
Caption Positioning
Set a caption at the top of the image, below the image, or over the image.
Global Styles
Save any block configuration as a global style and re-use them across your images.
Query Loop Support
The block works in the Query Loop block and serves as a featured image source.
Frequently Asked Questions
What is Photo Block?
Photo Block is an image block reimagined, combining most of the useful features of other image blocks into one elegant package.
With Photo Block, you’ll find intuitive uploading and cropping. You’ll also find built-in image effects, drop shadow support, and much, much more.
Once you’ve configured a photo how you like it, you can save its configuration as a Global Style, allowing you to re-use the style on additional photos.
Why use this block over the standard Image block?
Three things separate this block from others, including the regular image block that comes with WordPress:
- Dimension and responsive support. Photo Block supports responsive breakpoints and each aspect of it is responsive, down to the typography settings.
- Full caption support. Captions are a fully thought-out feature and include positioning, overlays, and multi-line captions.
- Global styles. Global styles can be saved on any photo block, and you can re-use these styles throughout other photo blocks, making for intuitive and quick style changes. Global styles will save you a ton of time in the long-run.
How customizable are captions?
Very. With Photo Block, captions are encouraged.
Captions can be positioned at the top of the photo, below the photo, or overlaying the photo.
Captions can be single or multi-line and are their own fully customizable block.
You can adjust the typography of the caption, text color, background color, and sizing of each caption.
If a caption is part of a photo with a global style, the caption settings are also saved and applied.
Does Photo Block support global styles?
You can save, edit, and reuse global styles across multiple Photo Blocks to maintain consistency. Please note that only editor roles and above can save global styles.
Is Photo Block responsive?
Yes, there is dimension support for both the photo and caption. This includes:
- padding
- margin
- border
- border-radius
- width
- min-width
- max-width
- height
- min-height
- max-height
Additional responsive options include typography.
Does Photo Block support data?
Photo Block works in the Query Loop block as a featured image. Additional data features will likely be added later as a premium add-on.