gseek의 flask 강좌를 공부하며 학습한 내용을 공유하고 소스를 공유하고자 포스팅합니다.
include 기능 및 super 코드를 학습했는데 잘 안되는 부분은 삭제를 했습니다.
template 상속은
{% extends "<부모템플리트 이름>" %}
{% block %} 대체할 코드 {% endblock %}
===== app.py ====
from flask import Flask, render_template
app=Flask(__name__)
@app.route("/")
def temp_test():
return render_template("super.html",my_string="템플릿 테스트",my_list=[11,22,33,44,55,66,77])
if __name__=="__main__":
app.run()
====== super.html ====
{% block content %}
<h4>자식 템플릿의 시작</h4>
<br/>
<p>My String : {{my_string}}</p>
<p>리스트 값:{{my_list[2]}}</p>
<p>전체 리스트</p>
<ul>
{% for i in my_list%}
<li>{{i}}</li>
{% endfor%}
</ul>
<h4>자식 템플릿의 끝</h4>
{% block footer %}
{{ super()}}
{% endblock footer %}
{% endblock content%}
===nav.html =====
<nav class="navbar navbar-inverse" role="navigation">
<div class="container-fluid">
<div class = "navbar-header">
<a clas="navbar-brand" href="/">Logo!</a>
</div>
</div>
<div class = "collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">메뉴1</a></li>
<li><a href="#">메뉴2</a></li>
<li><a href="#">메뉴3</a></li>
<li><a href="#">메뉴4</a></li>
</ul>
<form class="navbar-form navbar-left" role="search">
<div class="form-group">
<input type="text" class="form-control" placeholder="검색하기">
</div>
<button type="submit" class = "btn btn-default">확인</button>
</form>
<ul class = "nav navbar-nav navbar-right">
<li><a href="#">회원가입</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">사용자<b class"caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">나의 프로필</a></li>
<li><a href="#">주문내역</a></li>
<li class="divider"></li>
<li><a href="#">로그인</a></li>
</ul>
</li>
</ul>
</div>
</nav>
==== layout.html ====
<!DOCTYPE html>
<head>
<title>Flask Template Example</title>
<meta name="veiwport" content = "width=device-width, initial-scal=1.0">
</head>
<style type="text/css">
h3 {color:blue}
h4 {color:red}
.footer{color:green}
</style>
<body>
{% include 'nav.html'%}
{% block heading %}
<h1>jinja super test</h1>
{% endblock heading %}
<div class ='wrap'>
<h3>기본 템플릿</h3>
<br/>
{% block content %}{% endblock content %}
<br/>
<h3> 기본 템플릿</h3>
<br/>
<div class = "footer">
{% block footer%}
추가된 footer 영역
{% endblock footer%}
</div>
</body>
</html>
'Python > Flask' 카테고리의 다른 글
| macro & caller 사용 예문 (0) | 2020.07.05 |
|---|---|
| Python : Flask: jinja2 :특수문자,줄바꿈지우기 (2) | 2020.06.21 |
| Flask 학습자료 source code1 : 부스트트랩을 이용한 메뉴바 (0) | 2020.05.29 |