{"id":5400,"date":"2026-09-20T20:25:04","date_gmt":"2026-09-20T20:25:04","guid":{"rendered":"https:\/\/marketplace.emcptools.com\/widgets\/stacked-cards\/"},"modified":"2026-09-21T17:34:23","modified_gmt":"2026-09-21T17:34:23","slug":"stacked-cards","status":"publish","type":"page","link":"https:\/\/marketplace.emcptools.com\/widgets\/stacked-cards\/","title":{"rendered":"Stacked Cards"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"5400\" class=\"elementor elementor-5400\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-5133961 e-flex e-con-boxed e-con e-parent\" data-id=\"5133961\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-bb0d800 e-flex e-con-full e-con e-child\" data-id=\"bb0d800\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8e91842 elementor-widget elementor-widget-html\" data-id=\"8e91842\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>.ewd{font:15px\/1.6 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#101828}.ewd a{color:#6a11cb}.ewd h2{font-size:26px;margin:0 0 12px;font-weight:700}.ewd h3{font-size:19px;margin:24px 0 8px;font-weight:700}.ewd p{margin:0 0 12px}.ewd ol,.ewd ul{margin:0 0 14px 22px;padding:0}.ewd li{margin:0 0 6px}.ewd .chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}.ewd .chip{background:#f4ebff;color:#6a11cb;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600}.ewd .chip.dark{background:#101828;color:#fff}.ewd .note{background:#f9fafb;border:1px solid #eaecf0;border-left:4px solid #6a11cb;border-radius:8px;padding:12px 16px;margin:0 0 14px}.ewd table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 24px;border:1px solid #eaecf0}.ewd th{background:#101828;color:#fff;text-align:left;padding:10px 12px;font-weight:600}.ewd td{padding:10px 12px;border-top:1px solid #eaecf0;vertical-align:top}.ewd tr:nth-child(even) td{background:#f9fafb}.ewd code{background:#f2f4f7;border-radius:4px;padding:1px 6px;font-size:12.5px;color:#344054}.ewd .demo-cap{font-size:13px;color:#667085;margin:0 0 10px}.ewd .demo-cap code{color:#6a11cb}.ewd .demo-head{display:flex;align-items:center;gap:10px;margin:0 0 6px}.ewd .demo-head span{background:#6a11cb;color:#fff;border-radius:6px;padding:2px 10px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.ewd .demo-head h3{margin:0}.ewd .top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 10px;font-size:14px}.ewd .top a{text-decoration:none;font-weight:600}<\/style><div class=\"ewd\"><div class=\"top\"><a href=\"https:\/\/marketplace.emcptools.com\/widgets\/\">&larr; All widgets<\/a><span>Widget 101 &middot; <code>emcp_custom_101<\/code><\/span><\/div><h2 style=\"font-size:36px;margin-bottom:8px\">Stacked Cards<\/h2><div class=\"chips\"><span class=\"chip dark\">Elementor widget<\/span><span class=\"chip\">4 layouts<\/span><span class=\"chip\">7 content options<\/span><span class=\"chip\">24 style options<\/span><span class=\"chip\">4 panel sections<\/span><\/div><p>Built with the EMCP Widget Builder and registered under the <b>EMCP Custom<\/b> category of the Elementor panel. Search the panel for: stacked, cards, sticky, scroll, stack, parallax.<\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-8af60d1 e-flex e-con-full e-con e-child\" data-id=\"8af60d1\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-301cb09 elementor-widget elementor-widget-html\" data-id=\"301cb09\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>.ewd{font:15px\/1.6 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#101828}.ewd a{color:#6a11cb}.ewd h2{font-size:26px;margin:0 0 12px;font-weight:700}.ewd h3{font-size:19px;margin:24px 0 8px;font-weight:700}.ewd p{margin:0 0 12px}.ewd ol,.ewd ul{margin:0 0 14px 22px;padding:0}.ewd li{margin:0 0 6px}.ewd .chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}.ewd .chip{background:#f4ebff;color:#6a11cb;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600}.ewd .chip.dark{background:#101828;color:#fff}.ewd .note{background:#f9fafb;border:1px solid #eaecf0;border-left:4px solid #6a11cb;border-radius:8px;padding:12px 16px;margin:0 0 14px}.ewd table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 24px;border:1px solid #eaecf0}.ewd th{background:#101828;color:#fff;text-align:left;padding:10px 12px;font-weight:600}.ewd td{padding:10px 12px;border-top:1px solid #eaecf0;vertical-align:top}.ewd tr:nth-child(even) td{background:#f9fafb}.ewd code{background:#f2f4f7;border-radius:4px;padding:1px 6px;font-size:12.5px;color:#344054}.ewd .demo-cap{font-size:13px;color:#667085;margin:0 0 10px}.ewd .demo-cap code{color:#6a11cb}.ewd .demo-head{display:flex;align-items:center;gap:10px;margin:0 0 6px}.ewd .demo-head span{background:#6a11cb;color:#fff;border-radius:6px;padding:2px 10px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.ewd .demo-head h3{margin:0}.ewd .top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 10px;font-size:14px}.ewd .top a{text-decoration:none;font-weight:600}<\/style><div class=\"ewd\"><h2>Setup guide<\/h2><ol><li>Open a page in Elementor, search the panel for <b>Stacked Cards<\/b> and drag it into a container.<\/li><li><b>Content &rsaquo; Cards<\/b>: Card Layout, Stacking Effect, Sticky Top Offset, Peek Step (per card), Card Min Height, Cards, Title Tag.<\/li><li>Pick a <b>Card Layout<\/b>: Split (text left, image right), Split reversed, Image cover with text overlay, Text only. Each one is shown below.<\/li><li><b>Style tab<\/b> sections: Card, Typography, Image. Colours, typography and spacing set here are scoped to this widget instance.<\/li><li>Publish. Every option is a standard Elementor control, so it responds to the editor, dynamic tags and global styles as usual.<\/li><\/ol><div class=\"note\">Ships with its own JavaScript; it runs once per instance and re-initialises inside the Elementor editor preview.<\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-17f94e1 e-flex e-con-full e-con e-child\" data-id=\"17f94e1\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-86d2587 elementor-widget elementor-widget-html\" data-id=\"86d2587\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>.ewd{font:15px\/1.6 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#101828}.ewd a{color:#6a11cb}.ewd h2{font-size:26px;margin:0 0 12px;font-weight:700}.ewd h3{font-size:19px;margin:24px 0 8px;font-weight:700}.ewd p{margin:0 0 12px}.ewd ol,.ewd ul{margin:0 0 14px 22px;padding:0}.ewd li{margin:0 0 6px}.ewd .chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}.ewd .chip{background:#f4ebff;color:#6a11cb;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600}.ewd .chip.dark{background:#101828;color:#fff}.ewd .note{background:#f9fafb;border:1px solid #eaecf0;border-left:4px solid #6a11cb;border-radius:8px;padding:12px 16px;margin:0 0 14px}.ewd table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 24px;border:1px solid #eaecf0}.ewd th{background:#101828;color:#fff;text-align:left;padding:10px 12px;font-weight:600}.ewd td{padding:10px 12px;border-top:1px solid #eaecf0;vertical-align:top}.ewd tr:nth-child(even) td{background:#f9fafb}.ewd code{background:#f2f4f7;border-radius:4px;padding:1px 6px;font-size:12.5px;color:#344054}.ewd .demo-cap{font-size:13px;color:#667085;margin:0 0 10px}.ewd .demo-cap code{color:#6a11cb}.ewd .demo-head{display:flex;align-items:center;gap:10px;margin:0 0 6px}.ewd .demo-head span{background:#6a11cb;color:#fff;border-radius:6px;padding:2px 10px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.ewd .demo-head h3{margin:0}.ewd .top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 10px;font-size:14px}.ewd .top a{text-decoration:none;font-weight:600}<\/style><div class=\"ewd\"><div class=\"demo-head\"><span>Layout<\/span><h3>Split (text left, image right)<\/h3><\/div><p class=\"demo-cap\">Card Layout = <code>split<\/code><\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e845108 elementor-widget elementor-widget-emcp_custom_101\" data-id=\"e845108\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"emcp_custom_101.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"emcp-sc emcp-sc--split emcp-sc--scale\"><div class=\"emcp-sc__card\" style=\"background-color:#f4ebff;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">01<\/span><h3 class=\"emcp-sc__title\">Discover<\/h3><p class=\"emcp-sc__text\">We start by understanding your goals, audience and constraints.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1565650839149-2c48a094196c.jpg\" alt=\"Discover\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#e0f2fe;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">02<\/span><h3 class=\"emcp-sc__title\">Design<\/h3><p class=\"emcp-sc__text\">Wireframes become polished, on-brand interfaces.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1575052814086-f385e2e2ad1b.jpg\" alt=\"Design\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#dcfce7;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">03<\/span><h3 class=\"emcp-sc__title\">Build<\/h3><p class=\"emcp-sc__text\">Clean, fast code shipped with tests and documentation.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1587093430416-0dc23a0c62c1.jpg\" alt=\"Build\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#101828;color:#ffffff;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">04<\/span><h3 class=\"emcp-sc__title\">Launch<\/h3><p class=\"emcp-sc__text\">We deploy, monitor and iterate with you.<\/p><a class=\"emcp-sc__cta\" href=\"\">Start a project<\/a><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1597656434247-bd334ccce92c.jpg\" alt=\"Launch\"><\/div><\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-1aad9b8 e-flex e-con-full e-con e-child\" data-id=\"1aad9b8\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-83951e2 elementor-widget elementor-widget-html\" data-id=\"83951e2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>.ewd{font:15px\/1.6 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#101828}.ewd a{color:#6a11cb}.ewd h2{font-size:26px;margin:0 0 12px;font-weight:700}.ewd h3{font-size:19px;margin:24px 0 8px;font-weight:700}.ewd p{margin:0 0 12px}.ewd ol,.ewd ul{margin:0 0 14px 22px;padding:0}.ewd li{margin:0 0 6px}.ewd .chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}.ewd .chip{background:#f4ebff;color:#6a11cb;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600}.ewd .chip.dark{background:#101828;color:#fff}.ewd .note{background:#f9fafb;border:1px solid #eaecf0;border-left:4px solid #6a11cb;border-radius:8px;padding:12px 16px;margin:0 0 14px}.ewd table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 24px;border:1px solid #eaecf0}.ewd th{background:#101828;color:#fff;text-align:left;padding:10px 12px;font-weight:600}.ewd td{padding:10px 12px;border-top:1px solid #eaecf0;vertical-align:top}.ewd tr:nth-child(even) td{background:#f9fafb}.ewd code{background:#f2f4f7;border-radius:4px;padding:1px 6px;font-size:12.5px;color:#344054}.ewd .demo-cap{font-size:13px;color:#667085;margin:0 0 10px}.ewd .demo-cap code{color:#6a11cb}.ewd .demo-head{display:flex;align-items:center;gap:10px;margin:0 0 6px}.ewd .demo-head span{background:#6a11cb;color:#fff;border-radius:6px;padding:2px 10px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.ewd .demo-head h3{margin:0}.ewd .top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 10px;font-size:14px}.ewd .top a{text-decoration:none;font-weight:600}<\/style><div class=\"ewd\"><div class=\"demo-head\"><span>Layout<\/span><h3>Split reversed<\/h3><\/div><p class=\"demo-cap\">Card Layout = <code>split-reverse<\/code><\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d1e26e5 elementor-widget elementor-widget-emcp_custom_101\" data-id=\"d1e26e5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"emcp_custom_101.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"emcp-sc emcp-sc--split-reverse emcp-sc--scale\"><div class=\"emcp-sc__card\" style=\"background-color:#f4ebff;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">01<\/span><h3 class=\"emcp-sc__title\">Discover<\/h3><p class=\"emcp-sc__text\">We start by understanding your goals, audience and constraints.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1565650839149-2c48a094196c.jpg\" alt=\"Discover\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#e0f2fe;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">02<\/span><h3 class=\"emcp-sc__title\">Design<\/h3><p class=\"emcp-sc__text\">Wireframes become polished, on-brand interfaces.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1575052814086-f385e2e2ad1b.jpg\" alt=\"Design\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#dcfce7;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">03<\/span><h3 class=\"emcp-sc__title\">Build<\/h3><p class=\"emcp-sc__text\">Clean, fast code shipped with tests and documentation.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1587093430416-0dc23a0c62c1.jpg\" alt=\"Build\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#101828;color:#ffffff;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">04<\/span><h3 class=\"emcp-sc__title\">Launch<\/h3><p class=\"emcp-sc__text\">We deploy, monitor and iterate with you.<\/p><a class=\"emcp-sc__cta\" href=\"\">Start a project<\/a><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1588783256125-254ebad5ecbe.jpg\" alt=\"Launch\"><\/div><\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2dd10ab e-flex e-con-full e-con e-child\" data-id=\"2dd10ab\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e00f0f6 elementor-widget elementor-widget-html\" data-id=\"e00f0f6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>.ewd{font:15px\/1.6 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#101828}.ewd a{color:#6a11cb}.ewd h2{font-size:26px;margin:0 0 12px;font-weight:700}.ewd h3{font-size:19px;margin:24px 0 8px;font-weight:700}.ewd p{margin:0 0 12px}.ewd ol,.ewd ul{margin:0 0 14px 22px;padding:0}.ewd li{margin:0 0 6px}.ewd .chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}.ewd .chip{background:#f4ebff;color:#6a11cb;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600}.ewd .chip.dark{background:#101828;color:#fff}.ewd .note{background:#f9fafb;border:1px solid #eaecf0;border-left:4px solid #6a11cb;border-radius:8px;padding:12px 16px;margin:0 0 14px}.ewd table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 24px;border:1px solid #eaecf0}.ewd th{background:#101828;color:#fff;text-align:left;padding:10px 12px;font-weight:600}.ewd td{padding:10px 12px;border-top:1px solid #eaecf0;vertical-align:top}.ewd tr:nth-child(even) td{background:#f9fafb}.ewd code{background:#f2f4f7;border-radius:4px;padding:1px 6px;font-size:12.5px;color:#344054}.ewd .demo-cap{font-size:13px;color:#667085;margin:0 0 10px}.ewd .demo-cap code{color:#6a11cb}.ewd .demo-head{display:flex;align-items:center;gap:10px;margin:0 0 6px}.ewd .demo-head span{background:#6a11cb;color:#fff;border-radius:6px;padding:2px 10px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.ewd .demo-head h3{margin:0}.ewd .top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 10px;font-size:14px}.ewd .top a{text-decoration:none;font-weight:600}<\/style><div class=\"ewd\"><div class=\"demo-head\"><span>Layout<\/span><h3>Image cover with text overlay<\/h3><\/div><p class=\"demo-cap\">Card Layout = <code>cover<\/code><\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-eac67e4 elementor-widget elementor-widget-emcp_custom_101\" data-id=\"eac67e4\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"emcp_custom_101.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"emcp-sc emcp-sc--cover emcp-sc--scale\"><div class=\"emcp-sc__card\" style=\"background-color:#f4ebff;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">01<\/span><h3 class=\"emcp-sc__title\">Discover<\/h3><p class=\"emcp-sc__text\">We start by understanding your goals, audience and constraints.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1565650839149-2c48a094196c.jpg\" alt=\"Discover\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#e0f2fe;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">02<\/span><h3 class=\"emcp-sc__title\">Design<\/h3><p class=\"emcp-sc__text\">Wireframes become polished, on-brand interfaces.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1575052814086-f385e2e2ad1b.jpg\" alt=\"Design\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#dcfce7;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">03<\/span><h3 class=\"emcp-sc__title\">Build<\/h3><p class=\"emcp-sc__text\">Clean, fast code shipped with tests and documentation.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1587093430416-0dc23a0c62c1.jpg\" alt=\"Build\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#101828;color:#ffffff;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">04<\/span><h3 class=\"emcp-sc__title\">Launch<\/h3><p class=\"emcp-sc__text\">We deploy, monitor and iterate with you.<\/p><a class=\"emcp-sc__cta\" href=\"\">Start a project<\/a><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1588783256125-254ebad5ecbe.jpg\" alt=\"Launch\"><\/div><\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3d05fd6 e-flex e-con-full e-con e-child\" data-id=\"3d05fd6\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1932d46 elementor-widget elementor-widget-html\" data-id=\"1932d46\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>.ewd{font:15px\/1.6 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#101828}.ewd a{color:#6a11cb}.ewd h2{font-size:26px;margin:0 0 12px;font-weight:700}.ewd h3{font-size:19px;margin:24px 0 8px;font-weight:700}.ewd p{margin:0 0 12px}.ewd ol,.ewd ul{margin:0 0 14px 22px;padding:0}.ewd li{margin:0 0 6px}.ewd .chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}.ewd .chip{background:#f4ebff;color:#6a11cb;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600}.ewd .chip.dark{background:#101828;color:#fff}.ewd .note{background:#f9fafb;border:1px solid #eaecf0;border-left:4px solid #6a11cb;border-radius:8px;padding:12px 16px;margin:0 0 14px}.ewd table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 24px;border:1px solid #eaecf0}.ewd th{background:#101828;color:#fff;text-align:left;padding:10px 12px;font-weight:600}.ewd td{padding:10px 12px;border-top:1px solid #eaecf0;vertical-align:top}.ewd tr:nth-child(even) td{background:#f9fafb}.ewd code{background:#f2f4f7;border-radius:4px;padding:1px 6px;font-size:12.5px;color:#344054}.ewd .demo-cap{font-size:13px;color:#667085;margin:0 0 10px}.ewd .demo-cap code{color:#6a11cb}.ewd .demo-head{display:flex;align-items:center;gap:10px;margin:0 0 6px}.ewd .demo-head span{background:#6a11cb;color:#fff;border-radius:6px;padding:2px 10px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.ewd .demo-head h3{margin:0}.ewd .top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 10px;font-size:14px}.ewd .top a{text-decoration:none;font-weight:600}<\/style><div class=\"ewd\"><div class=\"demo-head\"><span>Layout<\/span><h3>Text only<\/h3><\/div><p class=\"demo-cap\">Card Layout = <code>text<\/code><\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-74429a8 elementor-widget elementor-widget-emcp_custom_101\" data-id=\"74429a8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"emcp_custom_101.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"emcp-sc emcp-sc--text emcp-sc--scale\"><div class=\"emcp-sc__card\" style=\"background-color:#f4ebff;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">01<\/span><h3 class=\"emcp-sc__title\">Discover<\/h3><p class=\"emcp-sc__text\">We start by understanding your goals, audience and constraints.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1565650839149-2c48a094196c.jpg\" alt=\"Discover\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#e0f2fe;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">02<\/span><h3 class=\"emcp-sc__title\">Design<\/h3><p class=\"emcp-sc__text\">Wireframes become polished, on-brand interfaces.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1575052814086-f385e2e2ad1b.jpg\" alt=\"Design\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#dcfce7;color:#101828;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">03<\/span><h3 class=\"emcp-sc__title\">Build<\/h3><p class=\"emcp-sc__text\">Clean, fast code shipped with tests and documentation.<\/p><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1587093430416-0dc23a0c62c1.jpg\" alt=\"Build\"><\/div><\/div><div class=\"emcp-sc__card\" style=\"background-color:#101828;color:#ffffff;\"><div class=\"emcp-sc__body\"><span class=\"emcp-sc__kicker\">04<\/span><h3 class=\"emcp-sc__title\">Launch<\/h3><p class=\"emcp-sc__text\">We deploy, monitor and iterate with you.<\/p><a class=\"emcp-sc__cta\" href=\"\">Start a project<\/a><\/div><div class=\"emcp-sc__media\"><img decoding=\"async\" src=\"http:\/\/marketplace.emcptools.com\/widgets\/wp-content\/uploads\/2026\/09\/photo-1588783256125-254ebad5ecbe.jpg\" alt=\"Launch\"><\/div><\/div><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-033e83d e-flex e-con-full e-con e-child\" data-id=\"033e83d\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d4f217b elementor-widget elementor-widget-html\" data-id=\"d4f217b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>.ewd{font:15px\/1.6 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#101828}.ewd a{color:#6a11cb}.ewd h2{font-size:26px;margin:0 0 12px;font-weight:700}.ewd h3{font-size:19px;margin:24px 0 8px;font-weight:700}.ewd p{margin:0 0 12px}.ewd ol,.ewd ul{margin:0 0 14px 22px;padding:0}.ewd li{margin:0 0 6px}.ewd .chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}.ewd .chip{background:#f4ebff;color:#6a11cb;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600}.ewd .chip.dark{background:#101828;color:#fff}.ewd .note{background:#f9fafb;border:1px solid #eaecf0;border-left:4px solid #6a11cb;border-radius:8px;padding:12px 16px;margin:0 0 14px}.ewd table{width:100%;border-collapse:collapse;font-size:14px;margin:0 0 24px;border:1px solid #eaecf0}.ewd th{background:#101828;color:#fff;text-align:left;padding:10px 12px;font-weight:600}.ewd td{padding:10px 12px;border-top:1px solid #eaecf0;vertical-align:top}.ewd tr:nth-child(even) td{background:#f9fafb}.ewd code{background:#f2f4f7;border-radius:4px;padding:1px 6px;font-size:12.5px;color:#344054}.ewd .demo-cap{font-size:13px;color:#667085;margin:0 0 10px}.ewd .demo-cap code{color:#6a11cb}.ewd .demo-head{display:flex;align-items:center;gap:10px;margin:0 0 6px}.ewd .demo-head span{background:#6a11cb;color:#fff;border-radius:6px;padding:2px 10px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.ewd .demo-head h3{margin:0}.ewd .top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 10px;font-size:14px}.ewd .top a{text-decoration:none;font-weight:600}<\/style><div class=\"ewd\"><h2>Options reference<\/h2><p>Every control the widget exposes, grouped by panel section. Names in <code>code<\/code> are the setting keys used by the MCP tools (<code>add-free-widget<\/code>, <code>update-widget<\/code>).<\/p><h3 style=\"margin-top:8px\">Content tab<\/h3><p style=\"margin:14px 0 6px;font-weight:700\">Cards<\/p><table><thead><tr><th style=\"width:24%\">Option<\/th><th style=\"width:11%\">Type<\/th><th style=\"width:27%\">Choices \/ range<\/th><th style=\"width:12%\">Default<\/th><th>Notes<\/th><\/tr><\/thead><tbody><tr><td><b>Card Layout<\/b><br><code>layout<\/code><\/td><td>Dropdown<\/td><td>Split (text left, image right), Split reversed, Image cover with text overlay, Text only<\/td><td>split<\/td><td><\/td><\/tr><tr><td><b>Stacking Effect<\/b><br><code>stack_effect<\/code><\/td><td>Dropdown<\/td><td>Scale down previous cards, Offset (peek) previous cards, Plain sticky stack<\/td><td>scale<\/td><td><\/td><\/tr><tr><td><b>Sticky Top Offset<\/b><br><code>top_offset<\/code><\/td><td>Slider<\/td><td>min 0, max 300, px<\/td><td>80<\/td><td><\/td><\/tr><tr><td><b>Peek Step (per card)<\/b><br><code>card_step<\/code><\/td><td>Slider<\/td><td>min 0, max 80, px<\/td><td>24<\/td><td><\/td><\/tr><tr><td><b>Card Min Height<\/b><br><code>min_height<\/code><\/td><td>Slider<\/td><td>min 200, max 900, px\/vh<\/td><td>420<\/td><td>Responsive<\/td><\/tr><tr><td><b>Cards<\/b><br><code>cards<\/code><\/td><td>Repeater<\/td><td><\/td><td>4 items<\/td><td><\/td><\/tr><tr><td>&#8627; <b>Kicker \/ Step<\/b><br><code>kicker<\/code><\/td><td>Text<\/td><td><\/td><td>01<\/td><td><\/td><\/tr><tr><td>&#8627; <b>Title<\/b><br><code>title<\/code><\/td><td>Text<\/td><td><\/td><td>Discover<\/td><td><\/td><\/tr><tr><td>&#8627; <b>Text<\/b><br><code>text<\/code><\/td><td>Textarea<\/td><td><\/td><td>We start by understanding your goals,...<\/td><td><\/td><\/tr><tr><td>&#8627; <b>Image<\/b><br><code>image<\/code><\/td><td>Image<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td>&#8627; <b>Button Text<\/b><br><code>cta_text<\/code><\/td><td>Text<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td>&#8627; <b>Button Link<\/b><br><code>link<\/code><\/td><td>Link<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td>&#8627; <b>Card Background<\/b><br><code>bg<\/code><\/td><td>Color<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td>&#8627; <b>Card Text Color<\/b><br><code>color<\/code><\/td><td>Color<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Title Tag<\/b><br><code>title_tag<\/code><\/td><td>Dropdown<\/td><td>H2, H3, H4<\/td><td>h3<\/td><td><\/td><\/tr><\/tbody><\/table><h3 style=\"margin-top:8px\">Style tab<\/h3><p style=\"margin:14px 0 6px;font-weight:700\">Card<\/p><table><thead><tr><th style=\"width:24%\">Option<\/th><th style=\"width:11%\">Type<\/th><th style=\"width:27%\">Choices \/ range<\/th><th style=\"width:12%\">Default<\/th><th>Notes<\/th><\/tr><\/thead><tbody><tr><td><b>Radius<\/b><br><code>radius<\/code><\/td><td>Slider<\/td><td>min 0, max 80, px<\/td><td>24<\/td><td><\/td><\/tr><tr><td><b>Padding<\/b><br><code>pad<\/code><\/td><td>Dimensions<\/td><td><\/td><td><\/td><td>Responsive<\/td><\/tr><tr><td><b>Border<\/b><br><code>border<\/code><\/td><td>Border<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Box Shadow<\/b><br><code>shadow<\/code><\/td><td>Box shadow<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Spacing Between Cards (scroll length)<\/b><br><code>gap<\/code><\/td><td>Slider<\/td><td>min 0, max 200, px\/vh<\/td><td>40<\/td><td><\/td><\/tr><tr><td><b>Default Card Background<\/b><br><code>default_bg<\/code><\/td><td>Color<\/td><td><\/td><td>#f2f4f7<\/td><td><\/td><\/tr><tr><td><b>Default Text Color<\/b><br><code>default_color<\/code><\/td><td>Color<\/td><td><\/td><td>#101828<\/td><td><\/td><\/tr><tr><td><b>Cover Overlay<\/b><br><code>cover_overlay<\/code><\/td><td>Color<\/td><td><\/td><td>rgba(16,24,40,.5)<\/td><td><\/td><\/tr><\/tbody><\/table><p style=\"margin:14px 0 6px;font-weight:700\">Typography<\/p><table><thead><tr><th style=\"width:24%\">Option<\/th><th style=\"width:11%\">Type<\/th><th style=\"width:27%\">Choices \/ range<\/th><th style=\"width:12%\">Default<\/th><th>Notes<\/th><\/tr><\/thead><tbody><tr><td><b>Kicker Typography<\/b><br><code>kicker_typo<\/code><\/td><td>Typography<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Kicker Color<\/b><br><code>kicker_color<\/code><\/td><td>Color<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Title Typography<\/b><br><code>title_typo<\/code><\/td><td>Typography<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Text Typography<\/b><br><code>text_typo<\/code><\/td><td>Typography<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Text Spacing<\/b><br><code>text_gap<\/code><\/td><td>Slider<\/td><td>min 0, max 60, px<\/td><td>14<\/td><td><\/td><\/tr><tr><td><b>Button Typography<\/b><br><code>btn_typo<\/code><\/td><td>Typography<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Button Text<\/b><br><code>btn_color<\/code><\/td><td>Color<\/td><td><\/td><td>#ffffff<\/td><td><\/td><\/tr><tr><td><b>Button Background<\/b><br><code>btn_bg<\/code><\/td><td>Color<\/td><td><\/td><td>#6a11cb<\/td><td><\/td><\/tr><tr><td><b>Button Hover Text<\/b><br><code>btn_color_h<\/code><\/td><td>Color<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Button Hover Background<\/b><br><code>btn_bg_h<\/code><\/td><td>Color<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Button Radius<\/b><br><code>btn_radius<\/code><\/td><td>Slider<\/td><td>min 0, max 60, px<\/td><td>10<\/td><td><\/td><\/tr><tr><td><b>Button Padding<\/b><br><code>btn_pad<\/code><\/td><td>Dimensions<\/td><td><\/td><td><\/td><td><\/td><\/tr><\/tbody><\/table><p style=\"margin:14px 0 6px;font-weight:700\">Image<\/p><table><thead><tr><th style=\"width:24%\">Option<\/th><th style=\"width:11%\">Type<\/th><th style=\"width:27%\">Choices \/ range<\/th><th style=\"width:12%\">Default<\/th><th>Notes<\/th><\/tr><\/thead><tbody><tr><td><b>Image Column Width<\/b><br><code>img_w<\/code><\/td><td>Slider<\/td><td>min 20, max 70, %<\/td><td>50<\/td><td>Responsive<\/td><\/tr><tr><td><b>Image Radius (split)<\/b><br><code>img_radius<\/code><\/td><td>Slider<\/td><td>min 0, max 60, px<\/td><td>16<\/td><td><\/td><\/tr><tr><td><b>Image Inset (split)<\/b><br><code>img_pad<\/code><\/td><td>Slider<\/td><td>min 0, max 80, px<\/td><td>24<\/td><td><\/td><\/tr><tr><td><b>Image Filters<\/b><br><code>img_filter<\/code><\/td><td>Css_filter<\/td><td><\/td><td><\/td><td><\/td><\/tr><\/tbody><\/table><h3>Add it with the MCP tools<\/h3><p>Any connected agent can place this widget: call <code>add-free-widget<\/code> with <code>widget_type: \"emcp_custom_101\"<\/code> and a <code>settings<\/code> object using the keys above. Run <code>get-custom-widget<\/code> with id <code>101<\/code> for the full JSON spec.<\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>&larr; All widgetsWidget 101 &middot; emcp_custom_101 Stacked Cards Elementor widget4 layouts7 content options24 style options4 panel sections Built with the EMCP Widget Builder and registered under the EMCP Custom category of the Elementor panel. Search the panel for: stacked, cards, sticky, scroll, stack, parallax. Setup guide Open a page in Elementor, search the panel for [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-5400","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/pages\/5400","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/comments?post=5400"}],"version-history":[{"count":22,"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/pages\/5400\/revisions"}],"predecessor-version":[{"id":6269,"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/pages\/5400\/revisions\/6269"}],"wp:attachment":[{"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/media?parent=5400"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}