.png)
Jika Anda ingin membuat sebuah website menggunakan Google Sites, salah satu hal yang mungkin perlu Anda tambahkan adalah form login seperti di atas agar pengunjung dapat mengakses halaman yang diproteksi dengan password. Berikut adalah langkah-langkah sederhana untuk membuat form login di Google Sites:
1. Buka google sitesnya seperti biasa
2. Kemudian di halaman yang akan diberikan form login klik sisipkan sematkan, sematkan kode
3. Setelah itu copy paste script berikut :
<!DOCTYPE html>
<html>
<head>
<title>Login Form</title>
<style>
/* Style untuk elemen input */
.inputtext {
width: 100%;
margin-bottom: 15px;
padding: 10px;
border: none;
border-radius: 20px;
background-color: #f2f2f2;
font-size: 16px;
color: #333;
box-sizing: border-box;
}
/* Style untuk tombol login */
.tombol {
width: 100%;
padding: 10px;
border: none;
border-radius: 20px;
background-color: #3498db;
color: #fff;
font-size: 16px;
cursor: pointer;
text-transform: uppercase;
}
/* Style untuk kotak login */
.login-box {
width: 350px;
margin: 50px auto;
padding: 20px;
border: 1px solid #ccc;
border-radius: 20px;
background-color: #fff;
box-sizing: border-box;
}
/* Style untuk logo */
.logo {
display: block;
margin: 0 auto 30px;
width: 150px;
height: auto;
}
</style>
</head>
<body>
<div class="login-box">
<img class="logo" src="link logo" alt="Logo">
<form>
<input type="text" name="username" placeholder="Username" class="inputtext">
<input type="password" name="password" placeholder="Password" class="inputtext">
<input type="button" value="Login" class="tombol" onclick="login()">
</form>
</div>
<script>
function login() {
var username = document.getElementsByName("username")[0].value;
var password = document.getElementsByName("password")[0].value;
if (username == "username" && password == "password") {
window.open(" url link halaman yang dituju ", "_blank");
} else {
alert("Username atau password salah!");
}
}
</script>
</body>
</html>
0 Response to "Cara Membuat Form Login di Google Sites"
Posting Komentar