- 0. 참고사이트
또 터졌다ㅠ
- 1. 글 불러오기
참고 : 편집 위치 : ~/mysite/blog$
$vi views.py
from django.shortcuts import render
from django.utils import timezone
from .models import Post
def post_list(request):
posts = Post.objects.filter(published_date__lte=timezone.now()).order_by('published_date')
return render(request, 'blog/post_list.html', {'posts':posts})
views.py를 이렇게 바꿔주고,
$vi templates/blog/post_list.html
<div>
<h1><a href="/">Django Girls Blog</a></h1>
</div>
{% for post in posts %}
<div>
<p>published: {{ post.published_date }}</p>
<h1><a href="">{{ post.title }}</a></h1>
<p>{{ post.text|linebreaksbr }}</p>
</div>
{% endfor %}
post_list.html을 다음과 같이 바꿔주면
이렇게 뜬다.
- 2. 확장하기
$vi static/css/blog.css
.page-header {
background-color: #ff9400;
margin-top: 0;
padding: 20px 20px 20px 40px;
}
.page-header h1, .page-header h1 a, .page-header h1 a:visited, .page-header h1 a:active {
color: #ffffff;
font-size: 36pt;
text-decoration: none;
}
.content {
margin-left: 40px;
}
h1, h2, h3, h4 {
font-family: 'Lobster', cursive;
}
.date {
color: #828282;
}
.save {
float: right;
}
.post-form textarea, .post-form input {
width: 100%;
}
.top-menu, .top-menu:hover, .top-menu:visited {
color: #ffffff;
float: right;
font-size: 26pt;
margin-right: 20px;
}
.post {
margin-bottom: 70px;
}
.post h1 a, .post h1 a:visited {
color: #000000;
}이걸로 간단하게 CSS를 이용하고,
$vi templates/blog/base.html
<!DOCTYPE html>
{% load static %}
<html>
<head>
<title>Django Girls blog</title>
<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">
<link href='//fonts.googleapis.com/css?family=Lobster&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="{% static 'css/blog.css' %}">
</head>
<body>
<div class="page-header">
<h1><a href="/">Django Girls Blog</a></h1>
</div>
<div class="content container">
<div class="row">
<div class="col-md-8">
{% block content %}
{% endblock %}
</div>
</div>
</div>
</body>
</html>blog 웹페이지 전체적으로 기본이 될 base.html 생성
vi templates/blog/post_list.html
{% extends 'blog/base.html' %}
{% block content %}
{% for post in posts %}
<div class="post">
<div class="date">
{{ post.published_date }}
</div>
<h1><a href="">{{ post.title }}</a></h1>
<p>{{ post.text|linebreaksbr }}</p>
</div>
{% endfor %}
{% endblock %}
post_list.html 전부 다 지우고 위의 것으로 수정한 후
python manage.py runserver하면
보기 편하게 뜬다.
** css가 업데이트가 안되면 껐다키면 됨.
'Webpage' 카테고리의 다른 글
| 5. Django Login / Logout (0) | 2019.09.10 |
|---|---|
| 4. Django 새 페이지 만들기 (0) | 2019.09.05 |
| 2. Django urls 추가, 뷰 만들기 (0) | 2019.09.05 |
| 1. Django 설정 변경 및 모델 만들기 (0) | 2019.09.05 |
| 0. Django 설치하기 (0) | 2019.09.04 |
