Blogger me Login/Signup system directly support nahi karta, kyunki Blogger ek static platform hai jisme PHP, MySQL, ya server-side scripting ka support nahi hota. Lekin, tum Firebase Authentication ya Google OAuth ka use karke ek login system add kar sakte ho.
🔹 Method 1: Firebase Authentication (Recommended)
Firebase Google ka ek free authentication service hai jo Blogger jaisi websites me login system implement karne me madad karta hai.
🔥 Steps to Add Login/Signup in Blogger Using Firebase
-
Firebase Project Create Karo:
- Firebase Console par jao.
- "Create Project" karo aur apni website ka naam do.
- Authentication → Sign-in Method → Email/Password ya Google Sign-in enable karo.
-
Firebase SDK Add Karo Blogger me:
- Blogger Dashboard → Theme → Edit HTML me jao.
<head>tag ke andar ye Firebase scripts add karo:
<script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-app.js"></script> <script src="https://www.gstatic.com/firebasejs/9.6.1/firebase-auth.js"></script> -
Firebase Config Code Add Karo:
- Firebase Console → Project Settings → SDK Config code copy karo.
- Blogger me
<script>tag ke andar paste karo:
<script> const firebaseConfig = { apiKey: "YOUR_API_KEY", authDomain: "YOUR_PROJECT_ID.firebaseapp.com", projectId: "YOUR_PROJECT_ID", storageBucket: "YOUR_PROJECT_ID.appspot.com", messagingSenderId: "YOUR_MESSAGING_SENDER_ID", appId: "YOUR_APP_ID" }; firebase.initializeApp(firebaseConfig); </script> -
Login & Signup Buttons Add Karo:
- Blogger me HTML/JavaScript widget ya theme me directly add karo:
<button onclick="signUp()">Sign Up</button> <button onclick="signIn()">Login</button> <button onclick="signOut()">Logout</button> <script> function signUp() { var email = prompt("Enter Email:"); var password = prompt("Enter Password:"); firebase.auth().createUserWithEmailAndPassword(email, password) .then((userCredential) => alert("Signup Successful!")) .catch((error) => alert(error.message)); } function signIn() { var email = prompt("Enter Email:"); var password = prompt("Enter Password:"); firebase.auth().signInWithEmailAndPassword(email, password) .then((userCredential) => alert("Login Successful!")) .catch((error) => alert(error.message)); } function signOut() { firebase.auth().signOut().then(() => alert("Logged Out!")); } </script> -
Content Hide/Show Karo Login Ke Basis Par:
- Agar tum chahte ho ki sirf logged-in users content dekhein, to ye code use karo:
<div id="protected-content" style="display: none;"> <h2>Welcome to My Website!</h2> </div> <script> firebase.auth().onAuthStateChanged((user) => { if (user) { document.getElementById("protected-content").style.display = "block"; } else { document.getElementById("protected-content").style.display = "none"; } }); </script>
🔹 Method 2: Google OAuth (Easy But Limited)
Agar tum Firebase nahi use karna chahte, to Google OAuth ka simple login system Blogger me add kar sakte ho.
<div id="g-signin2"></div>
<script src="https://apis.google.com/js/platform.js" async defer></script>
<script>
function onSignIn(googleUser) {
var profile = googleUser.getBasicProfile();
alert("Welcome, " + profile.getName());
}
</script>
⚡ Drawback: Isme sirf Google Login hoga, email/password ka option nahi milega.
🎯 Conclusion:
- Best Method: Firebase Authentication (Email, Google, Facebook sab support karta hai)
- Easy Method: Google OAuth (Sirf Google se login hoga)
- Alternative: Third-Party Authentication Services jaise Auth0 ya Okta use kar sakte ho.
Agar tum full authentication aur user management chahte ho, to Firebase best option hai! 🚀