Content · Elementor
Magazine Grid & Slider widget for Elementor
A magazine layout: mixed tile sizes for featured and secondary posts, as a grid or slider.
Get King Addons
This page describes the PHP/JS for this widget — not a renamed stub. Install the free plugin from WordPress.org.
What it actually does
A magazine layout: mixed tile sizes for featured and secondary posts, as a grid or slider.
render() writes HTML data attributes: data-overlay-link, data-slick, data-slide-effect, data-src, data-url.
Content is loaded with WP_Query in PHP (not a hardcoded list in the editor).
Some inspector controls are marked Pro in PHP (eicon-pro-icon / king-addons-pro-control). Those need King Addons Pro, not Elementor Pro.
The widget script reads data attributes: data-action, data-ajax, data-direction, data-icon, data-nonce, data-overlay-link, data-post-id, data-slick.
How to add it in Elementor
- Install King Addons. Install Elementor and King Addons. Get King Addons from WordPress.org.
- Edit with Elementor. Open a page and click Edit with Elementor.
- Insert the widget. Search the panel for “Magazine Grid & Slider”. Typing “king” lists every King Addons widget.
- Set inspector controls from this widget’s PHP. Configure “Source”, “Selection”, “Order By”, “Order”. Style and Content tabs are listed on this page.
- Preview the published page. render() writes HTML data attributes: data-overlay-link, data-slick, data-slide-effect, data-src, data-url.
When to use it
- A news homepage.
- A magazine-style blog.
- A featured-story block.
Inspector controls from this widget’s PHP
| Control | What the code does |
|---|---|
| Query — Source | Selects the value used for WP_Query ignore_sticky_posts. |
| Query — Selection | Selects the value used for WP_Query posts_per_page. Options: Dynamic; Manual. |
| Query — Order By | The chosen value is read in render() and applied on the front end. Options: Date; Title (Pro); Last Modified (Pro); Post ID; Post Author; Comment Count. |
| Query — Order | The chosen value is read in render() and applied on the front end. Options: Ascending; Descending. |
| Query — Select Taxonomy | The chosen value is read in render() and applied on the front end. |
| Query — Authors | Ajax Select2: options load from a King Addons admin-ajax endpoint. |
| Query — Offset | WP_Query `posts_per_page` — how many posts are fetched (default 0, min 0). |
| Query — Not Found Text | Printed in the widget HTML from render(). |
| Query — Randomize Query (Pro) | Switcher inspector control (`query_randomize`). |
| Query — Exclude Items without Thumbnail | When this switch is on, render() outputs the wrapped markup. |
| Layout — Select Layout | The chosen value is read in render() and applied on the front end. Options: Layout 1 (3 posts) (Pro); Layout 2 (4 posts) (Pro); Layout 3 (5 posts) (Pro); Layout 4 (4 posts) (Pro); Layout 5 (5 posts) (Pro); Layout 5.0 (4 posts) (Pro); Layout 5.1 (3 posts); Layout 5.2 (5 posts)…. |
| Layout — Force Responsive One Column (Pro) | Switcher inspector control (`force_responsive_one_column`). |
| Layout — Open Links in New Tab (Pro) | Switcher inspector control (`open_links_in_new_tab`). |
| Layout — Image Size | Elementor image-size group (thumbnail, medium, large, full, custom). |
| Layout — Rows Number | Writes CSS `grid-template-rows` onto the widget’s front-end markup. Options: 1 Row; 2 Rows; 3 Rows. |
| Layout — Container Height | Writes CSS `min-height` onto the widget’s front-end markup. (min 100, max 1500). |
| Layout — Featured Box Width | Writes CSS `grid-template-columns` onto the widget’s front-end markup. (min 10, max 100). |
| Layout — Horizontal Gutter | Writes CSS `grid-column-gap` onto the widget’s front-end markup. (min 0, max 50). |
| Layout — Vertical Gutter | Writes CSS `grid-row-gap` onto the widget’s front-end markup. (min 0, max 50). |
| Grid Elements — Select Element | The chosen value is read in render() and applied on the front end. |
| Grid Elements — Show Last Update Date | Switcher inspector control (`show_last_update_date`). |
| Grid Elements — Display | Options: Inline; Separate Line; Custom Width. |
| Grid Elements — Element Width | Writes CSS `width` onto the widget’s front-end markup. (min 0, max 100). |
| Grid Elements — Vertical Align | Options: Top; Middle; Bottom. |
| Grid Elements — Horizontal Align | Writes CSS `text-align` onto the widget’s front-end markup. Options: Left; Center; Right. |
| Grid Elements — Title HTML Tag | The chosen value is read in render() and applied on the front end. Options: H1; H2; H3; H4; H5; H6; div; span…. |
| Grid Elements — Enable Drop Cap | Switcher inspector control (`element_dropcap`). |
| Grid Elements — Trim Text By | Selects the value used for the excerpt produced by wp_trim_words(). |
| Grid Elements — Word Count | Word count passed to WordPress excerpt trimming for each card (default 20, min 1). |
| Grid Elements — Letter Count | Numeric value used in this widget’s render/JS (default 40, min 1). |
| Grid Elements — Show Avatar | When this switch is on, render() outputs the wrapped markup. |
| Grid Elements — Avatar Size | Numeric value used in this widget’s render/JS (default 32, min 8). |
| Grid Elements — Read More Text | Printed in the widget HTML from render(). |
| Grid Elements — Separator | Printed in the widget HTML from render(). |
| Grid Elements — Select Styling | The chosen value is read in render() and applied on the front end. Options: Taxonomy Style 1; Taxonomy Style 2. |
| Grid Elements — No Comments | Saved on the widget and consumed in render(). |
| Grid Elements — One Comment | Saved on the widget and consumed in render(). |
| Grid Elements — Multiple Comments | Saved on the widget and consumed in render(). |
| Grid Elements — Select Styling (Element Separator Style) | The chosen value is read in render() and applied on the front end. Options: Separator Style 1; Separator Style 2. |
| Grid Elements — Extra Text Display | The chosen value is read in render() and applied on the front end. Options: None; Before Element; After Element. |
| Grid Elements — Extra Text | Printed in the widget HTML from render(). |
| Grid Elements — Extra Icon Position | The chosen value is read in render() and applied on the front end. Options: None; Before Element; After Element. |
| Grid Elements — Select Icon | Icon rendered with Elementor Icons_Manager in this widget’s HTML. |
| Grid Elements — Select Animation | Animation picker; the chosen effect is applied on the front end. |
| Grid Elements — Animation Duration | Writes CSS `transition-duration` onto the widget’s front-end markup. (default 0.3, min 0, max 5). |
| Grid Elements — Animation Delay | Writes CSS (king-addons-animation-wrap, transition-delay) onto the widget’s front-end markup. (default 0, min 0, max 5). |
| Grid Elements — Animation Timing | Select inspector control (`element_animation_timing`). |
| Grid Elements — Animation Size | Options: Small; Medium; Large. |
| Grid Elements — Animation Transparency | Switcher inspector control (`element_animation_tr`). |
| Grid Elements — Show on this Device | Switcher inspector control (`element_show_on`). |
| Elements — Grid Elements | Repeater rows; render() loops each item to build the list or slides. |
| Media Overlay — Overlay Width | Writes CSS (width, top, left, bottom, right) onto the widget’s front-end markup. (min 0, max 100). |
| Media Overlay — Overlay Height | Writes CSS (height, top, left, bottom, right) onto the widget’s front-end markup. (min 0, max 100). |
| Media Overlay — Link to Single Page | Switcher inspector control (`overlay_post_link`). |
| Media Overlay — Select Animation | Animation picker; the chosen effect is applied on the front end. |
| Media Overlay — Animation Duration | Writes CSS `transition-duration` onto the widget’s front-end markup. (default 0.7, min 0, max 5). |
| Media Overlay — Animation Delay | Writes CSS (king-addons-animation-wrap, transition-delay) onto the widget’s front-end markup. (default 0, min 0, max 5). |
| Media Overlay — Animation Timing | Select inspector control (`overlay_animation_timing`). |
| Media Overlay — Animation Size | Options: Small; Medium; Large. |
| Media Overlay — Animation Transparency | Switcher inspector control (`overlay_animation_tr`). |
| Grid Media — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Grid Media — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Grid Media — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Grid Media — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. |
| Media Overlay — Background | Elementor background group: classic color/image or gradient on the selector. Selector: `{{WRAPPER}} .king-addons-grid-media-hover-bg`. |
| Media Overlay — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Media Overlay — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Media Overlay — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Media Overlay — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. |
| Title (Normal) — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Title (Normal) — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Title (Normal) — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Title (Hover) — Color | Writes CSS (a, color) onto the widget’s front-end markup. |
| Title (Hover) — Background Color | Writes CSS (a, background-color) onto the widget’s front-end markup. |
| Title (Hover) — Border Color | Writes CSS (a, border-color) onto the widget’s front-end markup. |
| Title — Transition Duration (seconds) | Writes CSS (transition-duration, king-addons-pointer-item) onto the widget’s front-end markup. (default 0.1, min 0, max 5). |
| Title — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-title a`. |
| Title — Featured Box Title Font Size | Writes CSS (article, font-size) onto the widget’s front-end markup. (min 10, max 100). |
| Title — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Title — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Title — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Title — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Content — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Content — DropCap Color | Writes CSS (p, first-child, color) onto the widget’s front-end markup. |
| Content — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Content — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Content — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-content`. |
| Content — Drop Cap Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-content.king-addons-enable-dropcap p:first-child:fir…`. |
| Content — Justify Text | Switcher inspector control (`content_justify`). |
| Content — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Content — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Content — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Content — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Excerpt — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Excerpt — DropCap Color | Writes CSS (p, first-child, color) onto the widget’s front-end markup. |
| Excerpt — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Excerpt — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Excerpt — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-excerpt`. |
| Excerpt — Drop Cap Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-excerpt.king-addons-enable-dropcap p:first-child:fir…`. |
| Excerpt — Justify Text | Switcher inspector control (`excerpt_justify`). |
| Excerpt — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Excerpt — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Excerpt — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Excerpt — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Date — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Date — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Date — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Date — Extra Text Color | Writes CSS `color` onto the widget’s front-end markup. |
| Date — Extra Icon Color | Writes CSS (color, fill) onto the widget’s front-end markup. |
| Date — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-date`. |
| Date — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Date — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Date — Extra Text Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Date — Extra Icon Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Date — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Date — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Time — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Time — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Time — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Time — Extra Text Color | Writes CSS `color` onto the widget’s front-end markup. |
| Time — Extra Icon Color | Writes CSS (color, fill) onto the widget’s front-end markup. |
| Time — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-time`. |
| Time — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Time — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Time — Extra Text Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Time — Extra Icon Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Time — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Time — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Author (Normal) — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Author (Normal) — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Author (Normal) — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Author (Normal) — Extra Text Color | Writes CSS `color` onto the widget’s front-end markup. |
| Author (Hover) — Color | Writes CSS (a, color) onto the widget’s front-end markup. |
| Author (Hover) — Background Color | Writes CSS (a, background-color) onto the widget’s front-end markup. |
| Author (Hover) — Border Color | Writes CSS (a, border-color) onto the widget’s front-end markup. |
| Author — Transition Duration (seconds) | Writes CSS `transition-duration` onto the widget’s front-end markup. (default 0.1, min 0, max 5). |
| Author — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-author`. |
| Author — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Author — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Author — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. |
| Author — Extra Text Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Author — Extra Icon Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Author — Avatar Spacing | Writes CSS `margin-right` onto the widget’s front-end markup. (min 0, max 25). |
| Author — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Author — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Comments (Normal) — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Comments (Normal) — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Comments (Normal) — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Comments (Normal) — Extra Text Color | Writes CSS `color` onto the widget’s front-end markup. |
| Comments (Hover) — Color | Writes CSS (a, color) onto the widget’s front-end markup. |
| Comments (Hover) — Background Color | Writes CSS (a, background-color) onto the widget’s front-end markup. |
| Comments (Hover) — Border Color | Writes CSS (a, border-color) onto the widget’s front-end markup. |
| Comments — Transition Duration (seconds) | Writes CSS `transition-duration` onto the widget’s front-end markup. (default 0.1, min 0, max 5). |
| Comments — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-comments`. |
| Comments — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Comments — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Comments — Extra Text Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Comments — Extra Icon Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Comments — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Comments — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Comments — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. |
| Read More (Normal) — Background | Elementor background group: classic color/image or gradient on the selector. Selector: `{{WRAPPER}} .king-addons-grid-item-read-more .inner-block a`. |
| Read More (Normal) — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Read More (Normal) — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Read More (Normal) — Box Shadow | Elementor box-shadow group for the selector. Selector: `{{WRAPPER}} .king-addons-grid-item-read-more .inner-block a`. |
| Read More (Hover) — Background | Elementor background group: classic color/image or gradient on the selector. Selector: `{{WRAPPER}} .king-addons-grid-item-read-more .inner-block a.king-addons-button-none:hov…`. |
| Read More (Hover) — Color | Writes CSS (a, color) onto the widget’s front-end markup. |
| Read More (Hover) — Border Color | Writes CSS (a, border-color) onto the widget’s front-end markup. |
| Read More (Hover) — Box Shadow | Elementor box-shadow group for the selector. Selector: `{{WRAPPER}} .king-addons-grid-item-read-more .inner-block :hover a`. |
| Read More — Transition Duration (seconds) | Writes CSS (transition-duration, a) onto the widget’s front-end markup. (default 0.1, min 0, max 5). |
| Read More — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-read-more a`. |
| Read More — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Read More — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Read More — Extra Icon Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Read More — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Read More — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Read More — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. |
| Separator Style 1 — Color | Writes CSS `border-bottom-color` onto the widget’s front-end markup. |
| Separator Style 1 — Width | Writes CSS `width` onto the widget’s front-end markup. (min 0, max 300). |
| Separator Style 1 — Height | Writes CSS `border-bottom-width` onto the widget’s front-end markup. (min 1, max 100). |
| Separator Style 1 — Type | Writes CSS `border-bottom-style` onto the widget’s front-end markup. Options: Solid; Double; Dotted; Dashed; Groove. |
| Separator Style 1 — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Separator Style 1 — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. |
| Separator Style 2 — Color | Writes CSS `border-bottom-color` onto the widget’s front-end markup. |
| Separator Style 2 — Width | Writes CSS `width` onto the widget’s front-end markup. (min 0, max 300). |
| Separator Style 2 — Height | Writes CSS `border-bottom-width` onto the widget’s front-end markup. (min 0, max 100). |
| Separator Style 2 — Type | Writes CSS `border-bottom-style` onto the widget’s front-end markup. Options: Solid; Double; Dotted; Dashed; Groove. |
| Separator Style 2 — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Separator Style 2 — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. |
| Taxonomy Style 1 (Normal) — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Taxonomy Style 1 (Normal) — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Taxonomy Style 1 (Normal) — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Taxonomy Style 1 (Normal) — Extra Text Color | Writes CSS `color` onto the widget’s front-end markup. |
| Taxonomy Style 1 (Normal) — Extra Icon Color | Writes CSS (color, fill) onto the widget’s front-end markup. |
| Taxonomy Style 1 (Hover) — Color | Writes CSS (a, color, king-addons-pointer-item, background-color) onto the widget’s front-end markup. |
| Taxonomy Style 1 (Hover) — Background Color | Writes CSS (a, background-color) onto the widget’s front-end markup. |
| Taxonomy Style 1 (Hover) — Border Color | Writes CSS (a, border-color) onto the widget’s front-end markup. |
| Taxonomy Style 1 — Transition Duration (seconds) | Writes CSS (transition-duration, king-addons-pointer-item) onto the widget’s front-end markup. (default 0.1, min 0, max 5). |
| Taxonomy Style 1 — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-tax-style-1`. |
| Taxonomy Style 1 — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Taxonomy Style 1 — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Taxonomy Style 1 — Extra Text Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Taxonomy Style 1 — Extra Icon Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Taxonomy Style 1 — Gutter | Writes CSS `margin-right` onto the widget’s front-end markup. (min 0, max 20). |
| Taxonomy Style 1 — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Taxonomy Style 1 — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Taxonomy Style 1 — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. |
| Taxonomy Style 2 (Normal) — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Taxonomy Style 2 (Normal) — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Taxonomy Style 2 (Normal) — Border Color | Writes CSS `border-color` onto the widget’s front-end markup. |
| Taxonomy Style 2 (Hover) — Color | Writes CSS (a, color, king-addons-pointer-item, background-color) onto the widget’s front-end markup. |
| Taxonomy Style 2 (Hover) — Background Color | Writes CSS (a, background-color) onto the widget’s front-end markup. |
| Taxonomy Style 2 (Hover) — Border Color | Writes CSS (a, border-color) onto the widget’s front-end markup. |
| Taxonomy Style 2 — Transition Duration (seconds) | Writes CSS (transition-duration, king-addons-pointer-item) onto the widget’s front-end markup. (default 0.1, min 0, max 5). |
| Taxonomy Style 2 — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-tax-style-2`. |
| Taxonomy Style 2 — Border Type | Writes CSS `border-style` onto the widget’s front-end markup. Options: None; Solid; Double; Dotted; Dashed; Groove. |
| Taxonomy Style 2 — Border Width | Writes CSS `border-width` onto the widget’s front-end markup. |
| Taxonomy Style 2 — Extra Text Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Taxonomy Style 2 — Extra Icon Spacing | Writes CSS (padding-right, padding-left) onto the widget’s front-end markup. (min 0, max 25). |
| Taxonomy Style 2 — Gutter | Writes CSS `margin-right` onto the widget’s front-end markup. (min 0, max 20). |
| Taxonomy Style 2 — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Taxonomy Style 2 — Margin | Writes CSS `margin` onto the widget’s front-end markup. |
| Taxonomy Style 2 — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. |
| Password Protected — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Password Protected — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Password Protected — Input Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Password Protected — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-grid-item-protected p`. |
Content and Style tabs from this widget’s PHP, including repeater fields and group controls (typography, background, border, shadow). Elementor’s Advanced tab is core Elementor and is not listed here.
FAQ
Which Magazine Grid & Slider options need King Addons Pro?
Controls marked with the Pro icon in this widget’s PHP. King Addons Pro is a separate license from Elementor Pro.
Why doesn’t Magazine Grid & Slider work in the Elementor preview?
AJAX handlers run on the published page. Preview the front end (or a Theme Builder preview of a real post) to test submit/filter requests.
How do I add Magazine Grid & Slider in Elementor?
Install King Addons and Elementor, edit a page, search the panel for “Magazine Grid & Slider”, drag it onto the canvas, then set Content and Style.
Do I need Elementor Pro?
No. King Addons runs on free Elementor. Some King Addons options (for example template-in-accordion, extra popup conditions, parts of the template catalog) need King Addons Pro — not Elementor Pro.
Related content widgets
Posts Grid & Slider
Posts in a grid, slider, or carousel with query and layout controls (the Posts Grid widget).
Dynamic Posts Grid
A filterable grid of posts with AJAX search and Load More — for blogs and resource libraries.
Timeline Post/Story
A vertical or horizontal timeline for events, history, or a changelog.
Content Ticker
A scrolling ticker of posts or custom items for headlines and announcements.
Quick Post Grid
A lightweight WordPress post grid with sane spacing defaults. Fewer layout modes than Posts Grid.
Quick Post Slider
A lightweight post slider with navigation and pagination that does not overlap the slides.
Get King Addons
One free plugin. 80+ Elementor widgets, 650+ templates, and 4,000+ sections. Search for Magazine Grid & Slider after you activate it.