You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
@@ -38,15 +38,17 @@ Finally we will take a closer look at these things we've been calling __static f
38
38
39
39
### Where to put static files for Django
40
40
41
-
As you saw when we ran `collectstatic` on the server, Django already knows where to find the static files for the built-in "admin" app. Now we just need to add some static files for our own app, `blog`.
41
+
As you saw when we ran `collectstatic` on the server, Django already knows where to find the static files for the built-in "admin" app. Now we just need to add some static files for our own app, `blog`.
42
42
43
43
We do that by creating a folder called `static` inside the blog app:
44
44
45
+
```
45
46
djangogirls
46
47
├── blog
47
48
│ ├── migrations
48
49
│ └── static
49
50
└── mysite
51
+
```
50
52
51
53
Django will automatically find any folders called "static" inside any of your apps' folders, and it will be able to use their contents as static files.
52
54
@@ -56,11 +58,13 @@ Django will automatically find any folders called "static" inside any of your ap
56
58
57
59
Let's create a CSS file now, to add your own style to your web-page. Create a new directory called `css` inside your `static` directory. Then create a new file called `blog.css` inside this `css` directory. Ready?
58
60
61
+
```
59
62
djangogirls
60
63
└─── blog
61
64
└─── static
62
65
└─── css
63
66
└─── blog.css
67
+
```
64
68
65
69
Time to write some CSS! Open up the `blog/static/css/blog.css` file in your code editor.
66
70
@@ -70,7 +74,7 @@ But let's do at least a little. Maybe we could change the color of our header? T
70
74
71
75
In your `blog/static/css/blog.css` file you should add the following code:
72
76
73
-
```css
77
+
```css:blog/static/css/blog.css
74
78
h1a {
75
79
color: #FCA205;
76
80
}
@@ -88,21 +92,21 @@ Read about [CSS Selectors in w3schools](http://www.w3schools.com/cssref/css_sele
88
92
89
93
Then, we need to also tell our HTML template that we added some CSS. Open the `blog/templates/blog/post_list.html` file and add this line at the very beginning of it:
90
94
91
-
```html
95
+
```html:blog/templates/blog/post_list.html
92
96
{% load staticfiles %}
93
97
```
94
98
95
99
We're just loading static files here :). Then, between the `<head>` and `</head>`, after the links to the Bootstrap CSS files (the browser reads the files in the order they're given, so code in our file may override code in Bootstrap files), add this line:
This line will import a font called *Lobster* from Google Fonts (https://www.google.com/fonts).
153
157
154
158
Now add the line `font-family: 'Lobster';` in the CSS file `blog/static/css/blog.css` inside the `h1 a` declaration block (the code between the braces `{` and `}`) and refresh the page:
155
159
156
-
```css
160
+
```css:blog/static/css/blog.css
157
161
h1a {
158
162
color: #FCA205;
159
163
font-family: 'Lobster';
@@ -169,15 +173,15 @@ As mentioned above, CSS has a concept of classes, which basically allows you to
169
173
170
174
Go ahead and name some parts of the HTML code. Add a class called `page-header` to your `div` that contains your header, like this:
171
175
172
-
```html
176
+
```html:blog/templates/blog/post_list.html
173
177
<div class="page-header">
174
178
<h1><a href="/">Django Girls Blog</a></h1>
175
179
</div>
176
180
```
177
181
178
182
And now add a class `post` to your `div` containing a blog post.
179
183
180
-
```html
184
+
```html:blog/templates/blog/post_list.html
181
185
<div class="post">
182
186
<p>published: {{ post.published_date }}</p>
183
187
<h1><a href="">{{ post.title }}</a></h1>
@@ -187,7 +191,7 @@ And now add a class `post` to your `div` containing a blog post.
187
191
188
192
We will now add declaration blocks to different selectors. Selectors starting with `.` relate to classes. There are many great tutorials and explanations about CSS on the Web to help you understand the following code. For now, just copy and paste it into your `blog/static/css/blog.css` file:
189
193
190
-
```css
194
+
```css:blog/static/css/blog.css
191
195
.page-header {
192
196
background-color: #ff9400;
193
197
margin-top: 0;
@@ -239,7 +243,7 @@ h1, h2, h3, h4 {
239
243
240
244
Then surround the HTML code which displays the posts with declarations of classes. Replace this:
241
245
242
-
```html
246
+
```html:blog/templates/blog/post_list.html
243
247
{% for post in posts %}
244
248
<div class="post">
245
249
<p>published: {{ post.published_date }}</p>
@@ -251,7 +255,7 @@ Then surround the HTML code which displays the posts with declarations of classe
251
255
252
256
in the `blog/templates/blog/post_list.html` with this:
Copy file name to clipboardExpand all lines: en/django_orm/README.md
+76-35Lines changed: 76 additions & 35 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -14,12 +14,16 @@ It's easiest to learn by example. Let's try this, shall we?
14
14
15
15
Open up your local console (not on PythonAnywhere) and type this command:
16
16
17
-
(myvenv) ~/djangogirls$ python manage.py shell
17
+
```:command-line
18
+
(myvenv) ~/djangogirls$ python manage.py shell
19
+
```
18
20
19
21
The effect should be like this:
20
22
21
-
(InteractiveConsole)
22
-
>>>
23
+
```python:command-line
24
+
(InteractiveConsole)
25
+
>>>
26
+
```
23
27
24
28
You're now in Django's interactive console. It's just like Python prompt but with some additional Django magic :). You can use all the Python commands here too, of course.
25
29
@@ -28,19 +32,25 @@ You're now in Django's interactive console. It's just like Python prompt but wit
28
32
29
33
Let's try to display all of our posts first. You can do that with the following command:
30
34
31
-
>>> Post.objects.all()
32
-
Traceback (most recent call last):
33
-
File "<console>", line 1, in <module>
34
-
NameError: name 'Post' is not defined
35
+
```python:command-line
36
+
>>> Post.objects.all()
37
+
Traceback (most recent call last):
38
+
File "<console>", line 1, in <module>
39
+
NameError: name 'Post' is not defined
40
+
```
35
41
36
42
Oops! An error showed up. It tells us that there is no Post. It's correct -- we forgot to import it first!
37
43
38
-
>>> from blog.models import Post
44
+
```python:command-line
45
+
>>> from blog.models import Post
46
+
```
39
47
40
48
This is simple: we import model `Post` from `blog.models`. Let's try displaying all posts again:
41
49
42
-
>>> Post.objects.all()
43
-
[<Post: my post title>, <Post: another post title>]
50
+
```python:command-line
51
+
>>> Post.objects.all()
52
+
[<Post: my post title>, <Post: another post title>]
53
+
```
44
54
45
55
It's a list of the posts we created earlier! We created these posts using the Django admin interface. However, now we want to create new posts using Python, so how do we do that?
46
56
@@ -49,33 +59,45 @@ It's a list of the posts we created earlier! We created these posts using the Dj
49
59
50
60
This is how you create a new Post object in database:
[<Post: my post title>, <Post: another post title>, <Post: Sample title>]
97
+
```python:command-line
98
+
>>> Post.objects.all()
99
+
[<Post: my post title>, <Post: another post title>, <Post: Sample title>]
100
+
```
79
101
80
102
There it is, one more post in the list!
81
103
@@ -89,46 +111,63 @@ You can now have a little fun and add more posts to see how it works. Add 2-3 mo
89
111
90
112
A big part of QuerySets is an ability to filter them. Let's say, we want to find all posts that are authored by User ola. We will use `filter` instead of `all` in `Post.objects.all()`. In parentheses we will state what condition(s) needs to be met by a blog post to end up in our queryset. In our situation it is `author` that is equal to `me`. The way to write it in Django is: `author=me`. Now our piece of code looks like this:
91
113
92
-
>>> Post.objects.filter(author=me)
93
-
[<Post: Sample title>, <Post: Post number 2>, <Post: My 3rd post!>, <Post: 4th title of post>]
114
+
```python:command-line
115
+
>>> Post.objects.filter(author=me)
116
+
[<Post: Sample title>, <Post: Post number 2>, <Post: My 3rd post!>, <Post: 4th title of post>]
117
+
```
94
118
95
119
Or maybe we want to see all the posts that contain a word 'title' in the `title` field?
96
120
97
-
>>> Post.objects.filter(title__contains='title')
98
-
[<Post: Sample title>, <Post: 4th title of post>]
121
+
```python:command-line
122
+
>>> Post.objects.filter(title__contains='title')
123
+
[<Post: Sample title>, <Post: 4th title of post>]
124
+
```
99
125
100
126
> **Note** There are two underscore characters (`_`) between `title` and `contains`. Django's ORM uses this syntax to separate field names ("title") and operations or filters ("contains"). If you only use one underscore, you'll get an error like "FieldError: Cannot resolve keyword title_contains".
101
127
102
128
You can also get a list of all published posts. We do it by filtering all the posts that have `published_date` set in the past:
0 commit comments