← All widgetsWidget 76 · emcp_custom_76

Before / After Slider

Elementor widget1 layout5 content options12 style options2 panel sections

Built with the EMCP Widget Builder and registered under the EMCP Custom category of the Elementor panel. Search the panel for: before, after, compare, image, slider.

Setup guide

  1. Open a page in Elementor, search the panel for Before / After Slider and drag it into a container.
  2. Content › Images: Before Image, After Image, Before Label, After Label, Start Position (%).
  3. Style tab sections: Style. Colours, typography and spacing set here are scoped to this widget instance.
  4. Publish. Every option is a standard Elementor control, so it responds to the editor, dynamic tags and global styles as usual.
Ships with its own JavaScript; it runs once per instance and re-initialises inside the Elementor editor preview.
Demo

Default

AfterBeforeBeforeAfter

Options reference

Every control the widget exposes, grouped by panel section. Names in code are the setting keys used by the MCP tools (add-free-widget, update-widget).

Content tab

Images

OptionTypeChoices / rangeDefaultNotes
Before Image
before_image		Image
After Image
after_image		Image
Before Label
before_label		TextBefore
After Label
after_label		TextAfter
Start Position (%)
start_position		Numbermin 0, max 10050

Style tab

Style

OptionTypeChoices / rangeDefaultNotes
Divider Color
line_color		Color
Divider Width
line_width		Slidermin 1, max 12, px
Knob Background
knob_bg		Color
Knob Arrow Color
knob_arrow		Color
Knob Size
knob_size		Slidermin 20, max 90, px
Knob Shadow
knob_shadow		Box shadow
Label Typography
label_typo		Typography
Label Text
label_color		Color
Label Background
label_bg		Color
Label Padding
label_pad		Dimensions
Label Radius
label_radius		Slidermin 0, max 30, px
Corner Radius
radius		Dimensions

Add it with the MCP tools

Any connected agent can place this widget: call add-free-widget with widget_type: "emcp_custom_76" and a settings object using the keys above. Run get-custom-widget with id 76 for the full JSON spec.