Cara Embed [Sisipkan] Foto dan Video Instagram di Blog

Sebenarnya, embed foto dan video instagram di blog/website ini sudah bisa dilakukan sejak Juli 2013 yang lalu sesuai yang disampaikan di akun resmi Instagram. Namun, karena Pangeran sendiri baru membuat akun Instagram beberapa waktu lalu, makanya agak kurang ngerti awalnya tentang cara memasukkan foto dan video instagram di blog.

 

Selain nggak ngerti, ya karena sebelumnya nggak menggunakan social media ini, makanya males mempelajarinya. Tapi, setelah punya akun. Pangeran penasaran gimana caranya embed foto dan video instagram di blog. Setelah membaca Help Instagram. Semuanya terjawab.

 

Meskipun agak telat taunya, tapi di Indonesia sendiri masih banyak banget blogger yang (mungkin) belum ngerti cara memasang atau istilahnya embed (menyematkan) foto and video instagram di blog atau website kalian.

 

Sekarang nggak usah bingung lagi. Pangeran akan share panduannya. Simak penjelasannya di bawah ini, ya.

 

Introducing Instagram Web Embeds

Sebelum ke cara. Ada baiknya seperti biasa. Pangeran mengajak kalian untuk memahami sebenarnya embed itu apa, sih?

 

Oke, biar nggak pusing, sekarang kita langsung ke contoh aja, ya. Pernahkah kalian melihat salah satu postingan di blog Pangeran atau di blognya temen-temen lain menautkan akun instagram mereka seperti ini :

 

 

 

Itulah yang dimaksud dengan embed. Artinya, kalian menyisipkan script atau code yang bisa kalian tambahkan ke blog/website. Nah, penggunaan embed ini bisa kalian terapkan pada akun kalian sendiri atau akun temen kalian yang sekiranya kalian sukai.

 

Misalnya, kalian menyukai quote di akun instagram seseorang. Nah, Instagram ingin memberikan tampilan yang berbeda dan unik dari kalian yang hanya sekedar screenshoot.

 

Kalo soal cepat atau lambatnya loading script ini, masih masuk kategori lumayan. Sangat disarankan untuk menautkan atau menyisipkan foto dan video jangan terlalu banyak (Kalo Pangeran maksimal 3 foto atau video. Kalo kalian mau lebih, silakan…). Karena, itu juga akan mempengaruhi kecepatan loading blog kalian.

 

Seperti yang kalian lihat, penggunaan embed ini memiliki tampilan yang sangat menarik untuk bisa digunakan meningkatkan pengalaman pembaca dengan versi yang lebih keren.

 

Penggunaan embed ini juga bisa dibilang mampu menambah jumlah followers dari pembaca blog kalian.

 

Ow, ya. Penerapan embed ini hanya bisa digunakan untuk kalian yang menerapkan akun secara umum. Bukan privasi. Begitulah yang disampaikan pihak Instagram mengenai embed foto dan video ini.

 

Jadi, mulai sekarang kalian bisa memberikan pengalaman yang keren di mata pembaca. Lalu, bagaimana cara embed (sisipkan) foto dan video instagram di blog?

 

Selengkapnya Pangeran bahas di bawah ini. Selamat mencoba.

Cara Embed [Memasang] Foto dan Video Instagram di Blog

1. Pastikan kalian sudah memiliki akun Instagram. Jika belum punya, silakan baca ini : cara membuat akun Instagram
2. Buka link berikut instagram.com.
cara embed (sisipkan) foto dan video instagram di blog

 

3. Selanjutnya masukkan USERNAME (tanpa @) dan PASSWORD akun Instagram kalian dan klik MASUK seperti contoh di bawah ini :
cara embed (sisipkan) foto dan video instagram di blog

 

4. Sekarang kalian sudah login di akun Instagram kalian dan lanjut klik Icon Profil seperti gambar di bawah ini :
cara embed (sisipkan) foto dan video instagram di blog

 

5. Setelah kalian berada di profil akun kalian, pilih foto atau video mana yang ingin kalian embed.
cara embed (sisipkan) foto dan video instagram di blog

 

6. Jika sudah ketemu, Klik pada foto atau videonya. Lalu akan muncul pop up baru dan klik icon ‘ooo’ seperti gambar ini :
cara embed (sisipkan) foto dan video instagram di blog

 

7. Setelah kalian klik icon seperti di atas, akan muncul pop up baru lagi dan pilih SISIPKAN.
cara embed (sisipkan) foto dan video instagram di blog

 

8. Kemudian akan muncul lagi hasil klik Sisipkan (embed) tadi. Nah, sebelum mengcopy codenya, kalian bisa pilih mau menggunakan keterangan atau tidak. Jika tidak, hilangkan ceklistnya. Lalu, klik SALIN KODE SISIPAN.
cara embed (sisipkan) foto dan video instagram di blog

 

9. Sekarang kita menuju ke Postingan. Pangeran anggap kalian sudah berada di postingan blog kalian, ya. Di entry post seperti ini :
cara embed (sisipkan) foto dan video instagram di blog

 

10. Sekarang tentukan di mana posisi foto atau video Instagram yang ingin kalian sisipkan. Jika sudah, sekarang klik HTML seperti gambar di bawah ini :
cara embed (sisipkan) foto dan video instagram di blog

 

11. Search (CTRL + F) aja bagian teksnya biar gampang mau diletakkan di mana. Jika sudah, Pastekan kode di posisi yang kalian mau.
cara embed (sisipkan) foto dan video instagram di blog

 

cara embed (sisipkan) foto dan video instagram di blog

 

12. Lalu, silakan klik COMPOSE dan lihat hasilnya. Jika sudah tampil seperti gambar di bawah ini. Artinya kalian melakukan dengan benar. Tapi gambarnya memang belum tampil saat diedit. Nanti setelah dipublish baru tampil. Atau kalian mau lihat sebelum publish, silakan klik Pratinjau.
cara embed (sisipkan) foto dan video instagram di blog

 

13. Jika sudah. Saatnya PUBLISH dan selamat menggunakan.

BONUS

Sebenarnya ini adalah cara mengatasi supaya posisi embed kalian bisa pada posisi center (rata tengah). Karena, nggak semua blog punya lebar post yang sama. Tapi, kalo udah rata tengah, ya nggak usah diterapkan panduan ini.

Jadi, supaya posisinya nggak terlalu di samping kiri, kalian bisa menambahkan code <center> di awal scriptnya dan code </center> di akhir scriptnya.

Nggak usah bingung. Nih, Pangeran buatin contoh penggunaan scriptnya :

<center>
<blockquote class="instagram-media" data-instgrm-captioned="" data-instgrm-version="7" style="background: #fff; border-radius: 3px; border: 0; box-shadow: 0 0 1px 0 rgba(0 , 0 , 0 , 0.5) , 0 1px 10px 0 rgba(0 , 0 , 0 , 0.15); margin: 1px; max-width: 658px; padding: 0; width: 99.375%;">
<div style="padding: 8px;">
<div style="background: #F8F8F8; line-height: 0; margin-top: 40px; padding: 50.0% 0; text-align: center; width: 100%;">
<div style="background: url(data:image/png; display: block; height: 44px; margin: 0 auto -44px; position: relative; top: -22px; width: 44px;">
</div>
</div>
<div style="margin: 8px 0 0 0; padding: 0 4px;">
<a href="https://www.instagram.com/p/BLzq2J3DsFy/" style="color: black; font-family: &quot;arial&quot; , sans-serif; font-size: 14px; font-style: normal; font-weight: normal; line-height: 17px; text-decoration: none; word-wrap: break-word;" target="_blank">Hanya sebuah blog. #artwork #art #follows #flat #lettering  #vector #blogger #bloggerpersonal #tulisanwortel #likeforlike #hadesign</a></div>
<div style="color: #c9c8cd; font-family: Arial,sans-serif; font-size: 14px; line-height: 17px; margin-bottom: 0; margin-top: 8px; overflow: hidden; padding: 8px 0 7px; text-align: center; text-overflow: ellipsis; white-space: nowrap;">
Foto kiriman Pangeran Wortel (@heru.arya) pada <time datetime="2016-10-21T01:57:15+00:00" style="font-family: Arial,sans-serif; font-size: 14px; line-height: 17px;">Okt 20, 2016 pada 6:57 PDT</time></div>
</div>
</blockquote>
<script async="" defer="" src="//platform.instagram.com/en_US/embeds.js"></script>
</center>

Biar gampang, sebelum kalian pastekan di HTML postingan blog kalian. Pastekan dulu script Embed Instagram kalian di Aplikasi Notepad. Baru deh, tambahkan code <center> di awal scriptnya dan code </center> di akhir scriptnya.

Gampang kok. Pasti bisa. Tapi, kalo bingung, tanya di komentar, ya.

Disarankan

Cara memasang Tweet di Blog

Memang tweet di blog tidak kalah menarik pembaca untuk mengikuti (follow) akun twitter kalian. Dengan begitu, kalian akan mudah mengetahui siapa aja yang sering membaca blog kalian. Terapkan panduannya sekarang.

BACA PANDUANNYA >

 

—o0o—

 

Begitulah tadi panduan tentang bagaimana cara memasukkan (embed) foto dan video instagram di blog yang sudah Pangeran jelaskan di atas.

 

Jika mengalami kesulitan, silakan tulis di komentar atau tanyakan langsung di akun social media Pangeran yang tersedia di paling atas dari blog ini. Atau mau request tutorial juga boleh. Tulis aja di komentar. Tapi harus jelas, ya, requestnya.

 

Okelah. Seperti biasa. Terimakasih sudah membaca. Semoga panduan kalian ini bermanfaat buat temen-temen semua. Pangeran Wortel pamit. See you..

21 thoughts on “Cara Embed [Sisipkan] Foto dan Video Instagram di Blog

  1. Boleh nih untuk nunjukin foto-foto yang kita potret yang ada di IG kita masukin ke blog. Kebetulan juga hobi fotografi pange, dan bisa gue bagikan juga karya tersebut di blog 😀

    Sayang kalo masukin banyak foto blog jadi lola yaa..

    1. Nah… Bener banget, Fif. Dengan adanya cara ini kita jadi bisa nambah followers juga, lho. 😀 Kan lumayan nambah satu satu aku sayang ibu.

      Ya namanya juga scriptnya nggak langsung, Fif. Jadi, butuh waktu gitulah.

  2. kemudian kakak merasa gaptek, berguna banget ini hahhaa
    selama ini kakak bertanya2 itu ignya diapain kok pada bisa ditempel ke blog masing2.. :p
    selamat hari blogger nasional juga heru
    semoga betah jadi blogger yaaa

    1. Hahahaha. Sekarang udah nggak lagikan, kak? Udah ngertikan? heheheh.

      Nah, itu namanya Embed kak. Menyisipkan gitulah maksudnya.

      Selamat hari Blogger Nasional kak. AMinnn Semoga betah, ya. 🙂

  3. wah tips nya bermanfaat. saya beum cobain tuh sisipin di post, palingan cuma dibikin widget di sidebar.
    oh iya gan kalau kebetulan cari tips fotografi mampir dong ke blog saya
    gariswarnafoto[dot]com
    yuk mariii

  4. Oh jadi ini yang dilakukan orang orang tentang fotonya di instagram… jadi selain majang foto mereka juga bisa langsung follow kita ya bang…

    ah bookmark dulu deh… kayaknya bakal aku apke ini deh…

  5. Udah saya coba pange, and it works! cuman layout kegedean, request dong cara memperkecil ukuran layout instagram di blog.

    Bdw, klo dliat2 teknik pengambilan embednya lumayan sama ya dengan yg di twitter, tnggal di copy. Nice post pange, sangat membantu, hehe.

Leave a Reply

Your email address will not be published. Required fields are marked *