You are here

simple-instagram-block.html.twig in Simple Instagram Feed Block 1.0.x

<div id="{{ unique_id }}" class="instagram-feed">
  <div class="content">
      <div class="instagram-feed">

        {# INSTAGRAM PROFILE DATA. #}
        <div class="instagram_profile" style="text-align:center;">
          <img class="instagram_profile_image" src="{{ profile_pic_url }}" alt="{{ instagram_fullname }} profile pic" style="border-radius:10em;width:15%;max-width:125px;min-width:50px;" loading="{{ lazy }}">
          <p class="instagram_username" style="font-size:1.2em;">{ instagram_fullname }} (<a href="https://www.instagram.com/{{ instagram_username }}/" rel="noopener" target="_blank">{ instagram_username }}</a>)</p>
          <p class="instagram_biography" style="font-size:1em;">{{ instagram_bio }}</p>
        </div>

        {# INSTAGRAM FEED LOOP. #}
        <div class="instagram_gallery">
        <a href="" class="instagram-image" rel="noopener" target="_blank" style="width:16.166666666666668%; margin:0.25%;position:relative; display: inline-block; height: 100%;">
          <img loading="{{ lazy }}" src="" alt="" style="width:100%;">
        </a>
      </div>
    </div>
  </div>
</div>

File

templates/simple-instagram-block.html.twig
View source
  1. <div id="{{ unique_id }}" class="instagram-feed">
  2. <div class="content">
  3. <div class="instagram-feed">
  4. {# INSTAGRAM PROFILE DATA. #}
  5. <div class="instagram_profile" style="text-align:center;">
  6. <img class="instagram_profile_image" src="{{ profile_pic_url }}" alt="{{ instagram_fullname }} profile pic" style="border-radius:10em;width:15%;max-width:125px;min-width:50px;" loading="{{ lazy }}">
  7. <p class="instagram_username" style="font-size:1.2em;">@{{ instagram_fullname }} (<a href="https://www.instagram.com/{{ instagram_username }}/" rel="noopener" target="_blank">@{{ instagram_username }}</a>)</p>
  8. <p class="instagram_biography" style="font-size:1em;">{{ instagram_bio }}</p>
  9. </div>
  10. {# INSTAGRAM FEED LOOP. #}
  11. <div class="instagram_gallery">
  12. <a href="" class="instagram-image" rel="noopener" target="_blank" style="width:16.166666666666668%; margin:0.25%;position:relative; display: inline-block; height: 100%;">
  13. <img loading="{{ lazy }}" src="" alt="" style="width:100%;">
  14. </a>
  15. </div>
  16. </div>
  17. </div>
  18. </div>