목차
1. 뼈대 만들기 #common.html
2. 살 붙이기 # {% block content %} {% endblock %}
3. 끼워넣기 # {% include 'app_name/xxx.html' %}
참고사항
templates/common.html
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
</head>
<body>
{% block content %}
{% endblock %}
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
crossorigin="anonymous"></script>
</body>
</html>
with절 사용가능
{% include 'portfolio/search_bar.html' %}
또 다른 예시
<!-- parent_template.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Parent Template</title>
</head>
<body>
<div>
<!-- Include 구문과 함께 with 절 사용 -->
{% include 'child_template.html' with message="Hello from parent template!" %}
</div>
</body>
</html>
<!-- child_template.html -->
<div>
<p>{{ message }}</p>
</div>
- 변경사항은 서버를 다시 시작해야 적용