HOME

EMBED KODE DENGAN EFEK POP UP SAAT KURSOR DI ARAHKAN

<!DOCTYPE html>

<html>

<head>

<style>

body {

margin: 0;

padding: 0;

background: transparent;

font-family: times new roman;

}

.gallery {

display: flex;

overflow-x: auto;

gap:30px;

padding: 10px;

scroll-behavior: smooth;

-ms-overflow-style: none;

scrollbar-width: none;

}

.gallery::-webkit-scrollbar {

display: none;

}

.gallery a {

flex: 0 0 auto;

text-decoration: none;

color: inherit;

}

.frame {

background: white;

padding: 7px 7px 20px 7px; /* bawah tebal buat caption */

border-radius: 10px;

box-shadow: 0.2px 6px rgba(0,0,0,0.2);

display: flex;

flex-direction: column;

align-items: center;

transition: transform 0.2s;

}

.frame:hover {

transform: scale(1.05);

}

.frame img {

height: 240px;

display: block;

border-radius: 5px;

}

.caption {

font-size: 20px;

font-weight: 30px;

color: black;

text-align: center;

margin-top: 20px;

}

</style>

</head>

<body>

<div class="caption">Perbedaan Mode</div>

</div>

</a>

<div class="caption">Biome, Mobs, dan Item dasar</div>

</div>

</a>

<div class="caption">Crafting Item Penting</div>

</div>

</a>

<div class="caption">Desain dan Inspirasi Build</div>

</div>

</a>

</div>

</body>

</html>

Pada bagian yang digaris bawahi, masukkan link halaman yang akan ditautkan pada gambar.

Pada bagian yang digaris bawahi selanjutnya, masukkan link gambar yang akan dijadikan icon.

Upload gambarnya pada Google drive, lalu klik titik tiga pada gambar.
Klik "SHARE" dan ganti General access menjadi Anyone with the link.
Lalu copy link nya.
Link yang akan ditempel adalah karakter setelah tanda /d/.....sampai/ lagi. Seperti pada contoh digambar.
Gunakan langkah yang sama pada setiap icon yang dibutuhkan.

MEMASUKKAN KODE KE GOOGLE SITES

Jika kode sudah selesai, salin dan siap dimasukkan dalam GOOGLE SITES.
Buka GOOGLE SITES.
Pilih fitur Embed.
saat diklik, akan muncul option By URL atau Embed code. Pilih lah yang EMBED CODE
Lalu tempel Code tadi. Dan NEXT

Pastikan gambar yang kalian pilih, muncul. Jika sudah muncul dan tidak ada masalah, kalian bisa INSERT kodenya.
Kalian bisa sesuaikan ukuran nya agar icon muncul di layar.