Skip to content

Latest commit

 

History

History
341 lines (279 loc) · 14.9 KB

README.md

File metadata and controls

341 lines (279 loc) · 14.9 KB
Raw

thisis

screenshot

ThisIs... - experimental Full Site Editing

Description

ThisIs... an experimental theme attempting to implement Full Site Editing (FSE) with Gutenberg blocks.

Its original purpose was to help prepare "A guide to Full Site Editing, blocks and themes".

The live demo site for the theme is https://sneak-peek.me

Requirements:

  1. Implement Full Site Editing
  2. Similar look and feel as wordpress.org, originally
  3. but suitable for using in a self guided presentation
  4. to enable documentation of Full Site Editing resources
  5. Minimal PHP and CSS
  6. Partly completed theme.json
  7. Templates and template parts to be provided
  8. Additional templates and parts provided as patterns
  9. Use block plugins for functionality not yet supported
  10. or shortcodes when blocks are not yet available.

  • Contents:

IMPLEMENTED:

The block-templates developed so far are:

  • 404.html -
  • archive.html -
  • archive-demo.html
  • attachment.html -
  • category-faqs.html
  • category-fse-is.html
  • featured-image-left.html
  • front-page-demo.html
  • front-page.html -
  • full-width.html -
  • index.htm -
  • index.html -
  • output-input.html -
  • page.htm -
  • page.html -
  • page-2.html - custom template for post ID 2
  • page-template-hierarchy.html - custom template for template-hierarchy
  • portfolio.html
  • search.html
  • single-post.htm -
  • single-post.html -
  • single-post-no-featured-image.html

The block-template-parts are:

  • 404.html -
  • 404-demo.html
  • abandoned-footer.htm
  • attachment-image.html
  • body-only.html
  • call-#5-query-quest.htm
  • category-tag-clouds.html
  • contents-shortcode.html - part of output-input
  • footer.html
  • header.htm
  • header.html
  • latest-posts.html
  • main-body.htm
  • main-body.html
  • main-body-no-featured-image.html
  • page-tree.html
  • post-footer-stuff.html
  • previous-next.html
  • query-pagination.html
  • quixote.htm
  • single-post-fields.html
  • zzz.html

SAMPLES:

The files provided as samples have a file extension of .htm. These can be loaded as patterns using the experimental oik-patterns plugin.

  • ASSETS: Only in the GitHub version

assets/featured-images

Some photos used when creating content, logo(s) and favicon.

assets/imagine

A series of screenshots taken for the new "This is Full Site Editing..." video.

  • Taken with Gutenberg 10.5.3
  • During the development of v0.3.0
  • Used in a the "ThisIs... Full Site Editing" video on YouTube.

https://www.youtube.com/watch?v=xT5GOjSEOPg

assets/screenshots

A series of screenshots taken at different stages of the theme's development.

  • Taken with Gutenberg 10.4.1
  • During the development of v0.1.0 and v0.2.0
  • Used in a short introductory video.
  • The prototype video is on YouTube.

Installation

  • Either install Gutenberg 11.0.0 or higher from wordpress.org
  • or install the Gutenberg nightly version of the plugin
  • or install and build the latest Gutenberg source.
  • Activate Gutenberg.
  • Install and activate the thisis theme, as you would install any other theme. Full Site Editing will be enabled automatically.
  • Install and activate any pre-requisite plugins.

Change Log

1.0.0

  • Added: Add heading for Search results #20
  • Changed: Implement post-title template part #35
  • Changed: 404: wrap in group #35
  • Changed: We don't need add_theme_support for post-thumbnails #4
  • Changed: page.html: Remove layout attributes from template-part blocks #35
  • Changed: index.html: remove layout attributes #35
  • Changed: Remove cloned and clone shortcodes #35
  • Changed: Update query block for 3 columns #35
  • Changed: Update Copyright years. Add cloned and clone shortcodes #35
  • Changed: main-body: wrap in group for content width #35
  • Changed: Create 4 columns with light grey background and vertical menus with a bit of padding #35
  • Changed: Set contentSize to same as wideSize. from 800px to 1200px #35
  • Changed: Change to use parts not block-template-parts #35
  • Changed: Rename folders for templates and parts #35
  • Changed: Remove theme attribute from template part blocks #35
  • Changed: Add buttons menu pattern. Remove theme attribute. #35
  • Changed: Move all .htm files to patterns and rename to .html #
  • Changed: Update readme for v1.0.0
  • Changed: Rework for WordPress 5.9 #35
  • Changed: set version to 2, add custom.spacing.units of % #35
  • Changed: Add support for block styles and enqueue editor styles #35
  • Changed: Set apiversion 2, add appearanceTools: true, add custom spacing, set spacing.blockGap to 0.5rem #35
  • Changed: Remove unwanted margin-top on the debug block #35
  • Changed: Change oik-bbw/wp g attribute to bool #28
  • Changed: Enable custom margin, adjust typography settings, define settings for core/button
  • Fixed: Prevent images from stretching
  • Changed: Change query-loop to post-template #33
  • Changed: Override post-template but not query-loop #33
  • Changed: Override post-template to support orderby rand #33
  • Changed: Remove border around featured images; only gallery images
  • TestedL With WordPress 5.9.3 and WordPress Multi Site
  • Tested: With Gutenberg 13.2.0
  • Tested: With PHP 8.0

0.9.2

  • Added: Add portfolio and single-post-no-featured-image to custom templates
  • Added: Add templates for fse-outreach-experiment call 7: Portfolio
  • Tested: With Gutenberg 10.8.0

0.9.1

  • Changed: Make latest-posts full width, with a featured image below the date and spacer at the top. Issue #32
  • Tested: With Gutenberg 10.7.1 and nightly build 10.8.0.20210601

0.9.0

  • Changed: Enable custom color for core/paragraph
  • Changed: Update thisis_render_block_core_template_part to more closely match gutenberg's version, incl. the docblocks for do_action.
  • Changed: Replace custom HTML div WP_DEBUG with oik-sb/sb-debug-block. Issue #11
  • Changed: Add page list inside a vertical navigation block. Issue #32
  • Changed: Update for Gutenberg 10.7. Issue #32
  • Changed: Add demo template parts - reflecting changes made during the presentation on 19th May then undone
  • Tested: With WordPress 5.7.2 and WordPress Multi Site
  • Tested: With Gutenberg 10.7.1

0.8.0

  • Changed: Serve footer images from sneak-peek.me. Add spacer above vertical menus
  • Changed: Add 'rendering_template_part' action for new debug div solution,#11
  • Changed: Implement tag-cloud block override using Additional CSS class name of number-nnn.,#31
  • Fixed: Move curly braces to fix semantics.,#30
  • Tested: With WordPress 5.7.2 and WordPress Multi Site
  • Tested: With Gutenberg 10.6.0

0.7.0

  • Changed: Set background colour to get a white background in the Site editor
  • Changed: Failed attempt to style the table using theme.json
  • Changed: Reduce font size for Copyright text
  • Changed: Remove unnecessary code for [post-edit] shortcode, replaced by oik-sb/sb-post-edit-block,#29
  • Changed: Replace [guts] shortcode by oik-bbw/wp block,#27
  • Fixed: Remove unwanted ss
  • Tested: With WordPress 5.7.1 and WordPress Multi Site
  • Tested: With Gutenberg 10.6.0

0.6.1

0.6.0

  • Added: Add post-meta-inline template part to display in single-post template,[#27]((#27)
  • Changed: Support Gutenberg 10.6 - post_terms block replaces post-tags and post-hierarchical-terms,#23
  • Changed: Template part renames and add category-tag-clouds to most templates,#26
  • Fixed: Correct About & Contact links,#18
  • Fixed: Different message when slug attribute is not set,#6
  • Tested: With Gutenberg 10.6.0-rc.1 and 10.5.4

0.5.0

  • Added: Custom templates,#14
  • Added: Query block override to order by rand,#24
  • Added: Add image for the template editor with top toolbar on a second line
  • Added: Add customTemplates prior to refactoring to theme.json version 1,#24
  • Changed: wp_global_styles.json may contain the right way to set padding,#6
  • Tested: With Gutenberg 10.5.4

0.4.0

  • Added: Add Search template,#20
  • Added: Add category template for FSE is... posts,#19
  • Added: Add first version of a template to display FAQs,#15
  • Added: Implement navigation menu overrides to replace hardcoded links,#18
  • Changed: Add more screen captures for the website
  • Changed: Moved many images to assets so they're not in the runtime zip,#21
  • Changed: Re-enable links in the header template part,#18
  • Changed: Re-enable the template-part template part for the index template
  • Changed: Reset featured image to the default content width
  • Changed: Update footer template part menu and new images,[#21

0.3.0

  • Added: Add 404 template,#17
  • Added: Add front-page template,#1
  • Added: Add new screenshots for the FSE is 'imagine' video slideshow,#1
  • Added: Add post-footer-stuff ( just Copyright at present ) to each template,#1
  • Added: Add template parts required by single-post template,#1
  • Added: Add the featured image for 'FSE is FREE'
  • Changed: Add latest posts to the front page template
  • Changed: Improve page template
  • Changed: Improve sidebar for page template
  • Changed: Lower the required PHP version to 7.3 for SiteGround hosting
  • Changed: Reduce padding on the attachment template's post title,#10
  • Changed: Support responsive-embeds for full width YouTube videos,#16
  • Tested: With Gutenberg 10.5.3

0.2.0

  • Added: Add some images for the footer with Mrs Eames font - including a new proposal for a motto
  • Added: Deliver templates and template parts as normal .html files,#9
  • Added: Screenshots and images
  • Added: Templates: archive,
  • Added: attachment template,#10
  • Changed: Added debug divs and CSS styling,#11
  • Changed: Styling that could not be applied using Global styles,#5
  • Fixed: screenshot should have been a .png file
  • Tested: With Gutenberg 10.4.2
  • Tested: With WordPress 5.7.1 and WordPress Multi Site
  • Tested: With PHP 8.0, requires PHP 7.3

0.1.0

  • Added: Add intermediate files as potential patterns,#1
  • Added: Add some Fuzzy Duck images to use in examples
  • Added: Start populating experimental-theme.json with: color palette, font families and sizes, normal and wide width, etc,#5
  • Changed: Override browser default margin; reduce to 0px.,#5
  • Changed: Add new logo,#1
  • Changed: Need to enqueue style.css and add featured image support,#4
  • Changed: Override styling to remove unwanted vertical white space between blocks,#6
  • Changed: override template-part.php to not call wpautop(),#6
  • Tested: With Gutenberg 10.4.1
  • Tested: With PHP 8.0
  • Tested: With WordPress 5.7.1 and WordPress Multi Site

0.0.0

  • Added: This is... probably the minimum mandatory content for an experimental FSE theme with Gutenberg 10.4.1,#2

Block overrides

thisis may contain a number of overrides to Gutenberg server rendered blocks which didn't behave the way I expected. These overrides should continue to work even when the PRs to fix the bugs have been implemented.

These overrides may have been copied / cobbled from Fizzie and/or SB.

  • core/template-part - does not call wpautop()
  • core/navigation-link - changes hardcoded https://s.b/wp55/thisis to site_url()
  • query-loop - Adds support for orderby=rand

References

See my articles on herbmiller.me:

For other articles see the Fizzie theme's readme

For some other FSE themes see WP-a2z FSE themes

Brief development history

ThisIs... is my third attempt to develop a theme using Full Site Editing. It's the first one where I tried to use the Site Editor to build the theme.

Some of the templates and template parts that I built are exported to .htm files. Since the file extensions are not .html then these files will not be found by the Site Editor until manually renamed.

Once again I've found the need to use shortcodes in some template parts. The plugins upon which the template parts are dependent are:

  • oik
  • oik-css
  • oik-fields
  • sb-breadcrumbs-block
  • sb-children-block
  • sb-post-edit-block
  • sb-prevnext-block
  • Yoast SEO - used by sb-breadcrumbs-block

The following plugins are also used during development and cloning to the live site.

  • oik-bwtrace
  • oik-clone
  • oik-patterns
  • oik-types

Copyright

(C) Copyright Herb Miller, Bobbing Wide 2021

  • This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 2 of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.