Browse Source

Formatting documentation for whitespace fixes

Also include actual footnote reference for upgrading patch release note
LB Johnston 1 year ago
parent
commit
b41e196489

+ 3 - 3
.github/CONTRIBUTING.md

@@ -32,9 +32,9 @@ We welcome code reviews from everyone. There's always a list of pull requests ta
 
 We welcome help with triaging issues and pull requests. You can help by:
 
-- Adding more details or your own perspective to bug reports or feature requests.
-- Attempting to reproduce issues tagged [status:Unconfirmed](https://github.com/wagtail/wagtail/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc+label%3Astatus%3AUnconfirmed) and sharing your findings.
-- Reviewing or otherwise offering your feedback on pull requests.
+-   Adding more details or your own perspective to bug reports or feature requests.
+-   Attempting to reproduce issues tagged [status:Unconfirmed](https://github.com/wagtail/wagtail/issues?q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc+label%3Astatus%3AUnconfirmed) and sharing your findings.
+-   Reviewing or otherwise offering your feedback on pull requests.
 
 View our [issue tracking guidelines](https://docs.wagtail.org/en/latest/contributing/issue_tracking.html) for more information.
 

+ 2 - 2
docs/advanced_topics/customisation/page_editing_interface.md

@@ -240,12 +240,12 @@ so the form field for a model field can be overridden by adding it to the custom
 .. class:: wagtail.admin.forms.CopyForm
 ```
 
-When copying a page, Wagtail will generate a form to allow the user to modify the copied page. By default, this form subclasses [CopyForm](wagtail.admin.forms.CopyForm). A custom base form class can be configured by setting the `copy_form_class` attribute on any model. Custom forms must subclass [CopyForm](wagtail.admin.forms.CopyForm). 
+When copying a page, Wagtail will generate a form to allow the user to modify the copied page. By default, this form subclasses [CopyForm](wagtail.admin.forms.CopyForm). A custom base form class can be configured by setting the `copy_form_class` attribute on any model. Custom forms must subclass [CopyForm](wagtail.admin.forms.CopyForm).
 
 This can be used to specify alterations to the copied form on a per-model basis.
 
 For example, auto-incrementing the slug field:
-    
+
 ```python
 from django import forms
 from django.db import models

+ 1 - 6
docs/advanced_topics/documents/overview.md

@@ -38,7 +38,7 @@ New documents saved are stored in the [reference index](managing_the_reference_i
 
 ## Using documents in a Page
 
-To include a document file in a Wagtail page, you can use `FieldPanel` in your page model. 
+To include a document file in a Wagtail page, you can use `FieldPanel` in your page model.
 
 Here's an example:
 
@@ -87,10 +87,8 @@ Here's an example template to access the document field and render it:
 
 Links to documents can be made in pages using the [`RichTextField`](rich_text_field). By default, Wagtail will include the features for adding links to documents see [](rich_text_features).
 
-
 You can either exclude or include these by passing the `features` to your `RichTextField`. In the example below we create a `RichTextField` with only documents and basic formatting.
 
-
 ```python
 # models.py
 from wagtail.fields import RichTextField
@@ -108,8 +106,6 @@ class BlogPage(Page):
     ]
 ```
 
-
-
 ## Using documents within `StreamField`
 
 `StreamField` provides a content editing model suitable for pages that do not follow a fixed structure. To add links to documents using `StreamField`, include it in your models and also include the `DocumentChooserBlock`.
@@ -148,7 +144,6 @@ In `blog_page.html`, add the following block of code to display the document lin
 {% endfor %}
 ```
 
-
 ## Working documents and collections
 
 Documents in Wagtail can be organized within [collections](https://docs.wagtail.org/en/v4.0/editor_manual/documents_images_snippets/collections.html). Collections provide a way to group related documents. You can cross-link documents between collections and make them accessible through different parts of your site.

+ 5 - 5
docs/contributing/ui_guidelines.md

@@ -63,8 +63,8 @@ Wagtail uses most of Tailwind’s core plugins, with an override for them to cre
 
 With utility classes, we recommend to:
 
-- Keep their number to a reasonable maximum, creating component styles instead if the utilities are inter-dependent, or if they are frequently reused together.
-- Avoid utilities relating to font size, weight, or other typographic considerations. Instead, use the higher-level type scale as defined in `typography.js`.
+-   Keep their number to a reasonable maximum, creating component styles instead if the utilities are inter-dependent, or if they are frequently reused together.
+-   Avoid utilities relating to font size, weight, or other typographic considerations. Instead, use the higher-level type scale as defined in `typography.js`.
 
 ### Sass usage
 
@@ -147,9 +147,9 @@ This is an area of active improvement for Wagtail, with [ongoing discussions](ht
 
 We support right-to-left languages, and in particular viewing the Wagtail admin interface in a horizontally mirrored layout. Here are guidelines to guarantee support:
 
-- Write styles with [logical properties and values](https://rtlstyling.com/posts/rtl-styling#css-logical-properties) whenever possible.
-- For styles that can only be written with physical properties (translations, background positions), use the `--w-direction-factor` variable equal to 1 or -1 so the value reverses based on the `dir` attribute of the element or page.
-- As a last resort, use `[dir='rtl']` style if there is no other way to write styles.
+-   Write styles with [logical properties and values](https://rtlstyling.com/posts/rtl-styling#css-logical-properties) whenever possible.
+-   For styles that can only be written with physical properties (translations, background positions), use the `--w-direction-factor` variable equal to 1 or -1 so the value reverses based on the `dir` attribute of the element or page.
+-   As a last resort, use `[dir='rtl']` style if there is no other way to write styles.
 
 Make sure to also reverse the direction of any position calculation in JavaScript, as there is no support of logical values in DOM APIs (x-axis offsets always from the left).
 

+ 2 - 2
docs/releases/upgrading.md

@@ -60,7 +60,7 @@ The compatible versions of Django and Python for each Wagtail release are:
 | Wagtail release | Compatible Django versions | Compatible Python versions |
 | --------------- | -------------------------- | -------------------------- |
 | 6.0             | 4.2, 5.0                   | 3.8, 3.9, 3.10, 3.11, 3.12 |
-| 5.2 LTS         | 3.2, 4.1, 4.2, 5.0*        | 3.8, 3.9, 3.10, 3.11, 3.12 |
+| 5.2 LTS         | 3.2, 4.1, 4.2, 5.0[^*]     | 3.8, 3.9, 3.10, 3.11, 3.12 |
 | 5.1             | 3.2, 4.1, 4.2              | 3.8, 3.9, 3.10, 3.11       |
 | 5.0             | 3.2, 4.1, 4.2              | 3.7, 3.8, 3.9, 3.10, 3.11  |
 | 4.2             | 3.2, 4.0, 4.1              | 3.7, 3.8, 3.9, 3.10, 3.11  |
@@ -107,4 +107,4 @@ The compatible versions of Django and Python for each Wagtail release are:
 | 0.2             | 1.6                        | 2.7                        |
 | 0.1             | 1.6                        | 2.7                        |
 
-* Added in a patch release
+[^*]: Added in a patch release

+ 3 - 2
docs/tutorial/create-footer_for_all_pages.md

@@ -238,8 +238,9 @@ To add your footer text, go to your [admin interface](https://guide.wagtail.org/
 In this tutorial, you'll use a custom template tag to display your footer text.
 
 In your `base` folder, create a `templatetags` folder. Within your new `templatetags` folder, create the following files:
-- `__init__.py`
-- `navigation_tags.py`
+
+-   `__init__.py`
+-   `navigation_tags.py`
 
 Leave your `base/templatetags/__init__.py` file blank and add the following to your `base/templatetags/navigation_tags.py` file:
 

+ 2 - 2
docs/tutorial/create_contact_page.md

@@ -119,7 +119,7 @@ Now, migrate your database by running `python manage.py makemigrations` and then
 
 To add contact information to your portfolio site, follow these steps:
 
-1. Create a **Form page** as a child page of **Home** by following these steps:  
+1. Create a **Form page** as a child page of **Home** by following these steps:
 
     a. Restart your server.  
     b. Go to your admin interface.  
@@ -127,7 +127,7 @@ To add contact information to your portfolio site, follow these steps:
     d. Click `Home`.  
     e. Click the `...` icon at the top of the resulting page.  
     f. Click `add child page`.  
-    g. Click `Form page`.  
+    g. Click `Form page`.
 
 2. Add the necessary data.
 3. Publish your `Form Page`.

+ 21 - 22
docs/tutorial/create_portfolio_page.md

@@ -6,7 +6,7 @@ We’ve just released this new tutorial. Do you want to provide feedback? Please
 
 A portfolio page is a web page that has your resume or Curriculum Vitae (CV). The page will give potential employers a chance to review your work experience.
 
-This tutorial shows you how to add a portfolio page to your portfolio site using the Wagtail StreamField. 
+This tutorial shows you how to add a portfolio page to your portfolio site using the Wagtail StreamField.
 
 First, let's explain what StreamField is.
 
@@ -14,7 +14,7 @@ First, let's explain what StreamField is.
 
 StreamField is a feature that was created to balance the need for developers to have well-structured data and the need for content creators to have editorial flexibility in how they create and organize their content.
 
-In traditional content management systems, there's often a compromise between structured content and giving editors the freedom to create flexible layouts. Typically, Rich Text fields are used to give content creators the tools they need to make flexible and versatile content. Rich Text fields can provide a WYSIWYG editor for formatting. However, Rich Text fields have limitations. 
+In traditional content management systems, there's often a compromise between structured content and giving editors the freedom to create flexible layouts. Typically, Rich Text fields are used to give content creators the tools they need to make flexible and versatile content. Rich Text fields can provide a WYSIWYG editor for formatting. However, Rich Text fields have limitations.
 
 One of the limitations of Rich Text fields is the loss of semantic value. Semantic value in content denotes the underlying meaning or information conveyed by the structure and markup of content. When content lacks semantic value, it becomes more difficult to determine its intended meaning or purpose. For example, when editors use Rich Text fields to style text or insert multimedia, the content might not be semantically marked as such.
 
@@ -124,7 +124,6 @@ The first child block, `heading_text`, uses `CharBlock` for specifying the headi
 
 Your `BaseStreamBlock` class inherits from `StreamBlock`. `StreamBlock` defines a set of child block types that you would like to include in all of the StreamField sections across a project. This class gives you a baseline collection of common blocks that you can reuse and customize for all the different page types where you use StreamField. For example, you will definitely want editors to be able to add images and paragraph text to all their pages, but you might want to create a special pull quote block that is only used on blog pages.
 
-
 ```python
 class BaseStreamBlock(StreamBlock):
     heading_block = HeadingBlock()
@@ -144,7 +143,7 @@ Also, you defined a `Meta` class within your `ImageBlock` and `HeadingBlock` blo
 Wagtail provides built-in templates to render each block. However, you can override the built-in template with a custom template.
 ```
 
-Finally, you must add the custom templates that you defined in the `Meta` classes of your `ImageBlock` and `HeadingBlock` blocks. 
+Finally, you must add the custom templates that you defined in the `Meta` classes of your `ImageBlock` and `HeadingBlock` blocks.
 
 To add the custom template of your `ImageBlock`, create a `base/templates/base/blocks/image_block.html` file and add the following to it:
 
@@ -190,7 +189,7 @@ class PortfolioStreamBlock(BaseStreamBlock):
 
 The preceding code defines a custom block named `PortfolioStreamBlock`, which inherits from `BaseStreamBlock`. The pass statement indicates a starting point. Later in the tutorial, you'll add custom block definitions and configurations to the `PortfolioStreamBlock`.
 
-Now add the following to your 
+Now add the following to your
 `portfolio/models.py` file:
 
 ```python
@@ -241,7 +240,7 @@ Now migrate your database by running `python manage.py makemigrations` and then
 To add more custom blocks to your `PortfolioPage`'s body, modify your `portfolio/blocks.py` file:
 
 ```python
-# import CharBlock, ListBlock, PageChooserBlock, PageChooserBlock, RichTextBlock, and StructBlock: 
+# import CharBlock, ListBlock, PageChooserBlock, PageChooserBlock, RichTextBlock, and StructBlock:
 from wagtail.blocks import (
     CharBlock,
     ListBlock,
@@ -284,7 +283,7 @@ class PortfolioStreamBlock(BaseStreamBlock):
 
 In the preceding code, `CardBlock` has three child blocks, `heading`, `text` and `image`. You are already familiar with the field block types used by the child pages.
 
-However, in your `FeaturedPostsBlock`, one of the child blocks, `posts`, uses `ListBlock`. `ListBlock` is a structural block type that you can use for multiple sub-blocks of the same type.  You used it with `PageChooserBlock` to select only the Blog Page type pages. To better understand structural block types, read the [Structural block types documentation](streamfield_staticblock).
+However, in your `FeaturedPostsBlock`, one of the child blocks, `posts`, uses `ListBlock`. `ListBlock` is a structural block type that you can use for multiple sub-blocks of the same type. You used it with `PageChooserBlock` to select only the Blog Page type pages. To better understand structural block types, read the [Structural block types documentation](streamfield_staticblock).
 
 Furthermore, `icon = "form"` and `icon = "folder-open-inverse"` define custom block icons to set your blocks apart in the admin interface. For more information about block icons, read the [documentation on block icons](block_icons).
 
@@ -334,7 +333,7 @@ Finally, migrate your changes by running `python manage.py makemigrations` and t
 
 To add your resume to your portfolio site, follow these steps:
 
-1. Create a **Portfolio Page** as a child page of **Home** by following these steps:  
+1. Create a **Portfolio Page** as a child page of **Home** by following these steps:
 
     a. Restart your server.  
     b. Go to your admin interface.  
@@ -342,27 +341,27 @@ To add your resume to your portfolio site, follow these steps:
     d. Click `Home`.  
     e. Click the `...` icon at the top of the resulting page.  
     f. Click `add child page`.  
-    g. Click `Portfolio Page`.  
+    g. Click `Portfolio Page`.
 
 2. Add your resume data by following these steps:  
-    a. Use "Resume" as your page title.  
-    b. Click **+** to expand your body section.  
-    c. Click **Paragraph block**.   
-    d. Copy and paste the following text in your new **Paragraph block**:  
+   a. Use "Resume" as your page title.  
+   b. Click **+** to expand your body section.  
+   c. Click **Paragraph block**.  
+   d. Copy and paste the following text in your new **Paragraph block**:
 
     ```text
     I'm a Wagtail Developer with a proven track record of developing and maintaining complex web applications. I have experience writing custom code to extend Wagtail applications, collaborating with other developers, and integrating third-party services and APIs.
-    ```  
+    ```
 
     e. Click **+** below your preceding Paragraph block, and then click **Paragraph block** to add a new Paragraph Block.  
-    f.  Type "/" in the input field of your new Paragraph block and then click **H2 Heading 2**.  
-    g. Use "Work Experience" as your Heading 2.   
+    f. Type "/" in the input field of your new Paragraph block and then click **H2 Heading 2**.  
+    g. Use "Work Experience" as your Heading 2.  
     h. Type "/" below your Heading 2 and click **H3 Heading 3**.  
-    i. Use the following as your Heading 3:  
+    i. Use the following as your Heading 3:
 
     ```
     Wagtail developer at Birdwatchers Inc, United Kingdom
-    ```  
+    ```
 
     j. Type the following after your Heading 3:
 
@@ -373,21 +372,21 @@ To add your resume to your portfolio site, follow these steps:
     - Wrote custom code to extend Wagtail applications, resulting in a 30% reduction in development time and a 15% increase in overall code quality.
     - Collaborated with other developers, designers, and stakeholders to integrate third-party services and APIs, resulting in a 40% increase in application functionality and user satisfaction.
     - Wrote technical documentation and participated in code reviews, providing feedback to other developers and improving overall code quality by 20%.
-    ```  
+    ```
 
     ```{note}
     By starting your sentences with "-", you're writing out your work experience as a Bulletted list. You can achieve the same result by typing "/" in the input field of your Paragraph block and then clicking **Bulleted list**.
     ```
-    
+
     k. Click **+** below your Work experience.  
     l. Click **Paragraph block** to add another Paragraph block.  
     m. Type "/" in the input field of your new Paragraph block and then click **H2 Heading 2**.  
     n. Use "Skills" as the Heading 2 of your new Paragraph block.  
-    o. Copy and paste the following after your Heading 2:  
+    o. Copy and paste the following after your Heading 2:
 
     ```text
     Python, Django, Wagtail, HTML, CSS, Markdown, Open-source management, Trello, Git, GitHub
-    ```  
+    ```
 
 3. Publish your `Portfolio Page`.
 

+ 3 - 3
docs/tutorial/customize_homepage.md

@@ -79,7 +79,7 @@ You might already be familiar with the different parts of your `HomePage` model.
 
 Using `on_delete=models.SET_NULL` ensures that if you remove an image or hero link from your admin interface, the `image` or `hero_cta_link` fields on your Homepage will be set to null, but the rest of the data will be preserved. Read the [Django documentation on the `on_delete` attribute](django.db.models.ForeignKey.on_delete) for more details.
 
-By default, Django creates a reverse relation between the models when you have a `ForeignKey` field within your model. Django also generates a name for this reverse relation using the model name and the `_set` suffix. You can use the default name of the reverse relation to access the model with the `ForeignKey` field from the referenced model.  
+By default, Django creates a reverse relation between the models when you have a `ForeignKey` field within your model. Django also generates a name for this reverse relation using the model name and the `_set` suffix. You can use the default name of the reverse relation to access the model with the `ForeignKey` field from the referenced model.
 
 You can override this default naming behavior and provide a custom name for the reverse relationship by using the `related_name` attribute. For example, if you want to access your `HomePage` from `wagtailimages.Image`, you can use the value you provided for your `related_name` attribute.
 
@@ -103,7 +103,7 @@ To add content to your homepage through the admin interface, follow these steps:
 
 1. Log in to your [admin interface](http://127.0.0.1:8000/admin/), with your admin username and password.
 2. Click Pages.
-3. Click the **pencil**  icon beside **Home**.
+3. Click the **pencil** icon beside **Home**.
 4. Choose an image, choose a page, and add data to the input fields.
 
 ```{note}
@@ -142,6 +142,6 @@ In your Homepage template, notice the use of `firstof` in line 13. It's helpful
 
 Congratulations! You've completed the first stage of your Portfolio website 🎉🎉🎉.
 
-<!-- 
+<!--
 Ask Thibaud if the Resume page is downloadable.
 -->

+ 52 - 52
docs/tutorial/deployment.md

@@ -22,30 +22,30 @@ To serve your images, set up a Backblaze B2 storage following these steps:
 
 1. Visit the Backblaze [website](https://www.backblaze.com) in your browser.
 2. Click **Products** from the top navigation and then select **B2 Cloud Storage** from the dropdown.
-3. Sign up to Backblaze B2 Cloud Storage by following these steps:  
+3. Sign up to Backblaze B2 Cloud Storage by following these steps:
 
     a. Enter your email address and password.  
     b. Select the appropriate region.  
-    c. Click **Sign Up Now**.  
+    c. Click **Sign Up Now**.
 
-4. Verify your email by following these steps:  
+4. Verify your email by following these steps:
 
     a. Go to **Account > My Settings** in your side navigation.  
     b. Click **Verify Email** in the **Security section**.  
     c. Enter your sign-up email address and then click send **Send Code**.  
     d. Check your email inbox or spam folder for the verification email.  
-    e. Click the verification link or use the verification code.  
+    e. Click the verification link or use the verification code.
 
 5. Create a Bucket by going to **B2 Cloud Storage > Bucket** and clicking **Create a Bucket**.
 6. Go to **B2 Cloud Storage > Bucket** and then click **Create a Bucket**.
 7. Add your Bucket information as follows:
 
-| Bucket information | Instruction |
-| -------- | ------- |
-| Bucket Unique Name | Use a unique Bucket name. For example,_yourname-wagtail-portfolio_ |
-| Files in Bucket are | Select **Public** |
-| Default Encryption | Select **Disable** |
-| Object Lock | Select **Disable** |
+| Bucket information  | Instruction                                                        |
+| ------------------- | ------------------------------------------------------------------ |
+| Bucket Unique Name  | Use a unique Bucket name. For example,_yourname-wagtail-portfolio_ |
+| Files in Bucket are | Select **Public**                                                  |
+| Default Encryption  | Select **Disable**                                                 |
+| Object Lock         | Select **Disable**                                                 |
 
 8. Click **Create a Bucket**.
 
@@ -90,16 +90,16 @@ DJANGO_SETTINGS_MODULE=mysite.settings.production
 
 The next step is to provide values for your environment variables. In your `.env.production` file, use your Backblaze B2 bucket information as values for your environment variables as follows:
 
-| Environment variable | Instruction |
-| -------- | ------- |
-| AWS_STORAGE_BUCKET_NAME | Use your Backblaze B2 bucket name |
-| AWS_S3_ENDPOINT_URL | Use the Backblaze B2 endpoint URL. For example, _https://s3.us-east-005.backblazeb2.com_ |
-| AWS_S3_REGION_NAME | Determine your bucket's region from the endpoint URL. For example, if your endpoint URL is _s3.us-east-005.backblazeb2.com_, then your bucket's region is _us-east-005_ |
-| AWS_S3_ACCESS_KEY_ID | Leave this empty for now |
-| AWS_S3_SECRET_ACCESS_KEY | Leave this empty for now |
-| DJANGO_ALLOWED_HOSTS | Leave this empty for now |
-| DJANGO_CSRF_TRUSTED_ORIGINS    | Use _https://_ |
-| DJANGO_SETTINGS_MODULE | Use _mysite.settings.production_ |
+| Environment variable        | Instruction                                                                                                                                                             |
+| --------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| AWS_STORAGE_BUCKET_NAME     | Use your Backblaze B2 bucket name                                                                                                                                       |
+| AWS_S3_ENDPOINT_URL         | Use the Backblaze B2 endpoint URL. For example, _https://s3.us-east-005.backblazeb2.com_                                                                                |
+| AWS_S3_REGION_NAME          | Determine your bucket's region from the endpoint URL. For example, if your endpoint URL is _s3.us-east-005.backblazeb2.com_, then your bucket's region is _us-east-005_ |
+| AWS_S3_ACCESS_KEY_ID        | Leave this empty for now                                                                                                                                                |
+| AWS_S3_SECRET_ACCESS_KEY    | Leave this empty for now                                                                                                                                                |
+| DJANGO_ALLOWED_HOSTS        | Leave this empty for now                                                                                                                                                |
+| DJANGO_CSRF_TRUSTED_ORIGINS | Use _https://_                                                                                                                                                          |
+| DJANGO_SETTINGS_MODULE      | Use _mysite.settings.production_                                                                                                                                        |
 
 In the preceding table, you didn't provide values for your `AWS_S3_ACCESS_KEY_ID`, `AWS_S3_SECRET_ACCESS_KEY`, and `DJANGO_ALLOWED_HOSTS`.
 
@@ -110,22 +110,22 @@ To get values for your `AWS_S3_ACCESS_KEY_ID` and `AWS_S3_SECRET_ACCESS_KEY`, fo
 3. Click **Add a New Application Key**.
 4. Configure the application key settings as follows:
 
-| Setting | Instruction |
-| -------- | ------- |
-| Name of Key | Provide a unique name |
-| Allow access to Buckets | Choose the Backblaze B2 bucket you created earlier |
-| Type of Access | Select **Read and Write** |
-| Allow List All Bucket Names | Leave this unticked |
-| File name prefix | Leave field empty |
-| Duration (seconds) | Leave field empty |
+| Setting                     | Instruction                                        |
+| --------------------------- | -------------------------------------------------- |
+| Name of Key                 | Provide a unique name                              |
+| Allow access to Buckets     | Choose the Backblaze B2 bucket you created earlier |
+| Type of Access              | Select **Read and Write**                          |
+| Allow List All Bucket Names | Leave this unticked                                |
+| File name prefix            | Leave field empty                                  |
+| Duration (seconds)          | Leave field empty                                  |
 
 5. Click **Create New Key**.
 
 Now, use your `keyID` as the value of `AWS_S3_ACCESS_KEY_ID` and `applicationKey` for `AWS_S3_SECRET_ACCESS_KEY` in your `.env.production` file:
 
-| Environment variable | Instruction |
-| -------- | ------- |
-| AWS_S3_ACCESS_KEY_ID | Use your **keyID** |
+| Environment variable     | Instruction                 |
+| ------------------------ | --------------------------- |
+| AWS_S3_ACCESS_KEY_ID     | Use your **keyID**          |
 | AWS_S3_SECRET_ACCESS_KEY | Use your **applicationKey** |
 
 At this stage, the content of your `.env.production` file looks like this:
@@ -218,16 +218,16 @@ If you successfully install flyctl but get an error saying "`fly` is not recogni
 
 8. Create your Fly.io project by running `fly launch` and answering the resulting prompt questions as follows:
 
-| Question | Instruction |
-| -------- | ------- |
-| Choose an app name | Enter a name of your choice. For example, _yourname-wagtail-portfolio_ |
-| Choose a region for deployment | Select the region closest to the _AWS_S3_REGION_NAME_ in your _env.production_ file. |
-| Overwrite ".../.dockerignore"?  | Enter _y_ |
-| Overwrite ".../Dockerfile"?  | Enter _y_ |
-| Would you like to set up a Postgresql database now?  | Enter _y_ |
-| Select configuration | select _Development - Single node, 1x shared CPU, 256MB RAM, 1GB disk_ if available. Otherwise, select the smallest configuration option |
-| Scale single node pg to zero after one hour?  | Enter _y_ |
-| Would you like to set up an Upstash Redis database now? | Enter _n_ |
+| Question                                                | Instruction                                                                                                                              |
+| ------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------- |
+| Choose an app name                                      | Enter a name of your choice. For example, _yourname-wagtail-portfolio_                                                                   |
+| Choose a region for deployment                          | Select the region closest to the _AWS_S3_REGION_NAME_ in your _env.production_ file.                                                     |
+| Overwrite ".../.dockerignore"?                          | Enter _y_                                                                                                                                |
+| Overwrite ".../Dockerfile"?                             | Enter _y_                                                                                                                                |
+| Would you like to set up a Postgresql database now?     | Enter _y_                                                                                                                                |
+| Select configuration                                    | select _Development - Single node, 1x shared CPU, 256MB RAM, 1GB disk_ if available. Otherwise, select the smallest configuration option |
+| Scale single node pg to zero after one hour?            | Enter _y_                                                                                                                                |
+| Would you like to set up an Upstash Redis database now? | Enter _n_                                                                                                                                |
 
 The `fly launch` command creates two new files, `Dockerfile` and `fly.toml`, in your project directory.
 
@@ -236,7 +236,7 @@ If you use a third-party app terminal like the Visual Studio Code terminal, you
 1. Delete `fly.toml` file from your project directory.
 2. Go to your Fly.io account in your browser and click **Dashboard**.
 3. Click the created app in your **Apps** list.
-4. Click **Settings** in your side navigation. 
+4. Click **Settings** in your side navigation.
 5. Click **Delete app**.
 6. Enter the name your app.
 7. Click **Yes delete it**.
@@ -397,7 +397,7 @@ except ImportError:
     pass
 ```
 
-The explanation of some of the code in your  `mysite/settings/production.py` file is as follows:
+The explanation of some of the code in your `mysite/settings/production.py` file is as follows:
 
 1. `DEBUG = False` turns off debugging for the production environment. It's important for security and performance.
 2. `SECRET_KEY = os.environ["SECRET_KEY"]` retrieves the project's secret key from your environment variable.
@@ -409,9 +409,9 @@ The explanation of some of the code in your  `mysite/settings/production.py` fil
 
 Now, complete the configuration of your environment variables by modifying your `.env.production` file as follows:
 
-| Environment variable | Instruction |
-| -------- | ------- |
-| DJANGO_ALLOWED_HOSTS | This must match your fly.io project name. For example, _yourname-wagtail-portfolio.fly.dev_ |
+| Environment variable        | Instruction                                                                                           |
+| --------------------------- | ----------------------------------------------------------------------------------------------------- |
+| DJANGO_ALLOWED_HOSTS        | This must match your fly.io project name. For example, _yourname-wagtail-portfolio.fly.dev_           |
 | DJANGO_CSRF_TRUSTED_ORIGINS | This must match your project’s domain name. For example, _https://yourname-wagtail-portfolio.fly.dev_ |
 
 The content of your `.env.production` file should now look like this:
@@ -471,12 +471,12 @@ For more information on how to set up your Django project on Fly.io, read [Djang
 
 All this while, you've been adding content to your site in the local environment. Now that your site is live on a server, you must add content to the live site. To add content to your live site, go to ` https://yourname-wagtail-portfolio.fly.dev/admin/` in your browser and follow the steps in the following sub-sections of the tutorial:
 
-- [Add content to your homepage](add_content_to_your_homepage)
-- [Add your social media links](add_your_social_media_links)
-- [Add footer text](add_footer_text)
-- [Add pages to your site menu](add_pages_to_your_site_menu)
-- [Add your contact information](add_your_contact_information)
-- [Add your resume](add_your_resume)
+-   [Add content to your homepage](add_content_to_your_homepage)
+-   [Add your social media links](add_your_social_media_links)
+-   [Add footer text](add_footer_text)
+-   [Add pages to your site menu](add_pages_to_your_site_menu)
+-   [Add your contact information](add_your_contact_information)
+-   [Add your resume](add_your_resume)
 
 ```{note}
 If you encounter errors while trying to access your live site in your browser, check your application logs in your Fly.io Dashboard. To check your application logs, click **Dashboard > Apps > yourname-wagtail-portfolio > Monitoring**

+ 7 - 7
docs/tutorial/index.md

@@ -26,13 +26,13 @@ In this tutorial, you'll transform your blog site into a fully deployable portfo
 
 You'll learn the following in this tutorial:
 
-- How to add pagination to your Wagtail website
-- How to use Wagtail StreamField
-- How to use Wagtail documents
-- How to use snippets across multiple web pages
-- How to use Wagtail forms
-- How to implement the search feature in a Wagtail website
-- How to deploy a Wagtail website
+-   How to add pagination to your Wagtail website
+-   How to use Wagtail StreamField
+-   How to use Wagtail documents
+-   How to use snippets across multiple web pages
+-   How to use Wagtail forms
+-   How to implement the search feature in a Wagtail website
+-   How to deploy a Wagtail website
 
 Now, let's dive in.
 

+ 5 - 3
docs/tutorial/set_up_site_menu.md

@@ -25,7 +25,7 @@ def get_site_root(context):
     return Site.find_for_request(context["request"]).root_page
 ```
 
-In the preceding code, you used the `get_site_root` template tag to retrieve the root page of your site, which is your `HomePage` in this case. 
+In the preceding code, you used the `get_site_root` template tag to retrieve the root page of your site, which is your `HomePage` in this case.
 
 Now, create `mysite/templates/includes/header.html` file and add the following to it:
 
@@ -45,7 +45,7 @@ Now, create `mysite/templates/includes/header.html` file and add the following t
 </header>
 ```
 
-In the preceding template you loaded the `wagtailcore_tags` and `navigation_tags`. 
+In the preceding template you loaded the `wagtailcore_tags` and `navigation_tags`.
 With these tags, you can generate navigation menus for your Wagtail project.
 
 `{% get_site_root as site_root %}` retrieves your HomePage and assigns it to the variable `site_root`.
@@ -68,7 +68,7 @@ Finally, add your `header` template to your `base` template by modifying your `m
     {% include "includes/footer.html" %}
 
     {# Global javascript #}
-        
+
     <script type="text/javascript" src="{% static 'js/mysite.js' %}"></script>
 
     {% block extra_js %}
@@ -84,10 +84,12 @@ Now, if you restart your server and reload your homepage, you'll see your site m
 ## Add pages to your site menu
 
 You can add any top-level, like your Home page, Blog index page, Portfolio page, and Form page to the site menu by doing the following:
+
 1. Go to your admin interface.
 2. Go to any top-level page.
 3. Click **Promote**.
 4. Check the **Show in menus** checkbox.
 
 In the next section of this tutorial, we'll show you how to style your site and improve its user experience.
+
 <!-- Provide a diagram to illustrate the checking of the Show in Menu checkbox -->

+ 5 - 4
docs/tutorial/style_your_site.md

@@ -4,7 +4,7 @@
 We’ve just released this new tutorial. Do you want to provide feedback? Please complete our [2023 tutorial feedback form](https://wagtail.org/gsod-2023-feedback/).
 ```
 
-In this tutorial, you'll add a basic site theme to your portfolio site and improve its user experience. 
+In this tutorial, you'll add a basic site theme to your portfolio site and improve its user experience.
 
 ## Add styles
 
@@ -115,7 +115,7 @@ Start by modifying your `mysite/templates/base.html` file as follows:
         {% include "includes/footer.html" %}
 
         {# Global javascript #}
-        
+
         <script type="text/javascript" src="{% static 'js/mysite.js' %}"></script>
 
         {% block extra_js %}
@@ -126,6 +126,7 @@ Start by modifying your `mysite/templates/base.html` file as follows:
 ```
 
 In the preceding template, you made the following modifications:
+
 1. You removed `wagtailuserbar` from your base template. You'll add the `wagtailuserbar` to your `header` template later in the tutorial. This change improves the user experience for keyboard and screen reader users.
 
 2. You Added `<meta name="color-scheme" content="light dark">` to inform the browser about the supported color schemes for your site. This makes your site adapt to both dark and light themes.
@@ -134,7 +135,7 @@ In the preceding template, you made the following modifications:
 
 4. You wrapped the `{% block content %}` and `{% endblock %}` tags with a `<main>` HTML5 tag. The `<main>` tag is a semantic HTML5 tag used to indicate the main content of a webpage.
 
-Also, you should dynamically get your HomePage's title to use in your site menu instead of hardcoding it in your template. You should include the child pages of the Home page in your site menu if they have their 'Show in menus' option checked. Finally, you want to ensure that you add the `wagtailuserbar` that you removed from your `base` template to your `header` template. This will improve users' experience for keyboard and screen reader users. 
+Also, you should dynamically get your HomePage's title to use in your site menu instead of hardcoding it in your template. You should include the child pages of the Home page in your site menu if they have their 'Show in menus' option checked. Finally, you want to ensure that you add the `wagtailuserbar` that you removed from your `base` template to your `header` template. This will improve users' experience for keyboard and screen reader users.
 
 To make the improvements mentioned in the preceding paragraph, modify your `mysite/templates/includes/header.html` file as follows:
 
@@ -194,7 +195,7 @@ Finally, go to your `mysite/templates/includes/header.html` file and modify it a
 <header>
   {# Add this: #}
   <a href="#main" class="skip-link">Skip to content</a>
-  
+
   {% get_site_root as site_root %}
   <nav>
     <p>