Open courtneyr-dev opened 1 year ago
I will need to step away from this for over a month, so I'm releasing it back for anyone else to work on.
For the record, this is how far I got with writing a script. Feel free to use this, or start fresh:
Script
WordPress 6.3 introduced a few new blocks into the editor. One of those was the Details Block. The Details block displays a text summary and an arrow button: When you click on the text or the button, the block opens and reveals additional content on the page. This block provides a way to show or hide content on your site. This can be useful on faq pages, showing /hiding detailed event information etc.
To add a Details block to your content, click on the Block Inserter (+) and select the Details block. You can also type /details
and hit enter in a new paragraph block to add one quickly.
Once added, you'll first want to add some summary text. This can be added to the area highlighted directly below the arrow. This text will be shown even when the details are hidden.
Below that, you can add
The Details block comes with a few settings you can change to meet your needs. In the block toolbar, you'll find alignment settings. In the right sidebar, you'll find a setting to open the details by default or not. The styles tab in the sidebar will show additional settings, such as color, typography, and dimensions.
WP 6.4 https://github.com/WordPress/gutenberg/pull/53282 Add layout and block spacing to details block #53282 https://make.wordpress.org/core/2023/08/23/whats-new-in-gutenberg-16-5-23-august/#additional-block-supports-for-multiple-blocks-including-details-and-post-content
@westnz Is this going to be part of a Learning Pathway lesson?
No, we have not covered the Details block.
Tutorial: Using the Details Block
Topic Description
This tutorial will guide users through using the Details block. Participants will learn how to create expandable content sections using this block, allowing them to enhance the organization and user experience of their WordPress posts and pages.
Related Resources
https://github.com/WordPress/gutenberg/pull/45055
Guidelines
Review the team guidelines for developing tutorials.
Tutorial Outline
Introduction
Adding the Details Block
Configuring the Details Block
Inserting Content in the Expandable Section
Using the Details Block in Different Contexts
Best Practices for Effective Use
Examples and Use Cases
Conclusion
SEO Keywords
Tutorial Development Process
For your reference, today's date is 2023-07-19.
Tutorial Development Checklist