Video Tutorial: How to add more Social Icons to Header & Footer

Video Tutorial: How to add more Social Icons to Header & Footer




And this is the code you will need to use:


<script>
(function($) {
$(document).ready(function() {

function insertNetworks(icons, location){
var element_to_insert = '',
area = location.split(',');

//Check the location where the new icons will be inserted
if ( area.length == 2 ) {
container_element = $('#footer-bottom .et-social-icons, #et-info .et-social-icons');
} else {
container_element = location == 'footer' ? $('#footer-bottom .et-social-icons') : $('#et-info .et-social-icons');
}

for (i = 0; i < icons.length; i++) {
after_element = container_element.find('li:nth-child('+icons[i].Position+')');
element_to_insert += '<li class="et-social-icon et-social-'+icons[i].Icon+'"><a href="'+icons[i].Url+'" class="icon"><span>'+icons[i].Icon+'</span></a>';
after_element.after(element_to_insert);
element_to_insert = '';
}
}

insertNetworks(icons = [


{
"Position" : 2,
"Icon" : "instagram",
},



{
"Position" : 3,
"Icon" : "youtube",
},



{
"Position" : 4,
"Icon" : "pinterest",
},



{
"Position" : 5,
"Icon" : "linkedin",
},


], 'header,footer');
});
})(jQuery);
</script>

<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("ul.et-social-icons a").attr('target', '_new');
});
</script>