Notice
Recent Posts
Recent Comments
Link
«   2024/05   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Tags more
Archives
Today
Total
관리 메뉴

Storage Gonie

39. (app2) Django 템플릿 확장을 다른 모든 템플릿에 적용 본문

웹개발/Django 웹서비스 개발(인프런)

39. (app2) Django 템플릿 확장을 다른 모든 템플릿에 적용

Storage Gonie 2019. 2. 20. 22:05
반응형

1. polls/templates에 main.html생성

{% extends 'polls/base.html' %}

{% block content %}
<div class="jumbotron">
  <h1>Hello, CodeSquad!</h1>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit,
    sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
    Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
    nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in
    reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
    Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt
    mollit anim id est laborum.</p>
  <p><a class="btn btn-primary btn-lg" href="{% url 'polls:index' %}" role="button">Go polls</a></p>
</div>

{% endblock content %}

2. polls/templates에 base.html생성

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
  <title>Django Polls Example</title>

  <!-- Bootstrap -->
  <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->
</head>
<body>
  <div class="container">
    <nav class="navbar navbar-default">
      <div class="container-fluid">
        <div class="navbar-header">
          <span class="navbar-brand">Polls Example</span>
        </div>
        <ul class="nav navbar-nav">
          <li><a href = "{% url 'polls:index' %}">투표</a></li>
          <li class="navbar-right"><a href = "{% url 'admin:index' %}">관리자</a></li>
        </ul>
      </div>
    </nav>
    <div>
      {% block content %}
      {% endblock %}
    </div>
  </div>
  <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <!-- Include all compiled plugins (below), or include individual files as needed -->
  <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  </body>
  </html>

3. index.html, detail.html, results.html에 템플릿 확장 적용.

- 각각의 파일에 아래의 코드를 복붙한뒤 블록 사이에 기존의 코드를 넣어준다.

{% extends 'polls/base.html' %}

{% block content %}
    <!--
        ohter html here
    -->
{% endblock content %}

4. 사진이 지저분하게 뜨므로 polls/style.css에서 body 태그제거


5. mysite/urls.py에 main 추가.

from polls import views
url(r'^/', views.main, name="main"),

6. views.py에 main 메소드 추가

def main(request):
    return render(request, 'polls/main.html', {})








반응형
저작자표시 비영리

'웹개발 > Django 웹서비스 개발(인프런)' 카테고리의 다른 글

41. (app3) 킬로그램 앱 초기화  (0) 2019.02.21
40. app1, app2 앱 통합하기  (0) 2019.02.21
38. (app2) 템플릿 확장을 이용한 admin 템플릿 수정  (0) 2019.02.20
37. (app2) 정적파일 적용 및 관리  (0) 2019.02.20
36. (app2) Django admin페이지 customize하기  (0) 2019.02.20
'웹개발/Django 웹서비스 개발(인프런)' Related Articles more
Comments