{"id":297644,"date":"2026-04-29T17:30:08","date_gmt":"2026-04-29T17:30:08","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/image-split\/"},"modified":"2026-04-29T17:29:34","modified_gmt":"2026-04-29T17:29:34","slug":"image-split","status":"publish","type":"plugin","link":"https:\/\/test.wordpress.org\/plugins\/image-split\/","author":17884139,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_crdt_document":"","version":"1.0.1","stable_tag":"1.0.1","tested":"6.9.4","requires":"6.0","requires_php":"7.4","requires_plugins":null,"header_name":"Image Split \u2013 Before\/After Image Comparison Slider","header_author":"barb0ss","header_description":"Before\/after image comparison slider with draggable ruler. Use via Gutenberg block (including widget areas), shortcode, or WooCommerce product.","assets_banners_color":"2a2f38","last_updated":"2026-04-29 17:29:34","external_support_url":"","external_repository_url":"","donate_link":"","header_plugin_uri":"https:\/\/pluginarium.com\/image-split","header_author_uri":"https:\/\/pluginarium.com","rating":0,"author_block_rating":0,"active_installs":0,"downloads":76,"num_ratings":0,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"1.0.1":{"tag":"1.0.1","author":"barb0ss","date":"2026-04-29 17:29:34"}},"upgrade_notice":{"1.0.0":"<ul>\n<li>First public release.<\/li>\n<\/ul>"},"ratings":[],"assets_icons":{"icon-256x256.png":{"filename":"icon-256x256.png","revision":3518692,"resolution":"256x256","location":"assets","locale":"","width":256,"height":256},"icon.svg":{"filename":"icon.svg","revision":3518692,"resolution":false,"location":"assets","locale":false}},"assets_banners":{"banner-1544x500.jpg":{"filename":"banner-1544x500.jpg","revision":3518692,"resolution":"1544x500","location":"assets","locale":"","width":1544,"height":500},"banner-772x250.jpg":{"filename":"banner-772x250.jpg","revision":3518692,"resolution":"772x250","location":"assets","locale":"","width":772,"height":250}},"assets_blueprints":{},"all_blocks":{"image-split\/slider":{"name":"image-split\/slider","title":"Slider"}},"tagged_versions":["1.0.1"],"block_files":[],"assets_screenshots":{"screenshot-1.jpg":{"filename":"screenshot-1.jpg","revision":3518692,"resolution":"1","location":"assets","locale":"","width":968,"height":540},"screenshot-2.jpg":{"filename":"screenshot-2.jpg","revision":3518692,"resolution":"2","location":"assets","locale":"","width":552,"height":3730},"screenshot-3.jpg":{"filename":"screenshot-3.jpg","revision":3518692,"resolution":"3","location":"assets","locale":"","width":1927,"height":1709},"screenshot-4.jpg":{"filename":"screenshot-4.jpg","revision":3518692,"resolution":"4","location":"assets","locale":"","width":1040,"height":240},"screenshot-5.jpg":{"filename":"screenshot-5.jpg","revision":3518692,"resolution":"5","location":"assets","locale":"","width":1306,"height":490},"screenshot-6.jpg":{"filename":"screenshot-6.jpg","revision":3518692,"resolution":"6","location":"assets","locale":"","width":1397,"height":795}},"screenshots":{"1":"Front-end before\/after comparison with the draggable ruler (horizontal layout).","2":"Gutenberg block: selecting Before and After images in the editor.","3":"Global defaults on Settings \u2192 Image Split.","4":"Shortcode example in a classic block or shortcode-ready area.","5":"Premium: WooCommerce product options under Product data.","6":"Premium: Image Split Elementor widget in the page builder."},"jetpack_post_was_ever_published":false},"plugin_section":[],"plugin_tags":[11619,148076,176050,80,611],"plugin_category":[43],"plugin_contributors":[193845],"plugin_business_model":[],"class_list":["post-297644","plugin","type-plugin","status-publish","hentry","plugin_tags-before-after","plugin_tags-gutenberg","plugin_tags-image-comparison","plugin_tags-shortcode","plugin_tags-slider","plugin_category-customization","plugin_contributors-barb0ss","plugin_committers-barb0ss"],"banners":{"banner":"https:\/\/ps.w.org\/image-split\/assets\/banner-772x250.jpg?rev=3518692","banner_2x":"https:\/\/ps.w.org\/image-split\/assets\/banner-1544x500.jpg?rev=3518692","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":"https:\/\/ps.w.org\/image-split\/assets\/icon.svg?rev=3518692","icon":"https:\/\/ps.w.org\/image-split\/assets\/icon.svg?rev=3518692","icon_2x":false,"generated":false},"screenshots":[{"src":"https:\/\/ps.w.org\/image-split\/assets\/screenshot-1.jpg?rev=3518692","caption":"Front-end before\/after comparison with the draggable ruler (horizontal layout)."},{"src":"https:\/\/ps.w.org\/image-split\/assets\/screenshot-2.jpg?rev=3518692","caption":"Gutenberg block: selecting Before and After images in the editor."},{"src":"https:\/\/ps.w.org\/image-split\/assets\/screenshot-3.jpg?rev=3518692","caption":"Global defaults on Settings \u2192 Image Split."},{"src":"https:\/\/ps.w.org\/image-split\/assets\/screenshot-4.jpg?rev=3518692","caption":"Shortcode example in a classic block or shortcode-ready area."},{"src":"https:\/\/ps.w.org\/image-split\/assets\/screenshot-5.jpg?rev=3518692","caption":"Premium: WooCommerce product options under Product data."},{"src":"https:\/\/ps.w.org\/image-split\/assets\/screenshot-6.jpg?rev=3518692","caption":"Premium: Image Split Elementor widget in the page builder."}],"raw_content":"<!--section=description-->\n<p>Image Split is a friendly, lightweight way to show <strong>before and after<\/strong> photos, product comparisons, or makeovers \u2014 all with a smooth draggable slider visitors can move with a mouse, touch, or keyboard.<\/p>\n\n<p>Unlike clunky embeds or heavy page builders, Image Split:<\/p>\n\n<p>\ud83e\udde9 <strong>Fits your workflow<\/strong> \u2014 Drop in a block (in posts or under Appearance \u2192 Widgets), or paste a shortcode.\n\ud83c\udfa8 <strong>Looks polished<\/strong> \u2014 Horizontal or vertical layout, ruler styles (line, bar, circle), and labels you can style to match your brand.\n\u267f <strong>Stays accessible<\/strong> \u2014 Keyboard navigation and ARIA support so more people can use your comparisons.\n\u2699\ufe0f <strong>Saves time<\/strong> \u2014 Set global defaults under Settings \u2192 Image Split so new comparisons start with your look.<\/p>\n\n<p>Need product pages or Elementor? <strong><a href=\"http:\/\/pluginarium.com\/image-split\/#premium\">Premium<\/a><\/strong> adds WooCommerce and Elementor, plus deeper per-item customization.<\/p>\n\n<p><a href=\"http:\/\/pluginarium.com\/image-split\">Image Split official website<\/a> | <a href=\"http:\/\/pluginarium.com\/image-split\/image-split-documentation\">Plugin documentation<\/a><\/p>\n\n<h3>\u2728 Free features \u2728<\/h3>\n\n<ul>\n<li><strong>Gutenberg block<\/strong> \u2014 Pick Before and After images, tune the ruler, and place labels without leaving the editor.<\/li>\n<li><strong>Shortcode<\/strong> \u2014 Use <code>[image_split]<\/code> anywhere shortcodes run, with optional attributes for layout and styling.<\/li>\n<li><strong>Widget areas<\/strong> \u2014 Add the same Image Split block under Appearance \u2192 Widgets (block-based widget editor).<\/li>\n<li><strong>Orientation<\/strong> \u2014 Horizontal or vertical comparison.<\/li>\n<li><strong>Ruler styles<\/strong> \u2014 Line, bar, or circle; custom color and width.<\/li>\n<li><strong>Labels<\/strong> \u2014 Before\/After text with position, color, background, and font size.<\/li>\n<li><strong>Global defaults<\/strong> \u2014 Settings \u2192 Image Split for site-wide starting values.<\/li>\n<li><strong>Responsive &amp; touch-friendly<\/strong> \u2014 Works on phones and tablets.<\/li>\n<li><strong>Lazy-loading friendly<\/strong> \u2014 Plays nicely with common lazy-load setups.<\/li>\n<li><strong>Accessibility<\/strong> \u2014 Keyboard and ARIA support.<\/li>\n<\/ul>\n\n<h3>\u269c\ufe0f Premium features \u269c\ufe0f<\/h3>\n\n<ul>\n<li><strong>WooCommerce<\/strong> \u2014 Enable Image Split per product on the single product page, using gallery images or custom attachment IDs.<\/li>\n<li><strong>Elementor widget<\/strong> \u2014 Drop Image Split into Elementor-built layouts.<\/li>\n<li><strong>Full customization<\/strong> \u2014 More options to override defaults per block, shortcode, or product.<\/li>\n<\/ul>\n\n<p>Unlock product pages, Elementor, and advanced controls \u2014 upgrade when you\u2019re ready.<\/p>\n\n<p><strong><a href=\"http:\/\/pluginarium.com\/image-split\/#premium\">Explore the Premium version here.<\/a><\/strong><\/p>\n\n<h3>How does Image Split work?<\/h3>\n\n<p>You choose two images (before and after). Image Split renders them as one comparison with a movable divider. The free plugin ships the block (for content and widget areas), shortcode, and global defaults; Premium adds WooCommerce and Elementor integrations built for stores and visual builders.<\/p>\n\n<p><a href=\"http:\/\/pluginarium.com\/image-split\/image-split-documentation\">Full documentation is available here.<\/a><\/p>\n\n<h3>Shortcode<\/h3>\n\n<pre><code>[image_split before=\"123\" after=\"456\" orientation=\"horizontal\" offset=\"0.5\" ruler_style=\"line\" ruler_color=\"#ffffff\" ruler_width=\"4\" label_before=\"Before\" label_after=\"After\" label_position=\"bottom-left\" label_color=\"#ffffff\" label_bg_color=\"rgba(0,0,0,0.5)\" label_font_size=\"14\"]\n<\/code><\/pre>\n\n<ul>\n<li><strong>before<\/strong>, <strong>after<\/strong> \u2014 attachment IDs (required)<\/li>\n<li><strong>orientation<\/strong> \u2014 <code>horizontal<\/code> | <code>vertical<\/code><\/li>\n<li><strong>offset<\/strong> \u2014 0 to 1 (default 0.5)<\/li>\n<li><strong>ruler_style<\/strong> \u2014 <code>line<\/code> | <code>bar<\/code> | <code>circle<\/code><\/li>\n<li><strong>ruler_color<\/strong>, <strong>ruler_width<\/strong> \u2014 color and width in px<\/li>\n<li><strong>label_before<\/strong>, <strong>label_after<\/strong> \u2014 text<\/li>\n<li><strong>label_position<\/strong> \u2014 Before label: top-left, top-right, bottom-left, bottom-right, center-left, center-right<\/li>\n<li><strong>label_after_position<\/strong> \u2014 After label (same options)<\/li>\n<li><strong>label_color<\/strong>, <strong>label_bg_color<\/strong>, <strong>label_font_size<\/strong><\/li>\n<\/ul>\n\n<h3>WooCommerce (Premium)<\/h3>\n\n<p>On the product edit screen, under <strong>Product data<\/strong> \u2192 gallery \/ Image Split options:<\/p>\n\n<ul>\n<li><strong>Enable Image Split<\/strong> \u2014 Show the slider instead of the main product image on the product page.<\/li>\n<li><strong>Before\/After image ID<\/strong> \u2014 Use <code>0<\/code> to take the first two gallery images automatically.<\/li>\n<\/ul>\n\n<!--section=installation-->\n<ol>\n<li>Upload the <code>image-split<\/code> folder to <code>\/wp-content\/plugins\/<\/code>, or install through the WordPress plugin screen.<\/li>\n<li>Activate the plugin.<\/li>\n<li>Add the <strong>Image Split<\/strong> block (in posts or under Appearance \u2192 Widgets), use the shortcode <code>[image_split]<\/code>, or both. The distributed plugin includes built block assets; no Node\/npm step is required. <strong>Premium:<\/strong> enable Image Split on WooCommerce products or use the Elementor widget.<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt id=\"where%20are%20the%20global%20default%20settings%3F\"><h3>Where are the global default settings?<\/h3><\/dt>\n<dd><p>Go to <strong>Settings \u2192 Image Split<\/strong> in your WordPress admin. Those defaults apply when you add a new block, shortcode, or other integration unless you override them.<\/p><\/dd>\n<dt id=\"what%20are%20the%20required%20shortcode%20attributes%3F\"><h3>What are the required shortcode attributes?<\/h3><\/dt>\n<dd><p>You must set <strong>before<\/strong> and <strong>after<\/strong> to two media library attachment IDs (integers).<\/p><\/dd>\n<dt id=\"does%20image%20split%20work%20with%20lazy%20loading%3F\"><h3>Does Image Split work with lazy loading?<\/h3><\/dt>\n<dd><p>Yes. The slider is built to cooperate with common lazy-loading setups.<\/p><\/dd>\n<dt id=\"is%20the%20comparison%20accessible%3F\"><h3>Is the comparison accessible?<\/h3><\/dt>\n<dd><p>The free version includes keyboard support and ARIA attributes so visitors can use the divider without a mouse where possible.<\/p><\/dd>\n<dt id=\"what%20does%20premium%20add%3F\"><h3>What does Premium add?<\/h3><\/dt>\n<dd><p>Premium adds <strong>WooCommerce<\/strong> product integration, an <strong>Elementor<\/strong> widget, and more options to customize each comparison. See <a href=\"http:\/\/pluginarium.com\/image-split\/#premium\">Premium<\/a>.<\/p><\/dd>\n<dt id=\"where%20is%20the%20full%20documentation%3F\"><h3>Where is the full documentation?<\/h3><\/dt>\n<dd><p><a href=\"http:\/\/pluginarium.com\/image-split\/image-split-documentation\">Image Split documentation<\/a><\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>1.0.0<\/h4>\n\n<ul>\n<li>Initial release: Gutenberg block (posts and widget areas), shortcode, global defaults. Premium: WooCommerce integration, Elementor widget, extended customization.<\/li>\n<\/ul>","raw_excerpt":"Before\/after image comparisons with a draggable ruler. Block (including widget areas), shortcode. Premium: WooCommerce and Elementor.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/297644","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=297644"}],"author":[{"embeddable":true,"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/barb0ss"}],"wp:attachment":[{"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=297644"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=297644"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=297644"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=297644"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=297644"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/test.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=297644"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}