Wrapper Link

Wrapper Link makes a group of child elements one clickable destination. Use it for a card containing an image, heading, and supporting text.

Add and configure Wrapper Link

1. Click Add, choose Wrapper Link, and place it in the container.
2. Set Content > Content > Link to the card's destination.
3. Add the card content as children of Wrapper Link.
4. Configure Design > Layout, Background, Container, and Spacing.
5. Save your changes.

Controls

Responsive varies by breakpoint; Hover has a hover value; Shared applies across both. Linked controls have their own reference. In conditions, = means “is” and ≠ means “is not.”

Content > Content

Setting	Purpose and options	Behavior
Link	Destination and link options.	Shared

Important TipElements that contain links should not be placed inside a Wrapper Link element.Doing so will create invalid HTML and could cause unexpected behavior.

Design > Layout

Setting	Purpose and options	Behavior
Layout	layout controls. When: Layout is set.	See linked controls

Design > Layout

Setting	Purpose and options	Behavior
Layout	layout controls. When: Layout is unset.	See linked controls

Design > Background

Setting	Purpose and options	Behavior
Color	Color or supported fill.	Hover
Type	Image, Gradient.	Shared

Shown when Type = Image.

Setting	Purpose and options	Behavior
Image	WordPress media.	Responsive, Hover
Image Size	Registered WordPress or custom image size.	Responsive, Hover
Lazy Load	On/off.	Shared
Image Settings > Size	cover, contain, auto, custom.	Responsive

Setting	Purpose and options	Behavior
Image Settings > Width	Width. When: Type = Image and Size = custom.	Responsive, Hover
Image Settings > Height	Height. When: Type = Image and Size = custom.	Responsive, Hover
Image Settings > Repeat	repeat, no-repeat, repeat-x, repeat-y. When: Type = Image.	Responsive
Image Settings > Position	center top, center center, center bottom, left top, left center, left bottom, right top, right center, right bottom, custom. When: Type = Image.	Responsive
Image Settings > Custom Position	Set custom position. When: Type = Image and Position = custom.	Responsive
Image Settings > Attachment	scroll, fixed. When: Type = Image.	Responsive
Image Settings > Unset Image At	Breakpoint. When: Type = Image.	Shared

Shown when Type = Gradient.

Setting	Purpose and options	Behavior
Gradient	Color or supported fill.	Shared
Gradient Animation > Scale	Scale and unit.	Shared
Gradient Animation > Speed	Speed and unit.	Shared

Setting	Purpose and options	Behavior
Overlay > Color	Color or supported fill.	Hover
Overlay > Type	Image, Gradient.	Shared

Shown when Type = Image.

Setting	Purpose and options	Behavior
Overlay > Image	WordPress media.	Responsive, Hover
Overlay > Image Size	Registered WordPress or custom image size.	Responsive, Hover
Overlay > Lazy Load	On/off.	Shared
Overlay > Image Settings > Size	cover, contain, auto, custom.	Responsive

Setting	Purpose and options	Behavior
Overlay > Image Settings > Width	Width. When: Type = Image and Size = custom.	Responsive, Hover
Overlay > Image Settings > Height	Height. When: Type = Image and Size = custom.	Responsive, Hover
Overlay > Image Settings > Repeat	repeat, no-repeat, repeat-x, repeat-y. When: Type = Image.	Responsive
Overlay > Image Settings > Position	center top, center center, center bottom, left top, left center, left bottom, right top, right center, right bottom, custom. When: Type = Image.	Responsive
Overlay > Image Settings > Custom Position	Set custom position. When: Type = Image and Position = custom.	Responsive
Overlay > Image Settings > Attachment	scroll, fixed. When: Type = Image.	Responsive
Overlay > Image Settings > Unset Image At	Breakpoint. When: Type = Image.	Shared

Shown when Type = Gradient.

Setting	Purpose and options	Behavior
Overlay > Gradient	Color or supported fill.	Shared
Overlay > Gradient Animation > Scale	Scale and unit.	Shared
Overlay > Gradient Animation > Speed	Speed and unit.	Shared

Setting	Purpose and options	Behavior
Overlay > Opacity	Set opacity. Range: 0–1.	Hover
Overlay > Effects > Filter > Filter Items	Add, edit, remove, and reorder filter items.	Hover
Overlay > Effects > Filter > Filter Items > Type	blur, brightness, contrast, grayscale, hue-rotate, invert, saturate, sepia.	Shared
Overlay > Effects > Filter > Filter Items > Blur Amount	Blur amount and unit. When: Type = blur.	Shared
Overlay > Effects > Filter > Filter Items > Amount	Amount and unit. When: Type = brightness, contrast, grayscale, invert, saturate, sepia.	Shared
Overlay > Effects > Filter > Filter Items > Rotate	Rotate and unit. When: Type = hue-rotate.	Shared
Overlay > Effects > Blend Mode	normal, multiply, screen, overlay, darken, lighten, color-dodge, color-burn, hard-light, soft-light, difference, exclusion, hue, saturation, color, luminosity.	Shared
Transition Duration	Transition duration.	Shared

Design > Container

Setting	Purpose and options	Behavior
Width	Width.	Responsive
Min Height	Min height and unit.	Responsive
Borders	borders controls.	See linked controls
Hover > Background	Color or supported fill.	Shared
Hover > Border Color	Color or supported fill.	Shared
Hover > Shadow	Shadow offset, blur, spread, color.	Shared
Hover > Transition Duration	Transition duration.	Shared
Padding	spacing controls.	See linked controls

Design > Text Colors

Shown when Text Colors is set.

Setting	Purpose and options	Behavior
Headings	Color or supported fill.	Hover
Text	Visible text.	Hover
Brand	Color or supported fill.	Hover

Design > Spacing

Setting	Purpose and options	Behavior
Spacing	spacing controls.	See linked controls

Troubleshooting