Quick Fixes by KadenceWP Support

The Support desk at Kadence Pro is incredible! And they offer custom coding for hooks, css and even custom php whenever they can, which is far above and beyond. This is one of the reasons we recommend KadenceWP so heartily!

As a way of giving back to the KadenceWP community – especially those of us who create custom themes on their fabulous framework, we are recording the snippets here. We all know that most of the time when we get stuck, we quickly google to see if a snippet is available so we don’t have to reinvent the wheel.

I’m trying to add enough snippets and KadenceWP keywords to make this code findable! lol So during your googling phase of development, these snippets from the wonderful people at KadenceWP will find their way to you! That’s enough of that! To the snippets!

Note: all of these are credit to Kadence developers.

Mega Menu

When creating a mega menu, we found that adding tabbed blocks within it wasn’t working. This has been reported the team and will likely be fixed soon. In the meantime here’s a quick snippet to overwrite the css and make tabs work again in the Mega Menu Block in Kadence Pro.

Tabs not working in Mega Menu, adjust your css like so:

/* Mega Menu tabs and button block */
.header-menu-container ul.menu>li.kadence-menu-mega-enabled>ul .wp-block-kadence-advancedbtn {
		justify-content: flex-end;
}
.header-menu-container ul.menu>li.kadence-menu-mega-enabled>ul .wp-block-kadence-advancedbtn a {
		width: 150px;
		justify-content: flex-end;
}
.header-menu-container ul.menu>li.kadence-menu-mega-enabled>ul .wp-block-kadence-tabs .kt-tabs-id_13a480-69 > .kt-tabs-title-list li .kt-tab-title {
    border-width: 0 0 6px;
	  border-color: transparent;
}
.header-menu-container ul.menu>li.kadence-menu-mega-enabled>ul .wp-block-kadence-tabs .kt-tabs-title-list li .kt-tab-title:hover,
.header-menu-container ul.menu>li.kadence-menu-mega-enabled>ul .wp-block-kadence-tabs .kt-tabs-title-list li.kt-tab-title-active .kt-tab-title {
    border-color: var(--global-palette1, #3182CE)!important;
}