Kindergarten
Import the Kindergarten design and it brings blocks and content types of its own, on top of the main Canvas library. Read this page when you are working on a site built from Kindergarten and meet a block you cannot find in the main reference.
These items stay registered on every site so that content you have already imported keeps rendering, and they appear in the block inserter only where the design is in use.
Content types this design adds
Programs
canvas_kinder_class
One item is called a Program. You will find them in their own admin menu once the design is installed.
- Editor features: custom-fields, editor, excerpt, page-attributes, thumbnail, title
- Grouped by: Age Groups (
canvas_kinder_age)
Each item carries these extra settings on its edit screen:
Monthly Fee
Class Intro
Class Points
Teacher Ratio
Schedule
Lead Teacher
Blocks this design adds
Kindergarten Programs
canvas-core/kinder-classes
Display programs from the Programs post type as cards, optionally for one age group, or render a single program page (details, enrolment call to action, related programs). In the block inserter it is named Canvas Kindergarten Programs.
Select the block on a page and its own settings open in the sidebar, in the panels below:
Layout
LayoutDefaultCards Grid
Which part of the programs design this block draws. Cards Grid lists them; each "Single Program" choice renders one section of the program page you place it on.
ChoicesCards GridSingle Program - DetailsSingle Program - Enrolment CTASingle Program - Back + Related
Query
Age Group SlugDefaultEmpty
Show only the programs in one age group, written as its slug (toddler, preschool …). Leave empty to show every program.
ItemsDefault
00 shows all programs.
Order ByDefaultMenu Order
What decides the sequence of the programs. Menu Order lets you arrange them by hand on the programs list screen.
ChoicesMenu OrderDateTitle
OrderDefaultAscending
Which end of that sequence comes first.
ChoicesAscendingDescending
Display
Row ClassesDefault
row col-mb-30Class names on the row holding the cards, setting the space between them.
Column ClassesDefault
col-lg-4 col-md-6Class names on each card column, which is what sets how many programs sit side by side at each screen width.
Card ClassesDefault
card border-0 h-100 shadow-smClass names on the card itself, from its border and shadow to whether it stretches to the tallest card in the row.
Card Header ClassesDefault
card-header font-primary p-4Class names on the coloured band carrying the program name. Add the age group's colour class here (color1 to color4) so a whole group of cards shares one accent.
Card Header TagDefaulth3
Heading level of the program name, so the page keeps a sensible outline wherever the row is placed.
Choicesh2h3h4h5
Card Body ClassesDefault
card-body p-4Class names on the card body, which set its padding.
Bullet List ClassesDefault
ps-3 mt-4 mb-0Class names on the list of what the program covers.
Bullet ClassesDefault
mb-3Class names on each bullet, which set the space between them.
Card Link TextDefault
Learn MoreWording on the link at the foot of each card. Leave empty for no link.
Card Link ClassesDefault
more-link fst-normal ms-3Class names that set the look of that link.
Card Link IconDefault
bi-arrow-rightIcon shown after the link text. Leave empty for text alone.
Record Identity ClassesDefaultOn
Add WordPress's own per-record classes (post id, type, status) to each column.
Programs Page SlugDefault
our-programsSlug of the programs landing page. The single layouts resolve it to a portable permalink for the age eyebrow and the "Back to Programs" button. Empty = no link.
Enrolment Page SlugDefault
contactsSlug of the page the single-cta enrolment button links to. Resolved to a portable permalink so the link is correct on any install or import. Empty = no button.
CTA Button TextDefault
Enroll in this ProgramWording on the enrolment button. Leave empty for no button.
Back Button TextDefault
Back to ProgramsWording on the button returning the reader to the programs listing. Leave empty for no button.
Related HeadingDefault
More in this Age GroupTitle above the row of other programs. Leave empty to show the row with no title.
Kindergarten News
canvas-core/kinder-news
A row of latest news entries: cover image with a wave cut into its foot, a round date badge and the headline. In the block inserter it is named Canvas Kindergarten News.
Select the block on a page and its own settings open in the sidebar, in the panels below:
Query
PostsDefault
3How many news entries to show.
Category SlugDefaultEmpty
Show only posts from one category, written as its slug. Leave empty for every category.
Order ByDefaultDate
What decides the sequence of the entries.
ChoicesDateTitleMenu Order
OrderDefaultAscending
Which end of that sequence comes first.
ChoicesAscendingDescending
Display
Row ClassesDefault
row gutter-50Class names on the row holding the entries, setting the space between them.
Column ClassesDefault
col-lg-4Class names on each entry column, which set how many entries sit side by side.
Entry Wrapper ClassesDefault
posts-mdClass names on the wrapper around each entry, which pick the post-list size.
Image Wrapper ClassesDefault
entry-image position-relative mb-md-4Class names on the box holding the cover image, the wave and the date badge.
Image ClassesDefault
rounded-5Class names on the cover image itself, which set how round its corners are.
Image SizeDefaultLarge
Which stored size of the cover image to serve.
ChoicesFullLargeMediumThumbnail
Date BadgeDefaultOn
Show the round month and day badge over the corner of the cover image.
Date Badge ClassesDefault
entry-dateClass names on that badge.
Shown when Date Badge is on
Title Wrapper ClassesDefault
entry-title text-transform-noneClass names on the box around the headline, which set its casing.
Title TagDefaulth3
Heading level of the headline, so the page keeps a sensible outline.
Choicesh2h3h4
Title Link ClassesDefault
ls-0 h3Class names on the headline link, which set its size and letter spacing.
Record Identity ClassesDefaultOn
Add WordPress's own per-record classes (post id, type, status) to each column.
Wave
Wave ShapeDefault
wave-5Name of the shape cut into the foot of the cover image. Leave empty for a straight edge.
Wave WidthDefault
110How wide the wave is drawn, as a percentage of the image.
Wave HeightDefault
30How tall the wave is, in pixels.
Wave ColourDefaultEmpty
Colour the wave is filled with. Match it to the band the entries sit on so the cut looks like part of the background.


