장고는 템플릿 확장기능을 가지고 있다. post_list.html의 양식을 내용만 바꿔서 사용하고자 할때 유용하게 쓰일 수 있다.
먼저 base.html을 만들고 post_list.html 의 내용을 복사하여 붙여넣기 한후 for 구문을 삭제 한 후 아래코드를 를 추가한다
{% block content %}
{% endblock %}
<!-- blog/templates/blog/post_list.html -->
{% load static %}
<html>
<head>
<link href="https://fonts.googleapis.com/css2?family=Yeon+Sung&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Do+Hyeon&family=Roboto&display=swap" rel="stylesheet">
<link rel="stylesheet" href="{% static 'css/blog.css' %}">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap-theme.min.css">
<title>nyanguk의 Django 튜토리얼</title>
</head>
<body>
<div class = title-1>
<h1> <a href="">nyanguk의 블로그</a></h1>
</div>
<div class = post>
{% block content %}
{% endblock %}
</div>
</body>
</html>블록을 생성하여 base.html 안에서는 블록을 끼울자리를, 여러 다른 html파일 에서는 블록에 각 파일마다 다른 내용을 넣어주면 base.html에 내용만 바뀌어서 출력되게 된다.
자 그럼 post_list.html파일을 바꿔보자
가장먼저 base.html과 연동하기 위해서 코드 가장 위에 {% extends 'blog/base.html' %} 을 추가하고 post_list기능을 수행하는 핵심적인 부분인 for문 즉, 블록에 들어갈 부분만 제외하고 모두 없애주면 아래와 같이 코드가 완성된다.
이때 블록임을 표시해주는 {% block content %} {% endblock %} 쌍으로 감싸주는 것을 잊지말자!
{% extends 'blog/base.html' %}
{% block content %}
{% for post in posts %}
<div>
<p>created: {{ post.created_date }}</p>
<h1><a href="">{{ post.title }}</a></h1>
<p>{{ post.text|linebreaksbr }}</p>
<div class="line">
<p>---------------------------------------------------------------------</p>
</div>
</div>
{% endfor %}
{% endblock %}base.html 파일이 추가된 이후 다시 runserver를 실행시킨뒤 접속하면 동일한 페이지가 나오는 것을 확인 할수 있다.
'Django' 카테고리의 다른 글
| Django field 정리 (0) | 2021.01.21 |
|---|---|
| Django 어플리케이션 확장하기 (0) | 2021.01.20 |
| Django 부트스트랩 (0) | 2021.01.19 |
| Django 템플릿 (0) | 2021.01.19 |
| Django 템플릿과 데이터베이스 연결 (0) | 2021.01.18 |
