Social icons in mobile menu won't work with same code

Hi there,

I’ve literally copied the code that works for 2 Enfold installations (both, function.php and CSS), but haven’t been able to make the slide-out mobile menu show the social icons. Can you pls check it out to guide me on what might be causing the problem?

// add social icons inside the mobile menu
function ava_custom_script_mod_social(){
?>
<script>
(function($){
var int = ”;
function a() {
var isMobile = $(‘.av-burger-menu-main’).css(‘display’),
htmlString = $(‘#header_main .social_bookmarks:first’).find(‘li a’),
mobileMenu = $(‘.av-burger-overlay’),
socialString = [];

if(isMobile == ‘none’) return;
if($(‘.burger-social’).length) clearInterval(int);

htmlString.each(function() {
var socialClass = $(this).parent(‘li’).attr(‘class’),
socialItems = $(this).wrap(‘<li class=”‘+ socialClass + ‘ av-active-burger-items burger-social”></div>’).parent().unwrap();
socialString.push(socialItems);
});

$(socialString).each(function() {
$(this).appendTo(‘#av-burger-menu-ul’);
});
}

$(‘#header’).on(‘mousedown’, ‘.av-main-nav-wrap’, function() {
int = setInterval(function() {
a();
}, 500);
});

})(jQuery);
</script>
<?php
}
add_action(‘wp_footer’, ‘ava_custom_script_mod_social’);

I’ve also added the corresponding CSS code.

I’ve tried this code without any result:

function ava_custom_script_mod_social()
{
?>
<script>
(function($) {
$(document).ready(function() {
var burger_wrap = $(‘.av-burger-menu-main a’);
var social = $(‘.social_bookmarks’);
var mobile_social = $(‘.mobile_social_bookmarks’).length;

if (mobile_social) return;

$(burger_wrap).on(‘avia_burger_list_created’, function() {
setTimeout(() => {
social.appendTo(‘#av-burger-menu-ul’).addClass(“mobile_social_bookmarks”);
}, 500);
});
});
})(jQuery);
</script>
<?php
}
add_action(‘wp_footer’, ‘ava_custom_script_mod_social’, 10000);

Any other suggestions, please?

Regards,

HC

• This topic was modified 3 years, 6 months ago by hacart.