{"id":307318,"date":"2026-06-19T15:50:23","date_gmt":"2026-06-19T15:50:23","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/before-after-for-block-editor\/"},"modified":"2026-06-19T15:50:02","modified_gmt":"2026-06-19T15:50:02","slug":"plexblocks-before-after-image-comparison-for-block-editor","status":"publish","type":"plugin","link":"https:\/\/wordpress.org\/plugins\/plexblocks-before-after-image-comparison-for-block-editor\/","author":23268712,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"1.0.0","stable_tag":"1.0.0","tested":"7.0","requires":"6.3","requires_php":"7.4","requires_plugins":null,"header_name":"PlexBlocks - Before After Image Comparison for block editor","header_author":"ConicPlex","header_description":"Drag handle image comparison block with labels and orientation controls.","assets_banners_color":"857c75","last_updated":"2026-06-19 15:50:02","external_support_url":"","external_repository_url":"","donate_link":"","header_plugin_uri":"https:\/\/conicplex.com\/plugins\/plexblocks-before-after\/","header_author_uri":"https:\/\/conicplex.com","rating":0,"author_block_rating":0,"active_installs":0,"downloads":45,"num_ratings":0,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"1.0.0":{"tag":"1.0.0","author":"conicplex","date":"2026-06-19 15:50:02"}},"upgrade_notice":[],"ratings":[],"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3578914,"resolution":"128x128","location":"assets","locale":"","width":128,"height":128},"icon-256x256.png":{"filename":"icon-256x256.png","revision":3578914,"resolution":"256x256","location":"assets","locale":"","width":256,"height":256}},"assets_banners":{"banner-1544x500.png":{"filename":"banner-1544x500.png","revision":3578914,"resolution":"1544x500","location":"assets","locale":"","width":1544,"height":500},"banner-772x250.png":{"filename":"banner-772x250.png","revision":3578914,"resolution":"772x250","location":"assets","locale":"","width":772,"height":250}},"assets_blueprints":{},"all_blocks":{"plexblocks\/before-after":{"$schema":"https:\/\/schemas.wp.org\/trunk\/block.json","apiVersion":3,"name":"plexblocks\/before-after","version":"1.0.0","title":"Before \/ After","category":"plexblocks","icon":"image-flip-horizontal","description":"Drag handle image comparison slider.","keywords":["before after","comparison","image slider","plexblocks"],"textdomain":"plexblocks-before-after-image-comparison-for-block-editor","supports":{"anchor":true,"html":false},"attributes":{"isExamplePreview":{"type":"boolean","default":false},"designPreset":{"type":"string","default":"editorial"},"beforeImageId":{"type":"number","default":0},"beforeImageUrl":{"type":"string","default":""},"afterImageId":{"type":"number","default":0},"afterImageUrl":{"type":"string","default":""},"beforeLabel":{"type":"string","default":"Before"},"afterLabel":{"type":"string","default":"After"},"showLabels":{"type":"boolean","default":true},"dividerPosition":{"type":"number","default":50},"orientation":{"type":"string","default":"vertical"},"height":{"type":"number","default":480},"handleColor":{"type":"string","default":"#ffffff"},"overlayColor":{"type":"string","default":"rgba(255,255,255,0.15)"},"labelBackgroundColor":{"type":"string","default":"rgba(15,23,42,0.75)"},"labelTextColor":{"type":"string","default":"#ffffff"},"borderRadius":{"type":"number","default":24},"boxShadow":{"type":"string","default":"0 16px 36px rgba(15,23,42,0.12)"}},"example":{"attributes":{"isExamplePreview":true,"designPreset":"studio","beforeLabel":"Before","afterLabel":"After","showLabels":true,"dividerPosition":58,"orientation":"vertical","height":500,"handleColor":"#f8fafc","overlayColor":"rgba(15,23,42,0.08)","labelBackgroundColor":"rgba(255,255,255,0.88)","labelTextColor":"#111827","borderRadius":28,"boxShadow":"0 24px 52px rgba(15,23,42,0.18)"},"viewportWidth":520},"editorScript":"file:..\/..\/build\/before-after.js","editorStyle":"file:..\/..\/build\/before-after.css","style":"file:..\/..\/build\/before-after-view.css","viewScript":"file:..\/..\/build\/before-after-view.js"}},"tagged_versions":["1.0.0"],"block_files":[],"assets_screenshots":[],"screenshots":{"1":"Before \/ After block editor settings.","2":"Frontend comparison slider example."}},"plugin_section":[],"plugin_tags":[11619,145737,152095,176050,224162],"plugin_category":[],"plugin_contributors":[241979,242331,210138],"plugin_business_model":[],"class_list":["post-307318","plugin","type-plugin","status-publish","hentry","plugin_tags-before-after","plugin_tags-before-and-after-image","plugin_tags-comparison-slider","plugin_tags-image-comparison","plugin_tags-photo-comparison","plugin_contributors-conicplex","plugin_contributors-husenmemon","plugin_contributors-sajilmemon","plugin_committers-conicplex"],"banners":{"banner":"https:\/\/ps.w.org\/plexblocks-before-after-image-comparison-for-block-editor\/assets\/banner-772x250.png?rev=3578914","banner_2x":"https:\/\/ps.w.org\/plexblocks-before-after-image-comparison-for-block-editor\/assets\/banner-1544x500.png?rev=3578914","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":false,"icon":"https:\/\/ps.w.org\/plexblocks-before-after-image-comparison-for-block-editor\/assets\/icon-128x128.png?rev=3578914","icon_2x":"https:\/\/ps.w.org\/plexblocks-before-after-image-comparison-for-block-editor\/assets\/icon-256x256.png?rev=3578914","generated":false},"screenshots":[],"raw_content":"<!--section=description-->\n<p>Before \/ After for Gutenberg Block Editor helps you compare two images with a draggable handle, making it useful for renovation showcases, editing comparisons, product demos, and visual case studies.<\/p>\n\n<p>Features include:<\/p>\n\n<ul>\n<li>before and after image selection<\/li>\n<li>draggable comparison handle<\/li>\n<li>vertical and horizontal modes<\/li>\n<li>optional labels<\/li>\n<li>height, radius, color, and shadow controls<\/li>\n<\/ul>\n\n<h3>Developer Credits<\/h3>\n\n<p>This plugin was developed by ConicPlex, a leading agency specializing in WordPress plugin development. For more information about ConicPlex and their services, visit <a href=\"https:\/\/conicplex.com\">ConicPlex<\/a>.<\/p>\n\n<h3>Credits &amp; 3rd Party Services<\/h3>\n\n<p><strong><a href=\"https:\/\/conicplex.com\/\">ConicPlex.com<\/a><\/strong>: PlexBlocks Before After Image Comparison for block editor uses <a href=\"https:\/\/conicplex.com\/\">ConicPlex<\/a> (own website) to store plugin insights. Whenever the plugin is activated, deactivated, or uninstalled, an API request is sent to Conicplex to record the action. The API request includes the action, site URL, admin email, plugin version, plugin name, plugin text domain, WordPress version, site language, and site timezone. <a href=\"https:\/\/conicplex.com\/privacy-policy\/\">Privacy Policy<\/a>, <a href=\"https:\/\/conicplex.com\/terms-conditions\/\">Terms &amp; Conditions<\/a>.<\/p>\n\n<!--section=installation-->\n<ol>\n<li>Upload the plugin folder to <code>\/wp-content\/plugins\/<\/code>.<\/li>\n<li>Activate the plugin through the WordPress admin.<\/li>\n<li>Insert the <code>Before \/ After<\/code> block in the block editor.<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt id=\"can%20i%20change%20the%20slider%20orientation%3F\"><h3>Can I change the slider orientation?<\/h3><\/dt>\n<dd><p>Yes. The block supports both vertical and horizontal comparison layouts.<\/p><\/dd>\n<dt id=\"can%20i%20show%20custom%20labels%3F\"><h3>Can I show custom labels?<\/h3><\/dt>\n<dd><p>Yes. You can edit the before and after labels or hide them completely.<\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>1.0.0<\/h4>\n\n<ul>\n<li>Initial release.<\/li>\n<\/ul>","raw_excerpt":"Add an interactive before-and-after image comparison block to the WordPress block editor.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/307318","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=307318"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/conicplex"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=307318"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=307318"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=307318"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=307318"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=307318"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=307318"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}