chihung
9/25/2019 - 5:53 AM

Quick add fetching instagram image

ol.list-instagram-container,
ol.list-instagram-container * {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

ol.list-instagram-container {
	margin-right: -1px !important;
	margin-left: -1px !important;
	list-style: none;
}

ol.list-instagram-container a {
	transition-property: opacity;
	transition-duration: 0.4s;
	transition-timing-function: ease;
	-webkit-transition-property: opacity;
	-webkit-transition-duration: 0.4s;
	-webkit-transition-timing-function: ease;
	-moz-transition-property: opacity;
	-moz-transition-duration: 0.4s;
	-moz-transition-timing-function: ease;
	-o-transition-property: opacity;
	-o-transition-duration: 0.4s;
	-o-transition-timing-function: ease;
}

ol.list-instagram-container a:hover {
	opacity: .6;
}

ol.list-instagram-container li {
	width: 16.666666%;
	padding-right: 1px !important;
	padding-bottom: 2px !important;
	padding-left: 1px !important;
	margin-bottom: 0 !important;
	background: none !important;
	float: left;
}

@media (max-width: 768px) {
	ol.list-instagram-container li {
		width: 50%;
	}
}

ol.list-instagram-container img {
	max-width: 100%;
	vertical-align: top;
}




/***************************************************************************
 *
 *
 *
 ***************************************************************************/
$(document).ready(function () {
  var $listInstagramContainer = $('.list-instagram-container');

  try {
    this.name = "344tokusan";

    $.ajax('https://www.instagram.com/' + this.name + '/', {
      timeout: 2000,
      datatype: 'html'
    }).then(function (data) {
      json_string = data.split("window._sharedData = ")[1];
      json_string = json_string.split("};</script>")[0] + "}";
      this.Arrya_data = JSON.parse(json_string);

      let datas = this.Arrya_data.entry_data.ProfilePage[0].graphql.user.edge_owner_to_timeline_media.edges;

      for (i in datas) {
        url = datas[i].node.thumbnail_resources[4].src;

        var $a = $('<a href="#" target="_blank">');
        $a.attr('href', 'https://www.instagram.com/p/' + datas[i].node.shortcode + '/');

        var $li = $('<li>');
        var $img = $('<img>');
        $img.attr('src', url);
        $a.append($img);
        $li.append($a);

        $listInstagramContainer.append($li);
        // console.log(url);
      }
    });
  } catch (error) {
    alert(error);
  }
});

<ol class="clearfix list-instagram-container">
						</ol>