Menambahkan beberapa tautan ke halaman lain di home.html
. Berikut adalah langkah-langkah untuk
menambahkan beberapa tautan halaman:
Baca juga: Cara Menambahkan CSS Python Flask
1. Tambahkan Rute Baru di app.py
Tambahkan beberapa rute baru ke app.py
untuk halaman-halaman yang akan ditautkan dari halaman utama.
from flask import Flask, render_template,
request, redirect, url_for, flash, session
from werkzeug.security import
generate_password_hash, check_password_hash
app = Flask(__name__)
app.secret_key = 'your_secret_key'
# Dummy user data
users = {
"admin": generate_password_hash("password123")
}
@app.route('/')
def home():
if
'username' in session:
return render_template('home.html', username=session['username'])
return
redirect(url_for('login'))
@app.route('/login', methods=['GET', 'POST'])
def login():
if
request.method == 'POST':
username = request.form['username']
password = request.form['password']
if
username in users and check_password_hash(users[username], password):
session['username'] = username
flash('Login successful!')
return redirect(url_for('home'))
else:
flash('Invalid username or password')
return
render_template('login.html')
@app.route('/logout')
def logout():
session.pop('username', None)
flash('You have been logged out.')
return
redirect(url_for('login'))
@app.route('/page1')
def page1():
return
render_template('page1.html')
@app.route('/page2')
def page2():
return
render_template('page2.html')
@app.route('/page3')
def page3():
return
render_template('page3.html')
if __name__ == '__main__':
app.run(debug=True)
2. Buat Template HTML untuk Halaman Baru
Tambahkan template HTML untuk halaman baru (page1.html
, page2.html
,
page3.html
) di direktori templates
.
templates/page1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Page 1</title>
<link rel="stylesheet" type="text/css"
href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
<div class="container">
<h1>Page 1</h1>
<p>This is Page 1.</p>
<a href="{{ url_for('home') }}">Back to Home</a>
</div>
</body>
</html>
templates/page2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta
charset="UTF-8">
<title>Page
2</title>
<link
rel="stylesheet" type="text/css" href="{{ url_for('static',
filename='style.css') }}">
</head>
<body>
<div
class="container">
<h1>Page
2</h1>
<p>This is
Page 2.</p>
<a
href="{{ url_for('home') }}">Back to Home</a>
</div>
</body>
</html>
templates/page3.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Page 3</title>
<link rel="stylesheet" type="text/css"
href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
<div class="container">
<h1>Page 3</h1>
<p>This is Page 3.</p>
<a href="{{ url_for('home') }}">Back to Home</a>
</div>
</body>
</html>
3. Update home.html
untuk Menyertakan Tautan ke Halaman Baru
Tambahkan tautan ke halaman baru di home.html
.
templates/home.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Home</title>
<link rel="stylesheet" type="text/css"
href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
<div class="container">
<h1>Welcome, {{ username }}!</h1>
<ul>
<li><a href="{{ url_for('page1') }}">Page
1</a></li>
<li><a href="{{ url_for('page2') }}">Page
2</a></li>
<li><a href="{{ url_for('page3') }}">Page
3</a></li>
</ul>
<a href="{{ url_for('logout') }}">Logout</a>
</div>
</body>
</html>
4. Jalankan Ulang Aplikasi
Jalankan kembali aplikasi Flask dengan perintah berikut:
python app.py
Sekarang, ketika Anda
mengunjungi halaman utama setelah login (http://127.0.0.1:5000
), Sobat akan melihat tautan ke Page 1, Page 2, dan Page 3. Sobat dapat mengklik
tautan tersebut untuk melihat halaman yang sesuai.
Komentar
Posting Komentar