Home / Fixing WordPress / Random submenu order
Hi,
We’d like, on a specific submenu, make every items appear in a different order each time the page is loaded.
I’ve search in plugins but didn’t found what I need. Can someone point me in the right direction ? Didn’t find where to look in nav-menu-template.php
Thanks
Its possible with JQuery
Can you please share your link
Hey, thank you.
Here it is :
http://one-day-communication.fr/mhvprovence/
It is in the “Les Maisons d’Hôtes” submenu.
There is only two items for now for testing purposes but the number of items will increase to about 20-25. (I will probably change the look for a mega menu).
Your interest for my problem is very appreciated.
Ok solved with JQuery.
Thanks Dabliu Pee
Here’s the code, added to functions.php of my child theme. Probably not the most clean solution, but i’m not a code expert, if someone have an enhanced version, please share 🙂
add_action(‘wp_head’,’random_ul’);
function random_ul()
{
?><script>
jQuery(document).ready(function($){
$(‘.sub-menu’).each(function(){
// get current ul
var $ul = $(this);
// get array of list items in current ul
var $liArr = $ul.children(‘li’);
// sort array of list items in current ul randomly
$liArr.sort(function(a,b){
// Get a random number between 0 and 10
var temp = parseInt( Math.random()*10 );
// Get 1 or 0, whether temp is odd or even
var isOddOrEven = temp%2;
// Get +1 or -1, whether temp greater or smaller than 5
var isPosOrNeg = temp>5 ? 1 : -1;
// Return -1, 0, or +1
return( isOddOrEven*isPosOrNeg );
})
// append list items to ul
.appendTo($ul);
});
});
</script>
<?php }
Better script, always in function.php
I put a “random” class on the parent il.
The problem : it mix all the li.random even if it is in several ul
Can be solved by adding different classes
<script>
jQuery(document).ready(function($){
var $x = $(“li.random ul li”);
Array.prototype.sort.call($x, function() { return Math.random() < 0.5; });
$x.each(function(i, li) { $(“li.random ul”).append(li); });
});
</script>
