Full Site Editing (WP Meetup Hamburg)

In WordPress 6 kam das Full Site Editing mit dem Twenty Twenty-Two Theme in den WordPress-Core. Aber deutlich als „Beta“ gekennzeichnet. Nun ist WordPress 6.1 kurz vor der Veröffentlichung, Zeit einen neuen Blick auf das Feature zu werfen. Ist das Feature inzwischen produktiv nutzbar? Oder noch nicht? Wie gehen wir als Freelancer/Agenturen damit um? Möglichkeiten für Nutzende beschneiden oder besser schulen, damit das Layout/Design nicht „kaputt gespielt“ wird? Das Ganze wird kein Vortrag, sondern ein offener Austausch mit Live-Probieren.

Einführung gehalten auf dem WP Meetup Hamburg September 2022

Transcript

1. Full Site Editing
   WP Meetup Hamburg
   Torsten Landsiedel
   @zodiac1978
   

   View Slide

2. Termine
   

   View Slide

3. https://wptranslationday.org/ (28. September)
   

   View Slide

4. 1. Einfacheres Bearbeiten – bereits in WordPress enthalten, mit kontinuierlichen
   Verbesserungen
   2. Anpassung – Full Site Editing, Block-Vorlagen, Block-Verzeichnis, blockbasierte
   Themes
   3. Kollaboration – ein intuitiverer Weg, Inhalte gemeinsam zu verfassen
   4. Mehrsprachig – Core-Implementierung für mehrsprachige Websites
   Die 4 Phasen von Gutenberg
   

   View Slide

5. Qellen
   

   View Slide

6. https://developer.wordpress.org/block-editor/
   

   View Slide

7. https://gutenbergtimes.com/
   

   View Slide

8. https://gutenberg-fibel.de/
   

   View Slide

9. https://fullsiteediting.com
   

   View Slide

10. https://wpdevelopment.courses
    

    View Slide

11. Block Themes finden
    

    View Slide

12. https://de.wordpress.org/themes/tags/full-site-editing/
    

    View Slide

13. Struktur (classic)
    

    View Slide

14. Struktur (Block Theme/FSE)
    

    View Slide

15. {
    "$schema": "https://schemas.wp.org/trunk/theme.json",
    "version": 2,
    "customTemplates": [
    {
    "name": "blank",
    "postTypes": [
    "page",
    "post"
    ],
    "title": "Blank"
    },
    …
    theme.json
    

    View Slide

16. /templates
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    

    View Slide

17. {
    "title": "Whisper",
    "settings": {
    "color": {
    "palette": [
    {
    "color": "#E5E7F2",
    "name": "Base",
    "slug": "base"
    },
    {
    "color": "#47484B",
    "name": "Contrast",
    "slug": "contrast"
    }, …
    /styles
    

    View Slide

18. /**
    * Title: Post Meta
    * Slug: twentytwentythree/post-meta
    * Categories: query
    * Keywords: post meta
    * Block Types: core/template-part/post-meta
    */
    ?>
    
    style="margin-top:var(--wp--preset--spacing--70);margin-bottom:var(--wp--preset--spacing--70)">
    
    /patterns
    

    View Slide

19. 
    /parts
    

    View Slide

20. Danke!
    Slack // Twitter // WordPress.org // Github
    @zodiac1978
    

    View Slide