# Article footer

> The close of an article: a portrait of the author beside their name, the biography under both inside a currentColor slip held to the middle half of the measure, and the previous and the next post hanging off the two outer edges so the section reads as a doorway rather than a footer. The name, the biography and the two neighbours are dynamic core blocks, so they are the post's own and the preview here is sample data; the portrait is an ordinary image block you swap for your author's own. The previous and next links only resolve on a single post template, which is where this pattern belongs.

Canonical: https://patternpaste.com/pattern/article-footer.html
Section: Editorial
Access: Included in Pattern Paste access.
Needs: Requires a block theme on WordPress 7.0 to 7.1. Classic themes and page builders are outside our supported setup. Adaptive patterns use the block theme’s colour, spacing and typography presets; styled variations declare their own colours or type.
Blocks: column, columns, group, image, paragraph, post-author-biography, post-author-name, post-navigation-link
Keywords: author bio, author portrait, post navigation, previous post, next post, article footer, byline

## Variations (2)

### Between the exits (the default)

Identical markup in every theme.

Previous at the left edge, the portrait and bio slip in the middle, next at the right edge, all under one currentColor rule that closes the article above them.

### Bio leads

Identical markup in every theme.

The composition changes rather than the colour: the slip moves to the left and takes two thirds of the measure, portrait and all, and the two exits stack in one narrow ruled column at the right, so the section reads as a card with an index beside it.


---

## It shows YOUR post, and the preview is our sample content

Every fact in this section EXCEPT the portrait is resolved by WordPress from the
post it is placed on: the author's name, the author's biography from their user
profile, and the titles of the two neighbouring posts. The preview on the
product page is our preview site's seeded content ("Dana Rivera", and a
biography that says so). Nothing there is in the pattern itself.

**The portrait is the one thing that is.** It is an ordinary `core/image` with a
URL and no attachment id, so it copies with the blocks and shows our sample
face until you replace it. It is deliberately not `core/avatar`: that block
prints whatever the author's Gravatar is, which on most sites is a grey
mystery-person tile or nothing at all, and a bio card whose face is a silhouette
is worse than one with a real photograph you chose. The trade is that the
portrait does not follow the author from post to post; if your journal has
several authors, see "What to change first".

**It belongs at the foot of a single post template.** Two things follow, and
both are stated here because neither reports itself:

- The bio blocks read the post from block context, which a single post template
  or a query loop supplies. Pasted into a post's own body they print nothing.
- **`core/post-navigation-link` renders only on a singular request.** Its first
  line is `if ( ! is_singular() ) { return ''; }`, so on an archive, on a
  static page, in a query loop, or in any preview that is not a real single
  post view, the two links produce no output at all. That is WordPress, not
  this pattern, and it is why the two exits are built as labelled slots with
  rules of their own: the composition still reads where the links are absent,
  and it fills in on the buyer's actual post page. Measured on WordPress 7.0.

## The signature moment: the exits are at the edges

**The bio is boxed and the way out is not.** The card is a slip bounded by a
1px `currentColor` hairline, held to the middle half of a 1240 measure, with a
portrait at its head so the boxed thing is visibly a person. The
previous and next posts sit at 22% each, hard against the two outer edges,
unboxed, each a 13px tracked label over its own short rule with the neighbouring
post's title under it. Between them and the card there is nothing.

So the section reads as a doorway rather than as a footer: one thing to look at,
two ways out of it, and a lot of air saying which is which. The whole band is
closed at the top by one more `currentColor` rule, which is what makes it the
END of the article rather than a section after it.

## What it inherits from your theme

- **The typeface.** No font family is stated.
- **Your colours.** The band asks for `base` and the type for `contrast`, each
  ending on a colour WordPress guarantees. Every rule in the pattern, the band's
  top rule, the card's border and the two rules under the exits, is
  `currentColor`, so all four are exactly the colour of the text.
- **Your spacing scale.** Measured at 1400: 365px in Twenty Twenty-Four.

## What it decides for itself

- **Full bleed with a 1240px measure**, and a 22 / 50 / 22 split, so the two
  exits sit further out than anything else in the section.
- **The card is the only bordered thing.** Its border is what sets the person
  apart from the two exits, and it is why they need no box of their own.
- **The portrait is a 5.5rem square, and the squareness is in the file.** It
  uses `portrait-16-head`, a head-and-shoulders crop made for this job, so the
  block asks for `aspectRatio: 1` on an image that is already 1:1 and nothing is
  cut. Do not point this block at a full-length portrait and leave the ratio at
  1: `core/image` writes no `object-position`, so a cover crop is always taken
  from the centre, and the tall studio portraits in this catalogue frame the head
  in the top third, which a centred square crop removes. Swap the ratio with the
  photograph, or crop the photograph to a square first, as this one is. The
  portrait sits in the same `wrap` flex row as the label and the name, so at 390
  it drops to its own line rather than squeezing the name.
- **The navigation links state their own link colour.** An anchor carries a
  colour rule of its own that beats an inherited one, so both blocks set
  `style.elements.link.color.text` as well as their text colour and the two
  titles are the same ink as the bio.

## What to change first

1. **The labels.** "← Previous" and "Next →" are ordinary paragraphs above the
   dynamic links, so they take any wording, and the arrows are characters you
   can delete. The link itself prints the neighbouring post's title, because
   both blocks ship `showTitle: true` and no label of their own.
2. **The portrait.** Replace the image with your author's own, square and
   cropped to the head, and write the alt text to match. On a single-author
   journal that is the whole job. On a
   multi-author one you have two honest options: delete the image, which leaves
   the name and bio reading as they did before, or keep this pattern for the
   posts of one author and paste a second copy with a second portrait for the
   next. Nothing here picks a face by post.
3. **The bio.** It comes from the author's profile, so it is edited in Users
   rather than here. If your authors have no biography, delete the block: an
   empty one prints nothing and leaves the card looking short.
4. **The card's width.** 50%. A long biography wants more; the exits then get
   narrower, which is the trade the composition is making.
5. **The top rule.** Take it off and the section stops closing the article.
6. **The finish.** Ship the base for a symmetrical close, and `bio-lead` where
   the author matters more than the neighbours.

## Notes

- Core blocks only: group, columns, column, paragraph, image,
  post-author-name, post-author-biography, post-navigation-link. No plugin, no
  script.
- The portrait travels as a URL on our host with no attachment id, so nothing
  in the buyer's media library is referenced and no foreign id is copied.
