springload / madewithwagtail

A showcase of sites and apps made with Wagtail CMS, the easy to use, open source Django content management system

Made with Wagtail

A showcase of sites and apps made with Wagtail: an easy to use, open source content management system from Torchbox.

Check out Awesome Wagtail for more awesome packages and resources from the Wagtail community.

Back End Setup

Development on this project can be done using docker. If you have not yet installed docker, consult the instructions for your operating system.

Docker

It's a good idea to set up the nginx proxy if you have not done so already, instructions can be found on the github repo.

Vagrant is no longer in this project, and any material relating to vagrant can be ignored.

Clone the repo

cd [my-dev-environment]
git clone [e-mail]:springload/madewithwagtail.git
cd madewithwagtail

Setup your environment variables

cp dev.env.example dev.env

And then edit dev.env to suit your local setup. Any API keys etc should be in Bitwarden.

Database setup

First, download the database dump you want from our Google Cloud storage.

Next decrypt the dump using gpg.

Finally, place the decrypted .sql file into [my-dev-environment]/madewithwagtail/docker/database - it will be automatically loaded when you build your database container in the next section.

Build your containers

docker-compose up
# In another terminal tab run:
docker-compose exec application ./manage.py migrate

Browsing locally

https://madewithwagtail.dev.springload.nz/

Front End

This project uses nvm and Yarn

# Make sure you use the right node version.
nvm use

# Setup
yarn install

# Start the server and the development tools.
yarn run start

# Builds frontend assets.
yarn run build

# Builds frontend production assets.
yarn run dist

# Runs linting.
yarn run lint

# Runs tests.
yarn run test

# View other available commands with:
yarn run

Documentation

Check out the docs/ in their own folder.

Browser support

Supported browser / device versions:

Browser	Device/OS	Version
Mobile Safari	iOS Phone	latest
Mobile Safari	iOS Tablet	latest
Chrome	Android	latest
Edge	Desktop	latest
Chrome	Desktop	latest
Firefox	Desktop	latest
Safari	OSX	latest

New site submissions workflow

Anyone can submit a site on the submission form. When a new site is submitted, the details are saved and also sent to us via an email notification. We then need to manually validate the submission and add the new site via the CMS.

• Check that the submission is valid (see below)
• If the submission isn't valid, we won't add the site to our showcase. Remove it from the CMS.
• If the submission is valid,

1. Look for new submissions https://madewithwagtail.org/admin/forms/submissions/5/ (use the filters at the top to remove already processed dates)
2. Export to CSV
3. For each submission:
   1. Confirm whether it’s a Wagtail website, see Validating submissions.
   2. Find the developer’s profile page or create it if that’s a first submission
   3. Create the website page:
      • Get a screenshot of the website with headless Google Chrome, e.g. google-chrome --headless --hide-scrollbars --disable-gpu --screenshot --window-size=1200,996 https://springload.co.nz/
      • Fill out everything from the submission
      • Notify the developer

Validating submissions

A site is accepted for inclusion on Made with Wagtail if it is made with Wagtail. It's that simple – there is no judgement of a site's quality. In the future, we may change how sites are displayed so some are more prominently visible than others.

To confirm that a site is made with Wagtail,

• Try to go to <site URL>/admin/. If the site uses the default admin URLs, it will redirect you to the Wagtail login page.
• Use the Wappalyzer browser extension. It won't flag Wagtail directly, but it can flag Django / Python, and could also uncover other technologies.
• Look at the homepage HTML to see if static assets are served from /static/, a common URL structure of Django sites.
• Can you find trace of images renditions (e.g. images’ src finish with -max-800 or fill-500x500 or -original or -width-800) in the source? ✅
• Does the page has some meta name="generator" content="..." showing that it was made with Wordpress or Drupal? ❌
• Does the page has some /wp-upload path for the images? ❌
• Look at other ideas to figure it out here #62 ✅ or ❌
• If all of those methods are inconclusive, assume that the site submission is faithful and that the site is indeed built with Wagtail.

Publication hook

We send Slack notifications for every new site page published to Made with Wagtail. To try this locally, set up a local.py setting override with the right settings.