
<table style="margin-top:15px;">
    <td colspan="3" width="248" height="50" background="https://www.radiosnet.com.ar/imag/1/imag/arribaVENTANA.gif"><div class="e1" align="center">
           <div align="left">
             <p align="center"><span style=";font-family: 'Marvel', sans-serif;;font-size:13px;color:#FFFFFF;">Instagram</span></p>
           </div>
       </div></td>
</table>
<div id="instagram-feed1" class="instagram_profile">
    <input id="instagram" type="hidden" value="<?php echo $social_aim ?>"/>
    <img class="instagram_profile_image" src="..." alt="Instagram profile pic">
    <p class="instagram_username" >@Instagram (<a href="...">@instagram</a>)</p>
    <p class="instagram_biography">....</p>
</div>
<script type="text/javascript" src="./instagram.js"></script>
<script type="text/javascript">
          
          (function ($) {
          
            $(window).on('load', function () {
              const username = document.querySelector('#instagram').value;
              //console.log(username);
              let carlos = {
                'host': "https://www.instagram.com/",
                'username': username,
                'container': "#instagram-feed1",
                'display_profile': true,
                'display_biography': true,
                'display_gallery': true,
                'callback': null,
                'styling': true,
                'items': 12,
                'items_per_row': 3,
                'margin': 0,
                'lazy_load': true,
                'on_error': console.error
              };
              $.instagramFeed(carlos);
            });
          })(jQuery);
</script>

<style>
    #instagram-feed1{
        height: 350px;
        overflow-y: scroll;
        margin-top: 15px !important;
        margin-bottom: 15px !important;
    }
</style>