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
Copy file name to clipboardExpand all lines: handling_rich_text.md
+11-7
Original file line number
Diff line number
Diff line change
@@ -16,19 +16,19 @@ Since we want to have the ability to edit a post or comment in markdown, we will
16
16
17
17
> `Rich` is a Python library for writing rich text (with color and style) to the terminal, and for displaying advanced content such as tables, markdown, and syntax highlighted code.
18
18
19
-
With our form set up, there is no way that you can style your comment before it is posted. What we want to show users as they are typing their comments is something as this:
19
+
With our form set up, there is no way that you can style your comment before it is posted. What we want to show users as they are typing their comments is something like this:
20
20
21
21

22
22
23
-
There is a`flask-pagedown` extension we can use to enable client side markdown preview. Let us go ahead and install it:
23
+
There is the`flask-pagedown` extension we can use to enable client side markdown preview. Let us go ahead and install it:
24
24
25
25
```python
26
26
$ pip3 install flask-pagedown
27
27
```
28
28
29
29
The `flask-pagedown` extension needs to be registered in our application instance:
30
30
31
-
`app/__init__.py: Register pagedown extension`
31
+
`app/__init__.py`: Register pagedown extension
32
32
```python
33
33
from flask_pagedown import PageDown
34
34
@@ -38,7 +38,7 @@ pagedown = PageDown(app)
38
38
39
39
The Editor is supported through two Javascript files. To include these files in your HTML document, you will need to call `pagedown.html_head()` from inside the `<head>` element of your page:
40
40
41
-
`app/templates/base.html: Include pagedown in template`
41
+
`app/templates/base.html`: Include pagedown in template
42
42
```html
43
43
{% block head %}
44
44
{{ super() }}
@@ -49,8 +49,9 @@ The Javascript files are loaded from a CDN, the files do not need to be hosted b
49
49
50
50
## Update Form with `PageDownField`
51
51
52
-
The extesion exports a `PagDownField` which is very similar to and works exactly as `TextAreaField`:
52
+
The extention exports a `PagDownField` which is very similar to and works exactly as `TextAreaField`:
53
53
54
+
`app/forms.py`: Create form
54
55
```python
55
56
from flask_wtf import FlaskForm
56
57
from flask_pagedown.fields import PageDownField #<---------------New
@@ -78,7 +79,7 @@ First, we need to install the `flask-sqlalchemy` extension:
78
79
Then, we need to add the `db` variable to our application instance:
79
80
80
81
81
-
`app/__init__.py: Add db variable`
82
+
`app/__init__.py`: Add db variable
82
83
```python
83
84
# ...
84
85
from flask_sqlalchemy import SQLAlchemy
@@ -90,7 +91,7 @@ db = SQLAlchemy(app)
90
91
The application expects certain configuration variables to be set in the `config.py` file. Add the following to the `config` module:
91
92
92
93
93
-
`config.py: Add db configuration`
94
+
`config.py`: Add db configuration
94
95
```python
95
96
# ...
96
97
@@ -152,6 +153,9 @@ The HTML code for the rendered blog post is cached in a new field added to the C
152
153
153
154
## Update the Comment Table
154
155
156
+
First, we need to add a `html` field to the table. We can do this by adding the following to the `Comment` model:
0 commit comments