WordPress 5 9 demo

Part two of the Zoom video of the WordPress Portsmouth Online Meetup held on Wednesday 26th January 2022.

In the first part of this meetup, Herb Miller took you through the slides which are published on https://www.wp-pompey.org.uk/meetup/wordpress-portsmouth-online-meetup-26th-january-2022-whats-new-in-wordpress-5-9/

In the demonstration that followed, Herb used a site called cwiccer.com to demonstrate each of the major points covered in the slides:

- Site Editor beta
- Twenty Twenty-Two
- Global Styles
- Navigation block
- Better block controls
- Patterns
- List View
- Better gallery block

Timeline
0:00 Introduction to the demo
0:30 Twenty Twenty-Two theme details
1:00 New theme activated - visit site
1:05 Q: Is a child theme provided?
1:10 No, but there are tools to create themes.
1:45 See https://fullsiteediting.com/block-theme-generator/
2:10 Why didn't they create a child theme; everyone recommends using a child theme.
2:32 Viewing a page with Twenty Twenty-Two
2:45 Edit the page
2:50 Deleting blocks using "Remove blockname" eg Remove paragraph, remove list, etc.
3:25 Demonstrating it's WordPress 5.9 without Gutenberg on PHP version 8
3:50 index.html or page.html consists of a heading, with a navigation menu that's the page list
4:02 content and footer
4:08 Edit the site using Edit site or Appearance - Editor beta
4:22 Site editor loaded.
4:54 Displayed full screen but you can toggle Navigation ( left sidebar )
5:01 Click on Dashboard to return to dashboard
5:22 Welcome to styles
5:46 Typography
5:52 Typography Text: Font family, Size, Line height, Appearance
6:32 Typography Links: Font family
7:00 Colours
7:20 Adding a custom colour
7:30 Edit colours to set a custom colour name
8:00 Set background colour to custom colour
8:13 Set default link colours
8:19 Q: What about hover colour?
8:20 A: That's where you have to use style.css
8:40 Layout - Dimensions - Padding
9:00 Padding - top, right, bottom, left - setting values with different units
9:56 Save - Custom Styles
10:10 Visit site
10:11 List line height far too small so that items overlap.
10:20 Right hand padding set to too much
11:00 Reset to defaults seems easiest solution
11:13 Preview modes: Desktop, Tablet and Mobile
11:35 Q: Hamburger item. Why only the bun?
13:21 Navigation block
14:00 Turning off mobile display
14:32 Always mobile - displayed vertically
15:30 Select existing menu
16:11 Duplicate menu in footer
17:00 Adding item to menu - created a new menu
18:11 List View actions
18:50 Drag and drop
19:25 Edit template part
19:55 Q. Right align footer navigation menu
21:35 Q. What's the purpose of these width adjustment bars?
22:30 Better block controls
22:40 Typography, font family
23:01 Q. Can you just delete Proudly powered by WordPress?
23:40 Q. What about a Copyright notice?
24:38 Setting background colours
25:45 Row block in footer - a group of blocks displayed horizontally
26:00 Multiple background colours in the footer
26:12 Layout Inherit default layout toggle.
26:36 Attempting to set footer background colour with footer content at normal width
27:10 Want pink outside, green inside.
28:14 Not achieved during the demo. Solved the next day.
28:47 Patterns
29:38 Inserting a copyright pattern - inserting 8 blocks in one click.
30:46 Inserting a pricing table pattern into a template
31:10 Once inserted the pattern becomes part of the content. It's not a reusable block
31:26 Q. Are these patterns part of the page or template?
32:14 Inserting patterns into a new post.
32:48 Viewing a pattern's content using the Details icon
32:58 22 blocks added in one action.
34:00 Better gallery block
34:37 Keyboard shortcuts
35:00 Ctrl+S - for Save - only works when you've made changes.
35:16 Insert gallery block - 3 images
37:00 Duotone filter applied to two of the images
37:35 Cropping an individual image in the gallery block
38:18 Add another image to the gallery
39:13 Short break from Herb's demo.
While he's out attendees discuss benefits of FSE and software improvements in general.
42:27 Q. Can we use these blocks in a classic theme?
43:51 Yes. See the Gallery I created earlier.
44:25 Copy gallery block
44:56 Paste into new post
45:41 Other blocks new in WordPress 5.9 - Navigation block
46:05 Q. Would gallery block be slow with 100 or so images?
46:41 Next and Previous post links
47:35 Next and Previous blocks better in FSE theme.
47:53 Q. Do Next and Previous work on pages?
48:30 Can we see styles for an individual block?
49:35 Adding a list block into the template in order to customize styles.

for more times see the Comments.

See also Part one - https://www.youtube.com/watch?v=LagoOn9wPZ0
We'll also be adding some follow up notes to the website.