Làm menu xổ xuống giống page 4 Calaco (ok)

Bước 1: Vào functions.php
/******************************************************************************/

if(! function_exists('vg_calaco_widgets_init'))
{
	function vg_calaco_widgets_init()
	{

		register_sidebar(array(
			'name' 			=> esc_html__('Menu Categories Widget', 'vg-calaco'),
			'id' 			=> 'vg-categories3',
			'class' 		=> 'vg-categories3',
			'description' 	=> esc_html__('Widget Menu Categories Layout 3 ', 'vg-calaco'),
			'before_widget' => '<div id="%1$s" class="widget header-widget %2$s">',
			'after_widget' 	=> '</div>',
			'before_title' 	=> '<div class="widget-title header-widget-title"><h3>',
			'after_title' 	=> '</h3></div>',
		));
		
	}
}
add_action('widgets_init', 'vg_calaco_widgets_init');


/******************************************************************************/
Bước 2: vào header.php
<?php if (is_active_sidebar('vg-categories3')) : ?>
	<div class="menu-category home3">
		<div class="cateproductmenu">
			<?php dynamic_sidebar('vg-categories3'); ?>
		</div>
	</div>
<?php endif; ?>
Bước 3: create js
jQuery(document).ready(function($) {
	$(".cateproductmenu .header-widget-title").on("click", function() {
		$(this).parents('.cateproductmenu').find(" .menu-menu-categories-container").slideToggle("fast");
		$(this).parents('.cateproductmenu').toggleClass("open");
	});
});