Cum sa faci un meniu responsive pentru o tema WordPress

De curand am gasit o metoda foarte buna pentru a face un meniu responsive la o tema WordPress cu ajutorul site-ului cssmenumaker.

Meniul care ne poate ajuta din site se gaseste aici si o sa explic pasi care trebuiesc facuti.

Se poate seta culorile la meniu dupa cum se poate vedea si dupa ce a-ti ales culorile se copiaza css-ul intr-un nou fisier de exemplu meniu.css dupa care se incarca in tema via ftp.

Se adauga urmatorul cod in functions.php pentru inregistrarea noului fisier meniu.css

function meniu_scripts() {

  wp_enqueue_style( 'meniu-style', get_stylesheet_directory_uri() . '/meniu.css' );

}
add_action( 'wp_enqueue_scripts', 'meniu_scripts' );

In header.php unde avem functia

<?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>

se adauga acest rand de cod  ‘container_id’ => ‘cssmenu’ si codul final din header.php ar trebuii sa arate asa.

<?php wp_nav_menu( array( 'container_id' => 'cssmenu', 
                          'theme_location' => 'primary', 
                          ) ); ?>

In footer.php mai avem de adaugat si acest cod dupa wp_footer

<script>
jQuery('#cssmenu').prepend('<div id="menu-button">Menu</div>');
	jQuery('#cssmenu #menu-button').on('click', function(){
		var menu = jQuery(this).next('ul');
		if (menu.hasClass('open')) {
			menu.removeClass('open');
		}
		else {
			menu.addClass('open');
		}
	});
</script>

Demo este meniul de la tema mea.