{"id":4048,"date":"2026-09-20T20:20:32","date_gmt":"2026-09-20T20:20:32","guid":{"rendered":"https:\/\/marketplace.emcptools.com\/widgets\/content-toggle\/"},"modified":"2026-09-21T17:37:04","modified_gmt":"2026-09-21T17:37:04","slug":"content-toggle","status":"publish","type":"page","link":"https:\/\/marketplace.emcptools.com\/widgets\/content-toggle\/","title":{"rendered":"Content Toggle"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"4048\" class=\"elementor elementor-4048\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8246d6b e-flex e-con-boxed e-con e-parent\" data-id=\"8246d6b\" 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-dd8aee2 e-flex e-con-full e-con e-child\" data-id=\"dd8aee2\" 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-b9e66f2 elementor-widget elementor-widget-html\" data-id=\"b9e66f2\" 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 94 &middot; <code>emcp_custom_94<\/code><\/span><\/div><h2 style=\"font-size:36px;margin-bottom:8px\">Content Toggle<\/h2><div class=\"chips\"><span class=\"chip dark\">Elementor widget<\/span><span class=\"chip\">4 layouts<\/span><span class=\"chip\">10 content options<\/span><span class=\"chip\">28 style options<\/span><span class=\"chip\">3 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: toggle, switch, content, primary, secondary, tabs.<\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4e37486 e-flex e-con-full e-con e-child\" data-id=\"4e37486\" 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-6bc9d2e elementor-widget elementor-widget-html\" data-id=\"6bc9d2e\" 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>Content Toggle<\/b> and drag it into a container.<\/li><li><b>Content &rsaquo; Toggle<\/b>: Switch Style, Active by Default, Switch Alignment, Label, Icon, Content, Label, Icon and 2 more.<\/li><li>Pick a <b>Switch Style<\/b>: Switch (labels either side), Pill buttons, Underlined tabs, Boxed tabs. Each one is shown below.<\/li><li><b>Style tab<\/b> sections: Switch, Content. 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-7442294 e-flex e-con-full e-con e-child\" data-id=\"7442294\" 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-5ab8cda elementor-widget elementor-widget-html\" data-id=\"5ab8cda\" 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>Switch (labels either side)<\/h3><\/div><p class=\"demo-cap\">Switch Style = <code>switch<\/code><\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b9c53fd elementor-widget elementor-widget-emcp_custom_94\" data-id=\"b9c53fd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"emcp_custom_94.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"emcp-ct emcp-ct--switch emcp-ct--anim-fade is-primary\"><div class=\"emcp-ct__bar\" role=\"tablist\"><button type=\"button\" class=\"emcp-ct__lbl emcp-ct__lbl--primary\" data-target=\"primary\" role=\"tab\"><span class=\"emcp-ct__ico\"><\/span>Monthly<\/button><button type=\"button\" class=\"emcp-ct__track\" aria-label=\"Toggle content\"><span class=\"emcp-ct__knob\"><\/span><\/button><button type=\"button\" class=\"emcp-ct__lbl emcp-ct__lbl--secondary\" data-target=\"secondary\" role=\"tab\"><span class=\"emcp-ct__ico\"><\/span>Yearly<\/button><\/div><div class=\"emcp-ct__panes\"><div class=\"emcp-ct__pane emcp-ct__pane--primary\" role=\"tabpanel\"><p><strong>$19 \/ month.<\/strong> Cancel anytime. Billed monthly.<\/p><\/div><div class=\"emcp-ct__pane emcp-ct__pane--secondary\" role=\"tabpanel\"><p><strong>$180 \/ year.<\/strong> Two months free compared to monthly.<\/p><\/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-82ccf33 e-flex e-con-full e-con e-child\" data-id=\"82ccf33\" 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-f65ca79 elementor-widget elementor-widget-html\" data-id=\"f65ca79\" 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>Pill buttons<\/h3><\/div><p class=\"demo-cap\">Switch Style = <code>pills<\/code><\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-98c9067 elementor-widget elementor-widget-emcp_custom_94\" data-id=\"98c9067\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"emcp_custom_94.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"emcp-ct emcp-ct--pills emcp-ct--anim-fade is-primary\"><div class=\"emcp-ct__bar\" role=\"tablist\"><button type=\"button\" class=\"emcp-ct__lbl emcp-ct__lbl--primary\" data-target=\"primary\" role=\"tab\"><span class=\"emcp-ct__ico\"><\/span>Monthly<\/button><button type=\"button\" class=\"emcp-ct__track\" aria-label=\"Toggle content\"><span class=\"emcp-ct__knob\"><\/span><\/button><button type=\"button\" class=\"emcp-ct__lbl emcp-ct__lbl--secondary\" data-target=\"secondary\" role=\"tab\"><span class=\"emcp-ct__ico\"><\/span>Yearly<\/button><\/div><div class=\"emcp-ct__panes\"><div class=\"emcp-ct__pane emcp-ct__pane--primary\" role=\"tabpanel\"><p><strong>$19 \/ month.<\/strong> Cancel anytime. Billed monthly.<\/p><\/div><div class=\"emcp-ct__pane emcp-ct__pane--secondary\" role=\"tabpanel\"><p><strong>$180 \/ year.<\/strong> Two months free compared to monthly.<\/p><\/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-7d5ce92 e-flex e-con-full e-con e-child\" data-id=\"7d5ce92\" 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-e8ca351 elementor-widget elementor-widget-html\" data-id=\"e8ca351\" 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>Underlined tabs<\/h3><\/div><p class=\"demo-cap\">Switch Style = <code>underline<\/code><\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ff43be5 elementor-widget elementor-widget-emcp_custom_94\" data-id=\"ff43be5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"emcp_custom_94.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"emcp-ct emcp-ct--underline emcp-ct--anim-fade is-primary\"><div class=\"emcp-ct__bar\" role=\"tablist\"><button type=\"button\" class=\"emcp-ct__lbl emcp-ct__lbl--primary\" data-target=\"primary\" role=\"tab\"><span class=\"emcp-ct__ico\"><\/span>Monthly<\/button><button type=\"button\" class=\"emcp-ct__track\" aria-label=\"Toggle content\"><span class=\"emcp-ct__knob\"><\/span><\/button><button type=\"button\" class=\"emcp-ct__lbl emcp-ct__lbl--secondary\" data-target=\"secondary\" role=\"tab\"><span class=\"emcp-ct__ico\"><\/span>Yearly<\/button><\/div><div class=\"emcp-ct__panes\"><div class=\"emcp-ct__pane emcp-ct__pane--primary\" role=\"tabpanel\"><p><strong>$19 \/ month.<\/strong> Cancel anytime. Billed monthly.<\/p><\/div><div class=\"emcp-ct__pane emcp-ct__pane--secondary\" role=\"tabpanel\"><p><strong>$180 \/ year.<\/strong> Two months free compared to monthly.<\/p><\/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-bfcff0f e-flex e-con-full e-con e-child\" data-id=\"bfcff0f\" 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-13f86df elementor-widget elementor-widget-html\" data-id=\"13f86df\" 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>Boxed tabs<\/h3><\/div><p class=\"demo-cap\">Switch Style = <code>boxed<\/code><\/p><\/div>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-d174ba2 elementor-widget elementor-widget-emcp_custom_94\" data-id=\"d174ba2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"emcp_custom_94.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"emcp-ct emcp-ct--boxed emcp-ct--anim-fade is-primary\"><div class=\"emcp-ct__bar\" role=\"tablist\"><button type=\"button\" class=\"emcp-ct__lbl emcp-ct__lbl--primary\" data-target=\"primary\" role=\"tab\"><span class=\"emcp-ct__ico\"><\/span>Monthly<\/button><button type=\"button\" class=\"emcp-ct__track\" aria-label=\"Toggle content\"><span class=\"emcp-ct__knob\"><\/span><\/button><button type=\"button\" class=\"emcp-ct__lbl emcp-ct__lbl--secondary\" data-target=\"secondary\" role=\"tab\"><span class=\"emcp-ct__ico\"><\/span>Yearly<\/button><\/div><div class=\"emcp-ct__panes\"><div class=\"emcp-ct__pane emcp-ct__pane--primary\" role=\"tabpanel\"><p><strong>$19 \/ month.<\/strong> Cancel anytime. Billed monthly.<\/p><\/div><div class=\"emcp-ct__pane emcp-ct__pane--secondary\" role=\"tabpanel\"><p><strong>$180 \/ year.<\/strong> Two months free compared to monthly.<\/p><\/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-7395fc3 e-flex e-con-full e-con e-child\" data-id=\"7395fc3\" 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-1d334b4 elementor-widget elementor-widget-html\" data-id=\"1d334b4\" 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\">Toggle<\/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>Switch Style<\/b><br><code>style<\/code><\/td><td>Dropdown<\/td><td>Switch (labels either side), Pill buttons, Underlined tabs, Boxed tabs<\/td><td>switch<\/td><td><\/td><\/tr><tr><td><b>Active by Default<\/b><br><code>active<\/code><\/td><td>Dropdown<\/td><td>Primary, Secondary<\/td><td>primary<\/td><td><\/td><\/tr><tr><td><b>Switch Alignment<\/b><br><code>align<\/code><\/td><td>Button group<\/td><td>Left, Center, Right<\/td><td>center<\/td><td>Responsive<\/td><\/tr><tr><td><b>Label<\/b><br><code>primary_label<\/code><\/td><td>Text<\/td><td><\/td><td>Monthly<\/td><td><\/td><\/tr><tr><td><b>Icon<\/b><br><code>primary_icon<\/code><\/td><td>Icon<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Content<\/b><br><code>primary_content<\/code><\/td><td>Rich text<\/td><td><\/td><td>Primary content goes here.<\/td><td><\/td><\/tr><tr><td><b>Label<\/b><br><code>secondary_label<\/code><\/td><td>Text<\/td><td><\/td><td>Yearly<\/td><td><\/td><\/tr><tr><td><b>Icon<\/b><br><code>secondary_icon<\/code><\/td><td>Icon<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Content<\/b><br><code>secondary_content<\/code><\/td><td>Rich text<\/td><td><\/td><td>Secondary content goes here.<\/td><td><\/td><\/tr><tr><td><b>Content Transition<\/b><br><code>anim_style<\/code><\/td><td>Dropdown<\/td><td>None, Fade, Slide up<\/td><td>fade<\/td><td><\/td><\/tr><\/tbody><\/table><h3 style=\"margin-top:8px\">Style tab<\/h3><p style=\"margin:14px 0 6px;font-weight:700\">Switch<\/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>Label Typography<\/b><br><code>sw_typo<\/code><\/td><td>Typography<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Label Color<\/b><br><code>sw_color<\/code><\/td><td>Color<\/td><td><\/td><td>#667085<\/td><td><\/td><\/tr><tr><td><b>Active Label Color<\/b><br><code>sw_color_a<\/code><\/td><td>Color<\/td><td><\/td><td>#101828<\/td><td><\/td><\/tr><tr><td><b>Active Label on Filled Tab (boxed)<\/b><br><code>sw_color_a_fill<\/code><\/td><td>Color<\/td><td><\/td><td>#ffffff<\/td><td>Shown when style = boxed<\/td><\/tr><tr><td><b>Label Background<\/b><br><code>sw_bg<\/code><\/td><td>Color<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Active Label Background<\/b><br><code>sw_bg_a<\/code><\/td><td>Color<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Label Padding<\/b><br><code>sw_pad<\/code><\/td><td>Dimensions<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Label Radius<\/b><br><code>sw_radius<\/code><\/td><td>Slider<\/td><td>min 0, max 60, px<\/td><td><\/td><td><\/td><\/tr><tr><td><b>Label Border<\/b><br><code>sw_border<\/code><\/td><td>Border<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Gap<\/b><br><code>sw_gap<\/code><\/td><td>Slider<\/td><td>min 0, max 60, px<\/td><td>12<\/td><td><\/td><\/tr><tr><td><b>Icon Size<\/b><br><code>icon_size<\/code><\/td><td>Slider<\/td><td>min 8, max 60, px<\/td><td>16<\/td><td><\/td><\/tr><tr><td><b>Track Color<\/b><br><code>track_off<\/code><\/td><td>Color<\/td><td><\/td><td>#c7ccd6<\/td><td><\/td><\/tr><tr><td><b>Track Color (secondary active)<\/b><br><code>track_on<\/code><\/td><td>Color<\/td><td><\/td><td>#6a11cb<\/td><td><\/td><\/tr><tr><td><b>Knob Color<\/b><br><code>knob<\/code><\/td><td>Color<\/td><td><\/td><td>#ffffff<\/td><td><\/td><\/tr><tr><td><b>Track Width<\/b><br><code>track_w<\/code><\/td><td>Slider<\/td><td>min 30, max 120, px<\/td><td>52<\/td><td><\/td><\/tr><tr><td><b>Track Height<\/b><br><code>track_h<\/code><\/td><td>Slider<\/td><td>min 16, max 60, px<\/td><td>28<\/td><td><\/td><\/tr><tr><td><b>Bar Background (Pills\/Boxed)<\/b><br><code>bar_bg<\/code><\/td><td>Color<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Bar Padding<\/b><br><code>bar_pad<\/code><\/td><td>Dimensions<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Bar Radius<\/b><br><code>bar_radius<\/code><\/td><td>Slider<\/td><td>min 0, max 60, px<\/td><td><\/td><td><\/td><\/tr><tr><td><b>Space Below Switch<\/b><br><code>bar_mb<\/code><\/td><td>Slider<\/td><td>min 0, max 100, px<\/td><td>24<\/td><td><\/td><\/tr><\/tbody><\/table><p style=\"margin:14px 0 6px;font-weight:700\">Content<\/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>Typography<\/b><br><code>c_typo<\/code><\/td><td>Typography<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Text Color<\/b><br><code>c_color<\/code><\/td><td>Color<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Text Align<\/b><br><code>c_align<\/code><\/td><td>Button group<\/td><td>Left, Center, Right<\/td><td><\/td><td>Responsive<\/td><\/tr><tr><td><b>Background<\/b><br><code>c_bg<\/code><\/td><td>Background<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Padding<\/b><br><code>c_pad<\/code><\/td><td>Dimensions<\/td><td><\/td><td><\/td><td>Responsive<\/td><\/tr><tr><td><b>Border<\/b><br><code>c_border<\/code><\/td><td>Border<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Border Radius<\/b><br><code>c_radius<\/code><\/td><td>Dimensions<\/td><td><\/td><td><\/td><td><\/td><\/tr><tr><td><b>Box Shadow<\/b><br><code>c_shadow<\/code><\/td><td>Box shadow<\/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_94\"<\/code> and a <code>settings<\/code> object using the keys above. Run <code>get-custom-widget<\/code> with id <code>94<\/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 94 &middot; emcp_custom_94 Content Toggle Elementor widget4 layouts10 content options28 style options3 panel sections Built with the EMCP Widget Builder and registered under the EMCP Custom category of the Elementor panel. Search the panel for: toggle, switch, content, primary, secondary, tabs. 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-4048","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/pages\/4048","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=4048"}],"version-history":[{"count":22,"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/pages\/4048\/revisions"}],"predecessor-version":[{"id":6325,"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/pages\/4048\/revisions\/6325"}],"wp:attachment":[{"href":"https:\/\/marketplace.emcptools.com\/widgets\/wp-json\/wp\/v2\/media?parent=4048"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}