Visual Markup Guide
The Visual Markup Guide contains diagrams showing how Trellis Core templates render pages in a WordPress site.
Use this guide to see how major block elements are arranged and where class attributes are applied.
Note
These markup diagrams show the layout and classes applied from the Trellis Core theme. Other themes (such as Bamboo, Birch, and Wisteria) may vary from these diagrams.Helpful Information
- Semantic elements such as
<header>
,<main>
,<article>
,<aside>
, and<footer>
have colors applied. - Top-level elements such as
<html>
,<head>
, and<body>
are not shown. All of the markup in the diagrams are contained within the<body>
element.
Diagrams
Click on a link to view the diagram.
What’s Next?
- See the Visual Hooks Guide to see where Trellis hooks appear within page layouts