Content · Elementor
Team Member Slider widget for Elementor
Several team members in a slider instead of a wrapping grid.
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
Several team members in a slider instead of a wrapping grid.
render() writes HTML data attributes: data-autoplay, data-autoplay-delay, data-autoplay-reverse, data-loop, data-navigation, data-pagination, data-slides-per-view, data-slides-per-view-mobile.
Front-end motion uses Swiper (slidesPerView, autoplay, pagination) from values PHP writes onto the wrapper.
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 “Team Member Slider”. Typing “king” lists every King Addons widget.
- Set inspector controls from this widget’s PHP. Configure “Slides Per View”, “Slides Per View (Tablet)”, “Slides Per View (Mobile)”, “Space Between (px)”. Style and Content tabs are listed on this page.
- Preview the published page. render() writes HTML data attributes: data-autoplay, data-autoplay-delay, data-autoplay-reverse, data-loop, data-navigation, data-pagination, data-slides-per-view, data-slides-per-view-mobile.
When to use it
- A large staff list.
- Conference speakers.
- A studio about page.
Inspector controls from this widget’s PHP
| Control | What the code does |
|---|---|
| Slider Settings — Slides Per View | Numeric value used in this widget’s render/JS (default 4, min 1, max 6). |
| Slider Settings — Slides Per View (Tablet) | Numeric value used in this widget’s render/JS (default 3, min 1, max 6). |
| Slider Settings — Slides Per View (Mobile) | Numeric value used in this widget’s render/JS (default 1, min 1, max 6). |
| Slider Settings — Space Between (px) | Spacing/size control (min 0, max 100). |
| Slider Settings — Loop | Switcher inspector control (`loop`). |
| Slider Settings — Autoplay | Passed through to Swiper autoplay. |
| Slider Settings — Autoplay Delay (ms) | Numeric value used in this widget’s render/JS (default 2000, min 0). |
| Slider Settings — Reverse Autoplay Direction | Passed through to Swiper autoplay. |
| Slider Settings — Transition Speed (ms) | Numeric value used in this widget’s render/JS (default 600, min 0). |
| Slider Settings — Pagination | Passed through to Swiper pagination. |
| Slider Settings — Navigation Arrows | Passed through to prev/next carousel arrows. |
| Slide — Padding | Writes CSS `padding` onto the widget’s front-end markup. |
| Slide — Background Color | Writes CSS `background-color` onto the widget’s front-end markup. |
| Slide — Border | Elementor border group: type, width, color, and radius when the group includes it. Selector: `{{WRAPPER}} .king-addons-tms-item`. |
| Slide — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. (min 0, max 200). |
| Slide — Box Shadow | Elementor box-shadow group for the selector. Selector: `{{WRAPPER}} .king-addons-tms-item`. |
| Photo — Image Size | Elementor image-size group (thumbnail, medium, large, full, custom). |
| Photo — Width | Writes CSS `width` onto the widget’s front-end markup. (min 0, max 1000). |
| Photo — Height | Writes CSS `height` onto the widget’s front-end markup. (min 0, max 1000). |
| Photo — Image Fit | Writes CSS `object-fit` onto the widget’s front-end markup. Options: Cover; Contain; Fill; None. |
| Photo — Border Radius | Writes CSS `border-radius` onto the widget’s front-end markup. (min 0, max 200). |
| Photo — Box Shadow | Elementor box-shadow group for the selector. Selector: `{{WRAPPER}} .king-addons-tms-photo img`. |
| Photo — CSS Filters | CSS filter group (blur, brightness, contrast, saturation). Selector: `{{WRAPPER}} .king-addons-tms-photo img`. |
| Photo — CSS Filters on Hover | CSS filter group (blur, brightness, contrast, saturation). Selector: `{{WRAPPER}} .king-addons-tms-photo:hover img`. |
| Name — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-tms-name`. |
| Name — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Role — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-tms-role`. |
| Role — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Bio — Typography | Elementor typography group: family, size, weight, transform, style, decoration, line-height, letter-spacing. Selector: `{{WRAPPER}} .king-addons-tms-bio`. |
| Bio — Color | Writes CSS `color` onto the widget’s front-end markup. |
| Pagination — Bullet Size (px) | Writes CSS (width, height) onto the widget’s front-end markup. (min 4, max 20). |
| Pagination — Bullet Color | Writes CSS `background` onto the widget’s front-end markup. |
| Pagination — Bullet Active Color | Writes CSS `background` onto the widget’s front-end markup. |
| Pagination — Pagination Position | Swiper `pagination.type` on the front end. Options: Inside; Outside. |
| Navigation — Arrow Size (px) | Writes CSS (width, height, background-size, swiper-button-next, swiper-button-prev, font-size) onto the widget’s front-end markup. (min 10, max 60). |
| Navigation — Arrow Color | Writes CSS `color` onto the widget’s front-end markup. |
| Navigation — Arrows Position | The chosen value is read in render() and applied on the front end. Options: Inside; Outside. |
| Members — Name | Text inspector control (`name`). |
| Members — Role | Text inspector control (`role`). |
| Members — Photo | Media Library attachment(s); render() uses the URL/ID as the image source. |
| Members — Bio | Textarea inspector control (`bio`). |
| Team Members — Members | Repeater rows; render() loops each item to build the list or slides. |
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
What does Team Member Slider actually change on the page?
Several team members in a slider instead of a wrapping grid. Inspector labels from this widget’s PHP include “Slides Per View”, “Slides Per View (Tablet)”, “Slides Per View (Mobile)”, “Space Between (px)”.
How do I add Team Member Slider in Elementor?
Install King Addons and Elementor, edit a page, search the panel for “Team Member 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
Advanced Blog Posts Carousel
A carousel of blog posts with image, title, and meta — lighter than a full magazine grid.
Advanced Card Carousel
A carousel of cards you fill yourself (image, text, button) — not a post query.
Accordion
Collapsible panels for FAQs, policies, and long answers. One heading per panel; the body stays hidden until the visitor opens it.
Posts Grid & Slider
Posts in a grid, slider, or carousel with query and layout controls (the Posts Grid widget).
Quick Card Slider
The slider version of Quick Card Grid: same cards, one row that moves.
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 Team Member Slider after you activate it.