{"id":8473,"date":"2024-06-17T16:54:39","date_gmt":"2024-06-17T16:54:39","guid":{"rendered":"https:\/\/www.kadencewp.com\/help-center\/?post_type=docs&#038;p=8473"},"modified":"2026-04-22T16:31:52","modified_gmt":"2026-04-22T16:31:52","password":"","slug":"tooltips-kadence-blocks","status":"publish","type":"docs","link":"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-blocks\/tooltips-kadence-blocks\/","title":{"rendered":"Using Tooltips with Kadence Blocks"},"content":{"rendered":"<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_c53894-05, .wp-block-kadence-advancedheading.kt-adv-heading8473_c53894-05[data-kb-block=\"kb-adv-heading8473_c53894-05\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_c53894-05 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_c53894-05[data-kb-block=\"kb-adv-heading8473_c53894-05\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_c53894-05 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_c53894-05[data-kb-block=\"kb-adv-heading8473_c53894-05\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading8473_c53894-05 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_c53894-05\">Kadence Blocks offers a powerful feature that allows you to add tooltips to texts, icons, and buttons across your website. <strong>Tooltips<\/strong> are small pop-up boxes that appear when a user hovers over a target, providing additional information or tips related to that text\/target. This functionality is particularly useful for defining terminology, offering extra details, or providing supplementary information without cluttering your content. <\/p>\n\n\n<style>.kb-table-of-content-nav.kb-table-of-content-id8473_bd42bb-1a .kb-table-of-content-wrap{padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-right:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);padding-left:var(--global-kb-spacing-sm, 1.5rem);}.kb-table-of-content-nav.kb-table-of-content-id8473_bd42bb-1a .kb-table-of-contents-title-wrap{padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.kb-table-of-content-nav.kb-table-of-content-id8473_bd42bb-1a .kb-table-of-contents-title{font-weight:regular;font-style:normal;}.kb-table-of-content-nav.kb-table-of-content-id8473_bd42bb-1a .kb-table-of-content-wrap .kb-table-of-content-list{font-weight:regular;font-style:normal;margin-top:var(--global-kb-spacing-sm, 1.5rem);margin-right:0px;margin-bottom:0px;margin-left:0px;}<\/style>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_c4d1a5-c9, .wp-block-kadence-advancedheading.kt-adv-heading8473_c4d1a5-c9[data-kb-block=\"kb-adv-heading8473_c4d1a5-c9\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_c4d1a5-c9 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_c4d1a5-c9[data-kb-block=\"kb-adv-heading8473_c4d1a5-c9\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_c4d1a5-c9 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_c4d1a5-c9[data-kb-block=\"kb-adv-heading8473_c4d1a5-c9\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading8473_c4d1a5-c9 wp-block-kadence-advancedheading has-theme-palette-8-background-color has-background\" data-kb-block=\"kb-adv-heading8473_c4d1a5-c9\"><em>Tooltips are a great way to provide context and help users understand a specific text on your website. This feature enhances user experience without impacting search engine results, either positively or negatively. Therefore, tooltips should be used primarily to improve the overall user experience rather than for SEO purposes.<\/em><\/p>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_280ddc-83, .wp-block-kadence-advancedheading.kt-adv-heading8473_280ddc-83[data-kb-block=\"kb-adv-heading8473_280ddc-83\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_280ddc-83 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_280ddc-83[data-kb-block=\"kb-adv-heading8473_280ddc-83\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_280ddc-83 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_280ddc-83[data-kb-block=\"kb-adv-heading8473_280ddc-83\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 class=\"kt-adv-heading8473_280ddc-83 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_280ddc-83\">Adding Tooltips to Kadence Blocks<\/h2>\n\n\n\n<p>You can add <strong>Tooltips<\/strong> to supported blocks using the <strong>Block<\/strong> <strong>Toolbar<\/strong>. <br><br>Tooltips are available for the following <strong>Kadence Blocks<\/strong>:<br>&#8211;<a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-blocks\/advanced-heading-block\/\" target=\"_blank\" rel=\"noreferrer noopener\">Text (Adv) Block<\/a><br>&#8211;<a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-blocks\/advanced-buttons\/\" target=\"_blank\" rel=\"noreferrer noopener\">Button (Adv) Block<\/a><br>&#8211;<a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-blocks\/advanced-icon-block-2\/\">Icon Block<\/a><br>&#8211;<a href=\"https:\/\/www.kadencewp.com\/help-center\/docs\/kadence-blocks\/icon-list-block\/\" target=\"_blank\" rel=\"noreferrer noopener\">Icon List Block<\/a><\/p>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_545996-26, .wp-block-kadence-advancedheading.kt-adv-heading8473_545996-26[data-kb-block=\"kb-adv-heading8473_545996-26\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_545996-26 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_545996-26[data-kb-block=\"kb-adv-heading8473_545996-26\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_545996-26 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_545996-26[data-kb-block=\"kb-adv-heading8473_545996-26\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h3 class=\"kt-adv-heading8473_545996-26 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_545996-26\">Text (Adv) Block Tooltips<\/h3>\n\n\n\n<p>Start by highlighting the text you want to provide the Tooltip for, then in the Block Toolbar click the downward arrow at the far right to open <strong><em><span style=\"text-decoration: underline\">more<\/span><\/em><\/strong> settings. From the expanded settings, select the Tooltip effect to enable the Tooltip for your highlighted text. This simple process allows you to enhance your content with helpful tooltips.<\/p>\n\n\n<style>.kb-row-layout-id8473_1032ce-4f > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id8473_1032ce-4f > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id8473_1032ce-4f > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:repeat(2, minmax(0, 1fr));}.kb-row-layout-id8473_1032ce-4f > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id8473_1032ce-4f > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id8473_1032ce-4f > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id8473_1032ce-4f alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column8473_25158f-a7 > .kt-inside-inner-col,.kadence-column8473_25158f-a7 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_25158f-a7 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_25158f-a7 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_25158f-a7 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_25158f-a7 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_25158f-a7{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_25158f-a7 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_25158f-a7 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_25158f-a7\"><div class=\"kt-inside-inner-col\"><style>.kb-image8473_59018f-0f.kb-image-is-ratio-size, .kb-image8473_59018f-0f .kb-image-is-ratio-size{max-width:457px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_59018f-0f.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_59018f-0f .kb-image-is-ratio-size{align-self:unset;}.kb-image8473_59018f-0f figure{max-width:457px;}.kb-image8473_59018f-0f .image-is-svg, .kb-image8473_59018f-0f .image-is-svg img{width:100%;}.kb-image8473_59018f-0f .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_59018f-0f\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"926\" height=\"668\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Adding-Tooltips.gif\" alt=\"Adding Tooltips to an Advanced text Block\" class=\"kb-img wp-image-8475\" \/><\/figure><\/div>\n<\/div><\/div>\n\n\n<style>.kadence-column8473_2411fe-95 > .kt-inside-inner-col,.kadence-column8473_2411fe-95 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_2411fe-95 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_2411fe-95 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_2411fe-95 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_2411fe-95 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_2411fe-95{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_2411fe-95 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_2411fe-95 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_2411fe-95\"><div class=\"kt-inside-inner-col\"><style>.kb-image8473_21a2ce-0f .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_21a2ce-0f\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"770\" height=\"509\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Tooltips-Demonstration.gif\" alt=\"Tooltips Demonstration\" class=\"kb-img wp-image-8476\" \/><\/figure><\/div>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_a9fe08-b3, .wp-block-kadence-advancedheading.kt-adv-heading8473_a9fe08-b3[data-kb-block=\"kb-adv-heading8473_a9fe08-b3\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_a9fe08-b3 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_a9fe08-b3[data-kb-block=\"kb-adv-heading8473_a9fe08-b3\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_a9fe08-b3 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_a9fe08-b3[data-kb-block=\"kb-adv-heading8473_a9fe08-b3\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h3 class=\"kt-adv-heading8473_a9fe08-b3 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_a9fe08-b3\">Icon Block Tooltips<\/h3>\n\n\n\n<p>Start by selecting the Icon in the Block Editor. From the Block Toolbar, click on the <em>Bubble<\/em> <em>Icon<\/em> to access the Icon Tooltips Settings.<\/p>\n\n\n<style>.kb-row-layout-id8473_e3f66b-4d > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id8473_e3f66b-4d > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id8473_e3f66b-4d > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:repeat(2, minmax(0, 1fr));}.kb-row-layout-id8473_e3f66b-4d > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id8473_e3f66b-4d > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id8473_e3f66b-4d > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id8473_e3f66b-4d alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column8473_8c6196-56 > .kt-inside-inner-col,.kadence-column8473_8c6196-56 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_8c6196-56 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_8c6196-56 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_8c6196-56 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_8c6196-56 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_8c6196-56{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_8c6196-56 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_8c6196-56 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_8c6196-56\"><div class=\"kt-inside-inner-col\"><style>.kb-image8473_09110b-72 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image8473_09110b-72 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"513\" height=\"411\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Icon-Tooltip-Gif-1.gif\" alt=\"Icon Tooltip Gif 1\" class=\"kb-img wp-image-8491\" \/><\/figure>\n<\/div><\/div>\n\n\n<style>.kadence-column8473_723823-cb > .kt-inside-inner-col,.kadence-column8473_723823-cb > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_723823-cb > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_723823-cb > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_723823-cb > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_723823-cb > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_723823-cb{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_723823-cb > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_723823-cb > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_723823-cb\"><div class=\"kt-inside-inner-col\"><style>.kb-image8473_e8f001-29 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_e8f001-29\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"359\" height=\"331\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Icon-Tooltip-Gif-2.gif\" alt=\"Icon Tooltip Gif 2\" class=\"kb-img wp-image-8492\" \/><\/figure><\/div>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_b96262-47, .wp-block-kadence-advancedheading.kt-adv-heading8473_b96262-47[data-kb-block=\"kb-adv-heading8473_b96262-47\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_b96262-47 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_b96262-47[data-kb-block=\"kb-adv-heading8473_b96262-47\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_b96262-47 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_b96262-47[data-kb-block=\"kb-adv-heading8473_b96262-47\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h3 class=\"kt-adv-heading8473_b96262-47 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_b96262-47\">Icon List Block Tooltips<\/h3>\n\n\n\n<p>Start by selecting the Icon List Item in the Block Editor. From the Block Toolbar, click on the <em>Bubble<\/em> <em>Icon<\/em> to access the Icon List Item Tooltips Settings.<\/p>\n\n\n<style>.kb-row-layout-id8473_60e4b7-e0 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id8473_60e4b7-e0 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id8473_60e4b7-e0 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:repeat(2, minmax(0, 1fr));}.kb-row-layout-id8473_60e4b7-e0 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id8473_60e4b7-e0 > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id8473_60e4b7-e0 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id8473_60e4b7-e0 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column8473_9861f8-d1 > .kt-inside-inner-col,.kadence-column8473_9861f8-d1 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_9861f8-d1 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_9861f8-d1 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_9861f8-d1 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_9861f8-d1 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_9861f8-d1{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_9861f8-d1 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_9861f8-d1 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_9861f8-d1\"><div class=\"kt-inside-inner-col\"><style>.kb-image8473_a5e584-4e .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image8473_a5e584-4e\"><img loading=\"lazy\" decoding=\"async\" width=\"630\" height=\"443\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Icon-List-Gif-1.gif\" alt=\"Icon List Tooltip 1\" class=\"kb-img wp-image-8497\" \/><\/figure>\n<\/div><\/div>\n\n\n<style>.kadence-column8473_8e3ab1-49 > .kt-inside-inner-col,.kadence-column8473_8e3ab1-49 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_8e3ab1-49 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_8e3ab1-49 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_8e3ab1-49 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_8e3ab1-49 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_8e3ab1-49{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_8e3ab1-49 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_8e3ab1-49 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_8e3ab1-49\"><div class=\"kt-inside-inner-col\"><style>.kb-image8473_4ef708-c8 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_4ef708-c8\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"300\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Icon-List-Gif-2.gif\" alt=\"Icon List Tooltip 2\" class=\"kb-img wp-image-8498\" \/><\/figure><\/div>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_63e586-4a, .wp-block-kadence-advancedheading.kt-adv-heading8473_63e586-4a[data-kb-block=\"kb-adv-heading8473_63e586-4a\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_63e586-4a mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_63e586-4a[data-kb-block=\"kb-adv-heading8473_63e586-4a\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_63e586-4a img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_63e586-4a[data-kb-block=\"kb-adv-heading8473_63e586-4a\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h3 class=\"kt-adv-heading8473_63e586-4a wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_63e586-4a\">Button (Adv) Tooltips<\/h3>\n\n\n\n<p>Start by selecting the Advanced Button in the Block Editor. From the Block Toolbar, click on the <em>Bubble<\/em> <em>Icon<\/em> to access the Button Tooltips Settings. <\/p>\n\n\n<style>.kb-row-layout-id8473_60c45a-89 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id8473_60c45a-89 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id8473_60c45a-89 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:repeat(2, minmax(0, 1fr));}.kb-row-layout-id8473_60c45a-89 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id8473_60c45a-89 > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id8473_60c45a-89 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id8473_60c45a-89 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column8473_25b3f0-08 > .kt-inside-inner-col,.kadence-column8473_25b3f0-08 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_25b3f0-08 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_25b3f0-08 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_25b3f0-08 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_25b3f0-08 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_25b3f0-08{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_25b3f0-08 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_25b3f0-08 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_25b3f0-08\"><div class=\"kt-inside-inner-col\"><style>.kb-image8473_96b0a5-a3 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image8473_96b0a5-a3 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"678\" height=\"430\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Button-Tooltip-Gif-1.gif\" alt=\"Button Tooltip Gif 1\" class=\"kb-img wp-image-8493\" \/><\/figure>\n<\/div><\/div>\n\n\n<style>.kadence-column8473_753e7a-60 > .kt-inside-inner-col,.kadence-column8473_753e7a-60 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_753e7a-60 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_753e7a-60 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_753e7a-60 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_753e7a-60 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_753e7a-60{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_753e7a-60 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_753e7a-60 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_753e7a-60\"><div class=\"kt-inside-inner-col\"><style>.kb-image8473_007f72-9b .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_007f72-9b\"><figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"300\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Button-Tooltip-Gif-2.gif\" alt=\"Button Tooltip Gif 2\" class=\"kb-img wp-image-8495\" \/><\/figure><\/div>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_2c4c0c-01, .wp-block-kadence-advancedheading.kt-adv-heading8473_2c4c0c-01[data-kb-block=\"kb-adv-heading8473_2c4c0c-01\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_2c4c0c-01 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_2c4c0c-01[data-kb-block=\"kb-adv-heading8473_2c4c0c-01\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_2c4c0c-01 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_2c4c0c-01[data-kb-block=\"kb-adv-heading8473_2c4c0c-01\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 id=\"controling-tooltip-overlap-with-z-Index\" class=\"kt-adv-heading8473_2c4c0c-01 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_2c4c0c-01\">Controlling Tooltip Overlap with Z-Index<\/h2>\n\n\n\n<p>When adding tooltips to your designs, it\u2019s important to understand how they layer on top of surrounding content. By default, Tooltips are contained within the same section as the parent container they\u2019re inside of. For example, a Section Block. This ensures accessibility, since screen readers can only recognize and announce the Tooltip if it\u2019s bound to its parent container. If tooltips were automatically moved outside of that container, assistive technologies would skip over the content entirely.<br><br>Because of this container-based approach, you may need to adjust <strong>z-index values<\/strong> so Tooltips display correctly when overlapping nearby sections.<br><br><strong>For example:<br><\/strong>Imagine you have two sections side by side.<br>A tooltip in the <strong>left section<\/strong> opens toward the right, but it needs to overlap the <strong>right section<\/strong>. <em>(See the example below.)<\/em><\/p>\n\n\n<style>.kb-image8473_50c99c-0e.kb-image-is-ratio-size, .kb-image8473_50c99c-0e .kb-image-is-ratio-size{max-width:547px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_50c99c-0e.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_50c99c-0e .kb-image-is-ratio-size{align-self:unset;}.kb-image8473_50c99c-0e figure{max-width:547px;}.kb-image8473_50c99c-0e .image-is-svg, .kb-image8473_50c99c-0e .image-is-svg img{width:100%;}.kb-image8473_50c99c-0e .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_50c99c-0e\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"832\" height=\"585\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Overlap-example.gif\" alt=\"Overlap example\" class=\"kb-img wp-image-14775\" \/><\/figure><\/div>\n\n\n\n<p><br>Within the main parent Section Block, you can use <strong>Block Settings \u2192 Advanced Tab \u2192 Structure Settings<\/strong> to set the <strong>left section<\/strong> to a z-index of <code>2<\/code> and the <strong>right section<\/strong> to <code>1<\/code>. This gives the left section a higher stacking order, allowing its tooltip to overlap the right section successfully.<\/p>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_d2522d-b1, .wp-block-kadence-advancedheading.kt-adv-heading8473_d2522d-b1[data-kb-block=\"kb-adv-heading8473_d2522d-b1\"]{margin-bottom:0px;font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_d2522d-b1 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_d2522d-b1[data-kb-block=\"kb-adv-heading8473_d2522d-b1\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_d2522d-b1 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_d2522d-b1[data-kb-block=\"kb-adv-heading8473_d2522d-b1\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading8473_d2522d-b1 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_d2522d-b1\"><strong>Left Section Example<\/strong><\/p>\n\n\n<style>.kb-image8473_2e8121-ee .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image8473_2e8121-ee size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1575\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/left-section-index-scaled.jpg\" alt=\"left-section-index\" class=\"kb-img wp-image-14777\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/left-section-index-scaled.jpg 2560w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/left-section-index-300x185.jpg 300w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/left-section-index-1024x630.jpg 1024w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/left-section-index-768x472.jpg 768w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/left-section-index-1536x945.jpg 1536w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/left-section-index-2048x1260.jpg 2048w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/left-section-index-360x221.jpg 360w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_b859ce-a3, .wp-block-kadence-advancedheading.kt-adv-heading8473_b859ce-a3[data-kb-block=\"kb-adv-heading8473_b859ce-a3\"]{margin-bottom:0px;font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_b859ce-a3 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_b859ce-a3[data-kb-block=\"kb-adv-heading8473_b859ce-a3\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_b859ce-a3 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_b859ce-a3[data-kb-block=\"kb-adv-heading8473_b859ce-a3\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading8473_b859ce-a3 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_b859ce-a3\"><strong>Right Section Example<\/strong><\/p>\n\n\n<style>.kb-image8473_9f99de-99 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image8473_9f99de-99 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"2560\" height=\"1241\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/right-section-index-scaled.jpg\" alt=\"right-section-index\" class=\"kb-img wp-image-14778\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/right-section-index-scaled.jpg 2560w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/right-section-index-300x145.jpg 300w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/right-section-index-1024x496.jpg 1024w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/right-section-index-768x372.jpg 768w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/right-section-index-1536x744.jpg 1536w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/right-section-index-2048x993.jpg 2048w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/right-section-index-360x174.jpg 360w\" sizes=\"auto, (max-width: 2560px) 100vw, 2560px\" \/><\/figure>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_14b32f-98, .wp-block-kadence-advancedheading.kt-adv-heading8473_14b32f-98[data-kb-block=\"kb-adv-heading8473_14b32f-98\"]{margin-bottom:0px;font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_14b32f-98 mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_14b32f-98[data-kb-block=\"kb-adv-heading8473_14b32f-98\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_14b32f-98 img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_14b32f-98[data-kb-block=\"kb-adv-heading8473_14b32f-98\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<p class=\"kt-adv-heading8473_14b32f-98 wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_14b32f-98\"><strong>Result<\/strong><\/p>\n\n\n<style>.kb-image8473_f702a6-1e.kb-image-is-ratio-size, .kb-image8473_f702a6-1e .kb-image-is-ratio-size{max-width:775px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_f702a6-1e.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_f702a6-1e .kb-image-is-ratio-size{align-self:unset;}.kb-image8473_f702a6-1e figure{max-width:775px;}.kb-image8473_f702a6-1e .image-is-svg, .kb-image8473_f702a6-1e .image-is-svg img{width:100%;}.kb-image8473_f702a6-1e .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_f702a6-1e\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1314\" height=\"644\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/working-tooltip-overlay.gif\" alt=\"working tooltip overlay\" class=\"kb-img wp-image-14779\" \/><\/figure><\/div>\n\n\n\n<p>If you add a third section that also needs overlapping tooltips, you can continue stacking z-index values as needed (for example, <code>3<\/code>, <code>2<\/code>, <code>1<\/code>). <br><br>This approach gives you full control over how tooltips layer across sections while ensuring they remain accessible to all visitors.<\/p>\n\n\n<style>.wp-block-kadence-advancedheading.kt-adv-heading8473_db266c-2f, .wp-block-kadence-advancedheading.kt-adv-heading8473_db266c-2f[data-kb-block=\"kb-adv-heading8473_db266c-2f\"]{font-style:normal;}.wp-block-kadence-advancedheading.kt-adv-heading8473_db266c-2f mark.kt-highlight, .wp-block-kadence-advancedheading.kt-adv-heading8473_db266c-2f[data-kb-block=\"kb-adv-heading8473_db266c-2f\"] mark.kt-highlight{font-style:normal;color:#f76a0c;-webkit-box-decoration-break:clone;box-decoration-break:clone;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;}.wp-block-kadence-advancedheading.kt-adv-heading8473_db266c-2f img.kb-inline-image, .wp-block-kadence-advancedheading.kt-adv-heading8473_db266c-2f[data-kb-block=\"kb-adv-heading8473_db266c-2f\"] img.kb-inline-image{width:150px;vertical-align:baseline;}<\/style>\n<h2 class=\"kt-adv-heading8473_db266c-2f wp-block-kadence-advancedheading\" data-kb-block=\"kb-adv-heading8473_db266c-2f\">Tooltip Settings<\/h2>\n\n\n<style>.kb-row-layout-id8473_fbfc0f-88 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id8473_fbfc0f-88 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id8473_fbfc0f-88 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:repeat(2, minmax(0, 1fr));}.kb-row-layout-id8473_fbfc0f-88 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id8473_fbfc0f-88 > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id8473_fbfc0f-88 > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id8473_fbfc0f-88 alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column8473_c63ad0-a1 > .kt-inside-inner-col,.kadence-column8473_c63ad0-a1 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_c63ad0-a1 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_c63ad0-a1 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_c63ad0-a1 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_c63ad0-a1 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_c63ad0-a1{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_c63ad0-a1 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_c63ad0-a1 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_c63ad0-a1\"><div class=\"kt-inside-inner-col\">\n<p><strong>Tooltip Placement:<\/strong> This setting determines where the Tooltip will pop up. There are many options available here for flexibility.<br><br><strong>Link Settings <\/strong><em>(Available for Advanced Texts Only)<\/em><strong>: <\/strong>If you wish to add a Hyperlink to the Highlighted Text that shows the Tooltip, you can use the Link Settings to add that link. <em>(This will link the Text itself and not the Tooltip or text within the Tooltip)<\/em><br><br><\/p>\n<\/div><\/div>\n\n\n<style>.kadence-column8473_4ff47b-64 > .kt-inside-inner-col,.kadence-column8473_4ff47b-64 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_4ff47b-64 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_4ff47b-64 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_4ff47b-64 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_4ff47b-64 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_4ff47b-64{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_4ff47b-64 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_4ff47b-64 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_4ff47b-64\"><div class=\"kt-inside-inner-col\"><style>.kb-image8473_e8b7b1-46 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<figure class=\"wp-block-kadence-image kb-image8473_e8b7b1-46 size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"667\" height=\"731\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Tooltip-Placement.gif\" alt=\"Tooltip Placement\" class=\"kb-img wp-image-8477\" \/><\/figure>\n\n\n<style>.kb-image8473_610df9-66.kb-image-is-ratio-size, .kb-image8473_610df9-66 .kb-image-is-ratio-size{max-width:284px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_610df9-66.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_610df9-66 .kb-image-is-ratio-size{align-self:unset;}.kb-image8473_610df9-66 figure{max-width:284px;}.kb-image8473_610df9-66 .image-is-svg, .kb-image8473_610df9-66 .image-is-svg img{width:100%;}.kb-image8473_610df9-66 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_610df9-66\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"700\" height=\"234\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Edit-Link-Settings.jpg\" alt=\"Edit Link Settings\" class=\"kb-img wp-image-8478\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Edit-Link-Settings.jpg 700w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Edit-Link-Settings-300x100.jpg 300w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Edit-Link-Settings-360x120.jpg 360w\" sizes=\"auto, (max-width: 700px) 100vw, 700px\" \/><\/figure><\/div>\n<\/div><\/div>\n\n<\/div><\/div>\n\n<style>.kb-row-layout-id8473_56aff9-de > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id8473_56aff9-de > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id8473_56aff9-de > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:var(--global-kb-spacing-sm, 1.5rem);padding-bottom:var(--global-kb-spacing-sm, 1.5rem);grid-template-columns:repeat(2, minmax(0, 1fr));}.kb-row-layout-id8473_56aff9-de > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id8473_56aff9-de > .kt-row-column-wrap{grid-template-columns:repeat(2, minmax(0, 1fr));}}@media all and (max-width: 767px){.kb-row-layout-id8473_56aff9-de > .kt-row-column-wrap{grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id8473_56aff9-de alignnone wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-2-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column8473_ec8d36-50 > .kt-inside-inner-col,.kadence-column8473_ec8d36-50 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_ec8d36-50 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_ec8d36-50 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_ec8d36-50 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_ec8d36-50 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_ec8d36-50{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_ec8d36-50 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_ec8d36-50 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_ec8d36-50\"><div class=\"kt-inside-inner-col\">\n<p><strong>Only Apply Tooltip To <\/strong><em>(Available for Icon List Items Only)<\/em><strong>:<\/strong> This setting allows the Tooltip to be set to either the Icon, the Text, or the Entire List Item.<\/p>\n\n\n<style>.kb-image8473_e84a24-2d .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_e84a24-2d\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"300\" height=\"300\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Only-Apply-Tooltip-To-Gif.gif\" alt=\"Only Apply Tooltip To Gif\" class=\"kb-img wp-image-8499\" \/><\/figure><\/div>\n<\/div><\/div>\n\n\n<style>.kadence-column8473_785c45-79 > .kt-inside-inner-col,.kadence-column8473_785c45-79 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column8473_785c45-79 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column8473_785c45-79 > .kt-inside-inner-col{flex-direction:column;}.kadence-column8473_785c45-79 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column8473_785c45-79 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column8473_785c45-79{position:relative;}@media all and (max-width: 1024px){.kadence-column8473_785c45-79 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column8473_785c45-79 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column8473_785c45-79\"><div class=\"kt-inside-inner-col\">\n<p><strong>Show Indicator Underline<\/strong> <em>(Available for Icons and Icon List Items Only)<\/em><strong>:<\/strong> This allows an underline to indicate that hovering the target will trigger a tooltip. <em>(This is on by default and can&#8217;t be turned off for Advanced Text Tooltips)<\/em><\/p>\n\n\n<style>.kb-image8473_777302-3c.kb-image-is-ratio-size, .kb-image8473_777302-3c .kb-image-is-ratio-size{max-width:300px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_777302-3c.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_777302-3c .kb-image-is-ratio-size{align-self:unset;}.kb-image8473_777302-3c figure{max-width:300px;}.kb-image8473_777302-3c .image-is-svg, .kb-image8473_777302-3c .image-is-svg img{width:100%;}.kb-image8473_777302-3c .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_777302-3c\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"444\" height=\"72\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Show-Indicator-Underline.jpg\" alt=\"Show Indicator Underline\" class=\"kb-img wp-image-8500\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Show-Indicator-Underline.jpg 444w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Show-Indicator-Underline-300x49.jpg 300w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Show-Indicator-Underline-360x58.jpg 360w\" sizes=\"auto, (max-width: 444px) 100vw, 444px\" \/><\/figure><\/div>\n\n\n<style>.kb-image8473_b55988-a3.kb-image-is-ratio-size, .kb-image8473_b55988-a3 .kb-image-is-ratio-size{max-width:300px;width:100%;}.wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_b55988-a3.kb-image-is-ratio-size, .wp-block-kadence-column > .kt-inside-inner-col > .kb-image8473_b55988-a3 .kb-image-is-ratio-size{align-self:unset;}.kb-image8473_b55988-a3 figure{max-width:300px;}.kb-image8473_b55988-a3 .image-is-svg, .kb-image8473_b55988-a3 .image-is-svg img{width:100%;}.kb-image8473_b55988-a3 .kb-image-has-overlay:after{opacity:0.3;}<\/style>\n<div class=\"wp-block-kadence-image kb-image8473_b55988-a3\"><figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"376\" height=\"86\" src=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Indicator-Tooltip.jpg\" alt=\"Indicator Tooltip\" class=\"kb-img wp-image-8504\" srcset=\"https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Indicator-Tooltip.jpg 376w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Indicator-Tooltip-300x69.jpg 300w, https:\/\/www.kadencewp.com\/help-center\/wp-content\/uploads\/sites\/14\/2024\/06\/Indicator-Tooltip-360x82.jpg 360w\" sizes=\"auto, (max-width: 376px) 100vw, 376px\" \/><\/figure><\/div>\n<\/div><\/div>\n\n<\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>Kadence Blocks offers a powerful feature that allows you to add tooltips to texts, icons, and buttons across your website. Tooltips are small pop-up boxes that appear when a user hovers over a target, providing additional information or tips related to that text\/target. This functionality is particularly useful for defining terminology, offering extra details, or&#8230;<\/p>\n","protected":false},"author":148263,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"doc_category":[420],"doc_tag":[],"knowledge_base":[7],"class_list":["post-8473","docs","type-docs","status-publish","hentry","doc_category-blocks-advanced","knowledge_base-kadence-blocks"],"year_month":"2026-04","word_count":659,"total_views":"3114","reactions":{"happy":"2","normal":"0","sad":"1"},"author_info":{"display_name":"victormonk","author_link":"https:\/\/www.kadencewp.com\/help-center\/author\/victormonk\/"},"doc_category_info":[{"term_name":"Advanced","term_url":"https:\/\/www.kadencewp.com\/help-center\/knowledge-base\/kadence-blocks\/blocks-advanced\/"}],"doc_tag_info":[],"knowledge_base_info":[{"term_name":"Kadence Blocks","term_url":"https:\/\/www.kadencewp.com\/help-center\/knowledge-base\/kadence-blocks\/","term_slug":"kadence-blocks"}],"knowledge_base_slug":["kadence-blocks"],"taxonomy_info":{"doc_category":[{"value":420,"label":"Advanced"}],"knowledge_base":[{"value":7,"label":"Kadence Blocks"}]},"featured_image_src_large":false,"comment_info":0,"_links":{"self":[{"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/docs\/8473","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/users\/148263"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/comments?post=8473"}],"version-history":[{"count":16,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/docs\/8473\/revisions"}],"predecessor-version":[{"id":14782,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/docs\/8473\/revisions\/14782"}],"wp:attachment":[{"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/media?parent=8473"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/doc_category?post=8473"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/doc_tag?post=8473"},{"taxonomy":"knowledge_base","embeddable":true,"href":"https:\/\/www.kadencewp.com\/help-center\/wp-json\/wp\/v2\/knowledge_base?post=8473"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}