Blog Loop

Composable blog entry loop. Compose the per-post card from Post Image/Title/Meta/Excerpt blocks; the container, pagination, and timeline chrome are layout-driven. It is shown in the block inserter as Blog Loop and registered as canvas-core/blog-loop.

Select the block on a page and its own settings open in the sidebar, in the panels below:

The Blog Loop settings in the block editor sidebar

Settings

Each setting is named exactly as the block editor names it, followed by what it does and what it starts as. Where a setting carries a Shown when line, it stays hidden until that condition is met, which is the usual reason a setting looks missing from the sidebar:

Layout

  • LayoutDefaultStandard

    Archive layout. Drives the container classes and default entry column width.

    ChoicesStandardGridSmall (side image)Small AltList 1List 2List 3MasonryTimeline (Grid)Timeline (List)

  • Entry Column ClassDefaultEmpty

    Bootstrap column class for each .entry card. Leave empty to use the default for the chosen layout, or write "none" for a stack whose cards are not grid columns at all.

  • Container ClassesDefaultEmpty

    Full class list on the posts container, replacing the layout default. Leave empty to use the default for the chosen layout, or write "none" for a container the design leaves unclassed. This is how one layout covers a two-column grid at gutter-50 and a three-column grid at gutter-40.

  • Format Class PrefixDefaultEmpty

    Adds a per-record class built from the post format, e.g. prefix "bf-" gives bf-image / bf-video / bf-gallery / bf-audio. This is what a filter widget matches on. Empty adds nothing.

  • Record ClassesDefaultOff

    Marks every entry with the identity WordPress already keeps for it: which post it is, its type, its status, its format, and the categories and tags it carries. Turn it on when a design or a filter has to single out one record, one format or one category, and for correct article markup.

  • Entry Wrapper ClassDefaultEmpty

    When set, each entry is wrapped in a div carrying these classes: the design's column-per-card grid shape. Empty leaves the entry as a direct child of the container.

  • Entry Base ClassDefaultentry

    The class every entry starts with. Defaults to the design's entry card. Clear it for a grid whose cards deliberately carry no card chrome.

  • Container ElementDefaultDiv

    Element for the loop container. A list container pairs with a list entry element, which is what a numbered/counter list needs. None emits the entries straight into whatever surrounds the block, so several loops can share one grid row.

    ChoicesDivUnordered listOrdered listNone (no container)

  • Entry ElementDefaultDiv

    HTML element for each entry. Article is the semantically correct choice for a self-contained post; Div matches older archive markup. None leaves the card composition to supply its own root element: a card whose whole box is a link.

    ChoicesDivArticleList itemNone (composition supplies it)

  • Rank Marker ClassesDefaultEmpty

    When set, each record opens with its position in the list: the numeral a "most read" rail counts with. Empty adds nothing.

  • Rank DigitsDefault2

    Pads the position with leading zeros to this width, so 1 reads as 01.

    Shown when Rank Marker Classes is set

  • Last Entry Column ClassDefaultEmpty

    Replaces the column class on the final record: the shape a design uses to drop the trailing gap under the last card in a rail.

  • First Entry Extra ClassDefaultEmpty

    Classes added to the first record only: the shape a design uses to mark the opening item of a set as the active one.

  • Separator ClassesDefaultEmpty

    Classes for a divider element rendered BETWEEN entries (e.g. "line"). Leave empty for no dividers.

  • Container IDDefaultposts

    HTML id on the posts container. Masonry/timeline JS targets #posts by default: only change this if you know why.

  • Show the RecordsDefaultOn

    Off emits only the pagination, for a design that puts the page controls below something else that drew the records.

Pagination

  • Show PaginationDefaultOn

    Shows the page controls under the records. Turn it off where the loop is a fixed selection with nothing further to reach.

  • Pagination StyleDefaultNumbered pages

    Infinite scroll adds the status region the scroller writes into, plus a hidden Load more link it follows. Batches reveal the records already delivered a few at a time, then fetch the next page when they run out.

    ChoicesNumbered pagesOlder / Newer pagerLoad more buttonInfinite scrollLoad more in batchesShown when Show Pagination is on

  • Numbered Bar StyleDefaultChevron circles

    Chevron circles draw the two directions as arrows. Named directions writes them out in words and marks a control with nowhere to go as plain text rather than a link nobody can follow.

    ChoicesChevron circlesNamed directionsShown when Pagination Style is "Numbered pages"

  • Numbered Bar ClassesDefaultEmpty

    Full class list on the numbered bar, replacing the default. Empty keeps the theme default.

    Shown when Pagination Style is "Numbered pages"

  • Previous LabelDefaultEmpty

    Wording on the control that steps back a page. Leave it empty to keep the theme wording.

    Shown when Numbered Bar Style is "Named directions"

  • Next LabelDefaultEmpty

    Wording on the control that steps forward a page. Leave it empty to keep the theme wording.

    Shown when Numbered Bar Style is "Named directions"

  • Pagination Wrapper ClassesDefaultEmpty

    Classes on the element that wraps the controls. Empty uses the default for the chosen style.

    Shown when Show Pagination is on

  • Always Show BothDefaultOff

    Keeps both controls on every page: the Older/Newer buttons, or the two arrows of the numbered bar. The one with nowhere to go stays in place, inert, so the row does not jump on the first and last page.

    Shown when Pagination Style is "Older / Newer pager" or "Numbered pages"

  • Older LabelDefaultEmpty

    Wording on the control that moves towards older posts. Leave it empty to keep the theme wording.

    Shown when Pagination Style is "Older / Newer pager"

  • Newer LabelDefaultEmpty

    Wording on the control that moves back towards newer posts. Leave it empty to keep the theme wording.

    Shown when Pagination Style is "Older / Newer pager"

  • Load More LabelDefaultLoad more..

    Wording on the button that brings in the next page of posts. Infinite scroll keeps the same button hidden and follows it for you.

    Shown when Pagination Style is "Load more button" or "Infinite scroll"

  • Load More ClassesDefaultbutton button-3d button-large button-rounded

    Style classes on that button, which is what gives it its size and rounded shape.

    Shown when Pagination Style is "Load more button" or "Infinite scroll"

  • Records Shown FirstDefault6

    How many records are visible before the reader asks for more.

    Shown when Pagination Style is "Load more in batches"

  • Records Per BatchDefault3

    How many more arrive on each press.

    Shown when Pagination Style is "Load more in batches"

  • Batch Wrapper ClassesDefaultcol-12 p-0

    Style classes on the wrapper around each batch of records. The default gives it the full width of the row and no padding of its own, so a revealed batch sits flush with the records above.

    Shown when Pagination Style is "Load more in batches"

  • Batch Row ClassesDefaultEmpty

    Grid classes inside each batch, so a revealed batch lines up with the records above it.

    Shown when Pagination Style is "Load more in batches"

  • Control Wrapper ClassesDefaulttext-center mt-5

    Style classes on the block under the records that holds the counter, the button and the end message. The default centres them with a gap above.

    Shown when Pagination Style is "Load more in batches"

  • Counter ClassesDefaulttext-muted text-smaller mb-3

    Style classes on the running count above the button. The default keeps it small and quiet so it does not compete with the records.

    Shown when Pagination Style is "Load more in batches"

  • Counter PrefixDefaultShowing

    Written before the running count, as in Showing 6 of 24 articles. Clear both this and the suffix to leave the count out altogether.

    Shown when Pagination Style is "Load more in batches"

  • Counter SuffixDefaultof {total} articles

    Written after the running count. {total} is replaced with how many records the query actually found.

    Shown when Pagination Style is "Load more in batches"

  • Button ClassesDefaultbutton button-border button-rounded button-large m-0

    Style classes on the button that reveals the next batch. The default draws it as a large outlined pill.

    Shown when Pagination Style is "Load more in batches"

  • Button LabelDefaultLoad More Articles

    Wording on the button that reveals the next batch.

    Shown when Pagination Style is "Load more in batches"

  • End Message ClassesDefaulttext-muted mt-3 mb-0

    Style classes on the message that replaces the button once everything has been shown.

    Shown when Pagination Style is "Load more in batches"

  • End MessageDefaultYou have reached the end of the archive.

    What the reader is told once every record has been revealed and there is nothing left to load.

    Shown when Pagination Style is "Load more in batches"

Query

  • Inherit Main QueryDefaultOn

    On (default): consume + paginate the current archive/index query, use on archive templates. Off: run an independent query scoped by the fields below, use anywhere else (e.g. a regular page).

  • Posts Per PageDefault6

    How many posts the loop draws before the page controls take over.

    Shown when Inherit Main Query is off

  • Records Per Page (override)Default0

    Re-runs the archive's own query with this many records per page and paginates on it. 0 uses however many the archive delivered.

    Shown when Inherit Main Query is on

  • Records RenderedDefault0

    How many of the page's records this loop draws, when a second composition below it takes the rest. Pagination still counts the whole page, so the two stay in step. 0 draws them all.

    Shown when Inherit Main Query is on

  • Skip Leading RecordsDefault0

    Leaves this many records to a loop above: the shape a design uses when the newest article is a lead card and the grid starts at the one after it.

    Shown when Inherit Main Query is on

  • Order ByDefaultDate

    What decides the sequence posts appear in. Comment Count builds a most discussed rail, and Random reshuffles on every visit.

    ChoicesDateTitleMenu OrderRandomLast ModifiedComment CountShown when Inherit Main Query is off

  • OrderDefaultNewest first

    Which end of that sequence comes first.

    ChoicesNewest firstOldest firstShown when Inherit Main Query is off

  • Category SlugsDefaultEmpty

    Comma-separated category slugs to filter by. Leave empty for all categories.

    Shown when Inherit Main Query is off

  • Hand-picked PostsDefaultEmpty

    Comma- or newline-separated post slugs. Overrides the category filter and renders in exactly this order. Leave empty for a normal query.

    Shown when Inherit Main Query is off

  • Related To Current RecordDefaultEmpty

    On a single record, list other records sharing its categories or tags, newest first, with the record itself left out. It has no effect on any other view, so one template can carry the loop for both. While this is on it replaces the category filter.

    ChoicesOff (empty)Shares a categoryShares a tagShown when Inherit Main Query is off

  • Filling Empty SlotsDefaultEmpty

    A record filed under a section of its own has few or no relatives, and a grid that renders two of four cards reads as a fault. Topping up keeps the row complete.

    ChoicesLeave them empty (empty)Top up with the newest recordsShown when Related To Current Record is set

Every Canvas block also carries the Animation, Scroll Effects and Advanced panels, which are described in Controls every Canvas block has.

Other blocks in Posts: Blog Archive Loop, Blog Single Post, Post Archive Index, Post Author, Post Comments, Post Content.

Was this page helpful?