Leanpub Header

Skip to main content

Build Blog With Wagtail CMS (4.0.0)

Learn Wagtail CMS from scratch!

This book will teach you how to build a modern blog with Wagtail CMS

The author is letting you choose the price you pay for this book!

Pick Your Price...
PDF
184
Pages
About

About

About the Book

Demo Link

This book will teach you how to build a modern blog with Wagtail CMS

By the end of this course, you will be able to:

  1. Understand Docker and use Docker Compose to do development
  2. Use python-webpack-boilerplate to jump start frontend project bundled by Webpack.
  3. Install Tailwind CSS as the style solution.
  4. Install Stimulus, understand how it works and write Stimulus controllers.
  5. Learn how Dark Mode works in Tailwind CSS and use Stimulus controller to toggle the dark mode.
  6. Understand the benefit of the healthy Stimulus ecosystem by reusing 3-party Stimulus controller.
  7. Create blog models to work with Wagtail.
  8. Use PDB and Django shell to debug, test code and check data in terminal.
  9. Learn to use RoutablePage and add Date to the post url.
  10. Build Pagination component and correctly handle querystring.
  11. Make the blog supports writing in Markdown and Latex.
  12. Create contact page using Wagtail FormBuilder
  13. Build menu, meta tags, sitemap, robots.txt for better SEO.
  14. Build comment system based on django-contrib-comments which support Generic Relations
  15. Use Tribute.jsAxios to add Mention and Emoji support to the comment form.
  16. Deploy the production app to DigitalOcean

Tech

  • Python 3.10
  • Django 4
  • Wagtail 4
  • Stimulus 3
  • Tailwind CSS 3

This book includes:

  1. A PDF ebook which contains about 30 chapters.
  2. 20+ screenshots and several diagrams, all created by me.

Changelog:

4.0.0 Released 2022-11-07

  1. Drop Bootstrap, and use Tailwind CSS as style solution.
  2. Use Stimulus to help write Javascript.
  3. Upgrade Django, Wagtail, update the screenshots.

3.0.0 Released 2021-08-23

  1. Upgrade Django, Wagtail, update the screenshots.
  2. Import python-webpack-boilerplate as frontend solution
  3. Upgrade Bootstrap 5, drop jQuery, write DOM related code with vanilla JavaScript

2.0.0 Released 2021-01-09

  1. Rewrite the book and source code, update the screenshots.
  2. Add content about docker-compose and docker
  3. Add content about the django-contrib-comments
  4. Add content about the Webpack

1.0.0 Released 2017-09-13

Share this book

Categories

Price

Pick Your Price...

Minimum price

$23.99

$29.99

You pay

$29.99

Author earns

$23.99
$

All prices are in US $. You can pay in US $ or in your local currency when you check out.

EU customers: prices exclude VAT, which is added during checkout.

...Or Buy With Credits!

Number of credits (Minimum 2)

2
The author will earn $24.00 from your purchase!
You can get credits monthly with a Reader Membership

Author

About the Author

MichaelYin

Michael Yin is a full stack developer from China, and he loves to write high-quality tutorial about programming.

He has published 5 books on Leanpub.

He also published Celery courses on testdriven.io

He is also the founder of a Digital Agency AccordBox and available for remote job.

Contents

Table of Contents

Preface

  1. Why I wrote this book
  2. Who is this book for
  3. What you should know before reading
  4. What if you have problem or suggestions

Wagtail Tutorials #1: Create Wagtail Project

  1. Introduction
  2. Step 1: Install Wagtail
  3. Step 2: Project structure
  4. Step 3: Start to play with templates
  5. Conclusion

Wagtail Tutorials #2: Create Page Model

  1. Introduction
  2. Step 1: Start to play with the page model
  3. Step 2: Hierarchical tree
  4. Step 3: Create templates to show the content
  5. Conclusion

Wagtail Tutorials #3: Category And Tag Support

  1. Introduction
  2. Categories
  3. Tags
  4. Show tags and categories in templates
  5. Conclusion

Wagtail Tutorials #4: Routable Page

  1. Introduction
  2. Router
  3. Customizing context
  4. Reversing route urls
  5. Conclusion

Wagtail Tutorials #5: Customize Blog Post URL

  1. Introduction
  2. Add date info into blog post url
  3. Reversing post urls
  4. Conclusion

Wagtail Tutorials #6: Import Bootstrap Theme Into Wagtail Blog

  1. Introduction
  2. Import bootstrap theme
  3. Modify template
  4. Template tags
  5. Use Django-el-pagination to provide pagination in wagtail
  6. Conclusion

Wagtail Tutorials #7: Add Search Function In Wagtail Blog

  1. Introduction
  2. Basic search function
  3. Add search form to template
  4. How to search multiple fields at one time?
  5. Some notes about search backend in Wagtail
  6. If you are also using Haystack
  7. Conclusion

Wagtail Tutorials #8: Add Markdown Support In Wagtail Blog

  1. Introduction
  2. Import new MarkdownField and MarkdownPanel
  3. SimpleMDE-Markdown-Editor
  4. Render Markdown
  5. Other Wagtail markdown resources
  6. Conclusion

Wagtail Tutorials #9: Add LaTeX Support & Code Highlight In Wagtail

  1. Introduction
  2. Add code highlight support
  3. Add LaTeX support
  4. Conclusion

Wagtail Tutorials #10: Add Comment Support In Wagtail Blog

  1. Introduction
  2. Should I build new comment system or integrate 3 party comment service
  3. Create new Disqus account and config
  4. Integrate Disqus to Wagtail blog
  5. Important notes:
  6. Conclusion

Wagtail Tutorial #11: How to use StreamField in Wagtail

  1. Introduction
  2. What is the difference between RichText, Markdown, and StreamField
  3. Basic concepts you should know
  4. Get started
  5. Custom Block
  6. Create page using streamfield
  7. Wagtail streamfield resources
  8. Conclusion

Wagtail Tutorial #12: How to Create and Manage Menus of Wagtail application

  1. Introduction
  2. Prerequisites
  3. Step 1 — Inspect Page object in Wagtail
  4. Step 2 — Basic Menu Implementation
  5. Step 3 — Change page order in Wagtail menu
  6. Step 4 — Install wagtailmenus
  7. Step 5 — Render menu using wagtailmenus
  8. Conclusion

How to do A/B Testing in Wagtail CMS

  1. Introduction
  2. Step 1: Install wagtail-experiments
  3. Step 2: Setup A/B test in Wagtail admin
  4. Step 3: Check A/B test to see if it work
  5. Step 4: How wagtail experiments work
  6. Step 5: How to make js work with wagtail-experiments
  7. Step 5: How to a/b test page design
  8. Step 6: Something you should know
  9. Conclusion

How to build form page in Wagtail

  1. Introduction
  2. Prerequisites
  3. Step 1 - Create Model
  4. Step2 - Create Template
  5. Step3 - Config Email Test Env
  6. Step4 - Enjoy Wagtail’s Powerful FormBuilder
  7. Step5 - Check Submissions
  8. Conclusion

How to build a landing page using Wagtail CMS

  1. Introduction
  2. Step 1 - Analyze the landing page template, build data models
  3. Step 2 - Implement custom data models using Streamfield of Wagtail
  4. Step 3 - Use Formbuilder of Wagtail to build form
  5. Conclusion

How to make your Wagtail/Django project have good Python coding style

  1. Introduction
  2. PEP8
  3. flake8
  4. Autopep8
  5. isort
  6. Makefile
  7. Check Python coding style in CI job
  8. Conclusion

How to support multi-language in Wagtail CMS

  1. Introduction
  2. Preparation
  3. Solution 1: Page tree
  4. Solution 2: Model Translation
  5. Conclusion

Wagtail Tip #1: How to replace ParentalManyToManyField with InlinePanel

  1. Introduction
  2. Step 1 - Add ParentalManyToManyField to your project
  3. Step 2 - Find out the problem
  4. Step 3 - How to replace ParentalManyToManyField
  5. Step 4 - Check again in Wagtail admin
  6. Conclusion

Wagtail Tip #2: How to Export & Restore Wagtail Site

  1. Introduction
  2. Step 1: Learn basic concepts
  3. Step2: Skip unnecessary models
  4. Step3: Dumpdata
  5. Step4: How to troubleshoot
  6. Conclusion

How to use SCSS/SASS in your Django project (Python Way)

  1. Introduction
  2. What is the difference between CSS, SCSS, SASS
  3. What is the benefit when using SCSS
  4. What is the SCSS workflow
  5. What if you already have some CSS files in my Django project
  6. Start using SCSS in Django project
  7. Deploy SCSS in Django project
  8. Advantages and Disadvantages of django_compressor solution
  9. Conclusion

How to use SCSS/SASS in your Django project (NPM Way)

  1. Introduction
  2. Prerequisite
  3. Step 1: Directory structure and workflow
  4. Step 2: Install NPM dependencies
  5. Step 3: Setup NPM command
  6. Step 4: SCSS/SASS Auto Compile feature
  7. Step 5: How to check code style of your SCSS/SASS
  8. Step 6: NPM config
  9. Step 7: How to deploy it using Docker
  10. Some Tips
  11. Pros and Cons of NPM solution
  12. Conclusion

How to deploy Django project to Heroku using Docker

  1. Introduction
  2. Heroku Buildpacks and Heroku Container
  3. Build manifest and Container Registry
  4. Docker Build vs Docker Run
  5. Step1: Start to write Dockerfile
  6. Step2: Build Docker image
  7. Step3: Docker run
  8. Step4: Serving static assets on Heroku
  9. Step5: Serving media files on Heroku
  10. Step6: Remote DB support
  11. Step7: heroku.xml
  12. Step8: Deploy the Django project to Heroku
  13. Step9: Add DB add-on
  14. Tips
  15. Conclusion

How to deploy Django project to Dokku

  1. Introduction
  2. Install Dokku
  3. Config Dokku Server
  4. Config Dokku App
  5. Config our Django project
  6. Deploy project
  7. Some Advanced issues
  8. Short reviews from Accordbox
  9. Conclusion

How to deploy Django project to Dokku with Docker

  1. Introduction
  2. Heroku Buildpacks and Dockerfile
  3. Install Dokku
  4. Config Dokku Server
  5. Config Dokku App
  6. Config our Django project
  7. Deploy project
  8. Some Advanced issues
  9. Short reviews from Accordbox
  10. Conclusion

The Leanpub 60 Day 100% Happiness Guarantee

Within 60 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.

Now, this is technically risky for us, since you'll have the book or course files either way. But we're so confident in our products and services, and in our authors and readers, that we're happy to offer a full money back guarantee for everything we sell.

You can only find out how good something is by trying it, and because of our 100% money back guarantee there's literally no risk to do so!

So, there's no reason not to click the Add to Cart button, is there?

See full terms...

Earn $8 on a $10 Purchase, and $16 on a $20 Purchase

We pay 80% royalties on purchases of $7.99 or more, and 80% royalties minus a 50 cent flat fee on purchases between $0.99 and $7.98. You earn $8 on a $10 sale, and $16 on a $20 sale. So, if we sell 5000 non-refunded copies of your book for $20, you'll earn $80,000.

(Yes, some authors have already earned much more than that on Leanpub.)

In fact, authors have earned over $14 million writing, publishing and selling on Leanpub.

Learn more about writing on Leanpub

Free Updates. DRM Free.

If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).

Most Leanpub books are available in PDF (for computers) and EPUB (for phones, tablets and Kindle). The formats that a book includes are shown at the top right corner of this page.

Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.

Learn more about Leanpub's ebook formats and where to read them

Write and Publish on Leanpub

You can use Leanpub to easily write, publish and sell in-progress and completed ebooks and online courses!

Leanpub is a powerful platform for serious authors, combining a simple, elegant writing and publishing workflow with a store focused on selling in-progress ebooks.

Leanpub is a magical typewriter for authors: just write in plain text, and to publish your ebook, just click a button. (Or, if you are producing your ebook your own way, you can even upload your own PDF and/or EPUB files and then publish with one click!) It really is that easy.

Learn more about writing on Leanpub