wagtail は、
Blog 用途で
個人的な
結果を
[TOC]
前提
以下の
OS
% sw_vers ProductName: Mac OS X ProductVersion: 10.13.1 BuildVersion: 17B1003
Python の
Version % python3 -V Python 3.6.2
Blog作成
Blog アプリケーションの 作成
Blog 用の
python3 manage.py startapp blog
BlogIndexPage の 作成
作成した blog アプリケーションの、models.py
に、
- blog/models.py
from wagtail.wagtailcore.models import Page from wagtail.wagtailcore.fields import RichTextField from wagtail.wagtailadmin.edit_handlers import FieldPanel class BlogIndexPage(Page): intro = RichTextField(blank=True) content_panels = Page.content_panels + [ FieldPanel('intro', classname="full") ]
この BlogIndexPage に
- blog/templates/blog/blog_index_page.html
{% extends "base.html" %} {% load wagtailcore_tags %} {% block body_class %}template-blogindexpage{% endblock %} {% block content %} <h1>{{ page.title }}</h1> <div class="intro">{{ page.intro|richtext }}</div> {% for post in page.get_children %} <h2><a href="{% pageurl post %}">{{ post.title }}</a></h2> {{ post.specific.intro }} {{ post.specific.body|richtext }} {% endfor %} {% endblock %}
BlogPage の 作成
model.py
に
BlogIndexPage に
blog/models.py
from django.db import models # Create your models here. from wagtail.wagtailcore.models import Page from wagtail.wagtailcore.fields import RichTextField from wagtail.wagtailadmin.edit_handlers import FieldPanel from wagtail.wagtailsearch import index class BlogIndexPage(Page): intro = RichTextField(blank=True) content_panels = Page.content_panels + [ FieldPanel('intro', classname="full") ] class BlogPage(Page): date = models.DateField("Post date") intro = models.CharField(max_length=250) body = RichTextField(blank=True) search_fields = Page.search_fields + [ index.SearchField('intro'), index.SearchField('body'), ] content_panels = Page.content_panels + [ FieldPanel('date'), FieldPanel('intro'), FieldPanel('body', classname="full"), ]
blog/templates/blog/blog_page.html
{% extends "base.html" %} {% load wagtailcore_tags %} {% block body_class %}template-blogpage{% endblock %} {% block content %} <h1>{{ page.title }}</h1> <p class="meta">{{ page.date }}</p> <div class="intro">{{ page.intro }}</div> {{ page.body|richtext }} <p><a href="{{ page.get_parent.url }}">Return to blog</a></p> {% endblock %}
Migrationを 実施
Migration をbase.py
の INSTALLED_APPS
にblog
アプリケーションを
アプリケーションの
追加 # Application definition INSTALLED_APPS = [ 'home', 'search', 'blog',
Migrationの
実行 python3 manage.py makemigrations python3 manage.py migrate
Blog の 投稿を してみる
この状態で
サーバ起動
python3 manage.py runserver
ログイン
http://127.0.0.1:8000/admin/
からログインします。 ページメニューから
遷移
左メニューから、サイトの Root ページ に 遷移します。 Rootページ
既存サイトにページ追加する 場合は、 Home ページの 子ページと して、 ページは 追加する 旨の 説明が あります。
Home ページ配下に移動します。 子ページを
追加を クリック
HOMEページに移動して、 子ページを 追加を クリックします。 BlogIndexページを
追加
Blog Index Page を追加します。 コンテンツの
内容の 入力 コンテンツの 内容を 入力して、 プロモート
タブをクリックします。 URLの
変更
スラッグに、URL を 入力します。 HOME が ドメイン直下で、 ドメイン直下からの URLに なります。
この場合は、 http://127.0.0.1/blog
でアクセスできます。
入力後画面下部のプルダウンから 公開を 選択します。 Blogページを
追加
続いて BlogIndex ページの子ページと して、 Blog ページを 追加します。
手順はBlogIndex 追加時と 同様です。 以下は Blog ページを 3ページ子ページと して 追加しています。 フロント側から
閲覧
以下のように表示されます。
wagtail の 機能に ついて 補足
以下、
{% for post in page.get_children %}
について
page.get_children
で、表示対象ページの 子ページが 取得できます。
今回の場合、 BlogIndex の 子ページと して、 3ページあるので、 それらが 取得されています。 page.get_parent.url
について
表示対象ページの親ページの URLが 取得できます。 content_panels
について
model のcontent_panels
ですが、この List に 追加した フィールドが ADMIN で 編集可能に なります。
試しに削除してみた ところ、 ADMIN に 対象項目が 表示されなくなりました。
このほかにも、
以上です。
コメント