Banyak yang menggunakan Google Drive sebagai cloud storage atau media untuk menyimpan data. Seperti yang akan dicontohkan disini, saya menyimpan data gambar di Google Drive dan ingin memanfaatkannya agar gambar tersebut dapat ditampilkan di situs web atau tempat lainnya sesuai keperluan atau memanfaatkannya sebagai tempat hosting gambar.
Bagaimana cara menyematkan gambar dari google drive agar ditampilkan kedalam web?
Berikut ini adalah cara menyematkan gambar yang ada di google drive agar bisa kita manfaatkan untuk ditautkan dan ditampilkan pada halaman web.
Membuka Google Drive
Pertama kita buka dahulu aplikasi Google Drive yang terdapat data gambar yang akan digunakan.
Dapatkan tautan
Klik titik 3 atau klik kanan pada berkas gambar yang akan digunakan, akan membuka jendela untuk mendapatkan tautan Get Link atau pilih share lalu copy link.
Berikan akses untuk melihat gambar
Muncul pemberitahuan Manage Access pilih Anyone with the link siapa saja yang memiliki link agar dapat melihat gambar.
Salin tautan
Lalu biarkan sebagai Viewer pilih Copy Link untuk menyalin tautan gambar, lalu paste pada clipboard atau note sebelum kita kustom tautan tersebut.
Mengambil ID tautan gambar
Berikut ini merupakan contoh tautan pada Google Drive yang akan digunakan.
https://drive.google.com/file/d/1Swco0ycFeHP6oQBEDWs64NnFqWECVOPe/view?usp=share_link
Terdapat ID unik yang diberikan Google Drive dari tautan tersebut, yang telah dipisahkan seperti dibawah ini.
1Swco0ycFeHP6oQBEDWs64NnFqWECVOPe
Selanjutnya ganti URL sebelum ID tersebut dengan URL seperti dibawah ini.
https://drive.google.com/uc?id=
Sehingga setelah digabungkan URL menjadi seperti ini.
https://drive.google.com/uc?id=1Swco0ycFeHP6oQBEDWs64NnFqWECVOPe
Contoh tautan
Salin URL yang digabungkan, lalu coba pada browser untuk melihat hasilnya. Dan jika akan menyematkan gambar ke website, bisa menggunakan tag img seperti kode dibawah ini. Gambar screenshot yang dijadikan thumbnail pada gambar diatas merupakan hasil menyematkan gambar dari Google Drive.
<img src="https://drive.google.com/uc?id=1Swco0ycFeHP6oQBEDWs64NnFqWECVOPe" class="img-fluid" alt="Dapatkan tautan Google Drive"/>
Cara lainnya
Sebelumnya cara yang telah disebutkan diatas bisa saya gunakan, namun setelah beberapa bulan trik tersebut tidak dapat menampilkan gambar pada web ini. Sehingga kita akan gunakan cara lain seperti berikut ini:
Ganti URL sebelum ID dengan URL seperti dibawah ini.
https://drive.google.com/thumbnail?id=
Berikan untuk ukuran w = lebar h = panjang gambar setelah ID seperti dibawah ini.
&sz=w1200-h768
Sehingga setelah digabungkan URL menjadi seperti ini.
https://drive.google.com/thumbnail?id=1Swco0ycFeHP6oQBEDWs64NnFqWECVOPe&sz=w1200-h768
Dalam HTML kita tuliskan seperti ini:
<img src="https://drive.google.com/thumbnail?id=1Swco0ycFeHP6oQBEDWs64NnFqWECVOPe&sz=w1200-h768" class="img-fluid" alt="Dapatkan tautan Google Drive"/>
Dari tautan dengan ID gambar yang ada pada Google Drive ini, sekarang kita bisa gunakan untuk menyematkan gambar dan menampiilkannya pada halaman web yang kita inginkan.
Referensi:
https://stackoverflow.com/questions/15557392/how-do-i-display-images-from-google-drive-on-a-website
Tidak ada komentar:
Posting Komentar
Terima kasih telah berkunjung dan membaca artikel ini. Silahkan berikan saran dan pertanyaan di kolom berikut ini.