thisis
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:
- Implement Full Site Editing
- Similar look and feel as wordpress.org, originally
- but suitable for using in a self guided presentation
- to enable documentation of Full Site Editing resources
- Minimal PHP and CSS
- Partly completed theme.json
- Templates and template parts to be provided
- Additional templates and parts provided as patterns
- Use block plugins for functionality not yet supported
- or shortcodes when blocks are not yet available.
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]((https://github.com/bobbingwide/thisis/issues/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
0.3.0
0.2.0
0.1.0
- Added: Add intermediate files as potential patterns,https://github.com/bobbingwide/thisis/issues/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,https://github.com/bobbingwide/thisis/issues/5
- Changed: Override browser default margin; reduce to 0px.,https://github.com/bobbingwide/thisis/issues/5
- Changed: Add new logo,https://github.com/bobbingwide/thisis/issues/1
- Changed: Need to enqueue style.css and add featured image support,https://github.com/bobbingwide/thisis/issues/4
- Changed: Override styling to remove unwanted vertical white space between blocks,https://github.com/bobbingwide/thisis/issues/6
- Changed: override template-part.php to not call wpautop(),https://github.com/bobbingwide/thisis/issues/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
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.