Website builder — pages, blocks, and templates

The Website builder is TrailsIQ's block-based CMS for your public site. It powers your home page, an unlimited list of custom pages, and the templates that render every single news post and event through the same visual editor. Live at a canonical preview URL out of the box; wire it to a vanity domain to launch it as your real website.

What the website builder is

Every Pro or Enterprise org gets a full public website driven by a block-based editor. Storage is split two ways:

• Org-level layout — a single JSON blob on the organization row holds the site's on/off switch, the shared header + footer, and the accent-color theme.
• Page rows — one row per page (home, plus every custom page you add) holds the page's title, URL slug, publish flag, sort order, and the ordered list of blocks that make up its body. Two special "template" rows also live here: the Post template (rendered for every single news post) and the Event template (rendered for every single event).

The public URL structure is:

• Home: /site/{your-org-slug} (canonical) or / on your vanity domain.
• Named page: /site/{slug}/{page} or /{page} on vanity.
• Single news post: /site/{slug}/news/{post} or /news/{post} on vanity.
• Single event: /site/{slug}/events/{event} or /events/{event} on vanity.
• Single trail: /site/{slug}/trails/{trail} or /trails/{trail} on vanity. Every public trail has one; there is nothing to set up.
• Built-in indexes: /news and /events (or their canonical prefixes). Create a page with slug news or events to override the built-in with your own layout.
• iCal feeds: /events.ics (whole calendar) and /events/{event}.ics (single event).

Report a trail issue link. Wherever a block asks for a link, the chain button beside the box lists your pages, plus News, Events and Report a trail issue. Pick that one for a button that lets visitors report a problem. On a phone with the TrailsIQ Report app it opens the app, ready to report to your organization. On a computer, or a phone without the app, it opens the page where they can download it. You still write the button's own text, and you can type any other address in its place. Press × on the link to clear it.

Add starter pages in the right panel fills in Home, Trail conditions, Get involved and About with blocks already in place. On first open, the builder auto-seeds a Home page (one Hero block), a Post template, and an Event template so nothing renders blank while you're getting oriented. Every site also has a Trails page, a Trail page template and a Network page template from the start; all three are described below.

Opening the editor

Open Website builder from the sidebar, under Public site authoring. The row appears when your plan includes the builder and your role has Manage website on. On a plan without it the row is not in the menu — Settings → Website still opens and shows a "Pro plan required" card with an "Upgrade to Pro" link. Otherwise the editor launches full-screen — this is the only surface in TrailsIQ that takes over the whole viewport, because the canvas needs the space.

The top bar reads, left to right:

• × to leave the editor, then your organization's initial
• Page picker — the button under your organization's name, showing the page you are editing with Page, Shared or Template in front of it. Click it to switch: pages are grouped under Pages, Shared header and footer and Templates, and a draft page shows "(draft)" after its title
• New page (the + icon) — opens the New page window
• Page settings (the gear icon) — the current page's title, address, publish switch and delete
• Desktop / Tablet / Mobile — the width the canvas is drawn at. Tablet and Mobile show the page exactly as a visitor's tablet or phone lays it out, and you can still click and edit every block in them. When your window is too narrow to show a tablet at full size it is drawn smaller to fit, and the label above it says by how much, for example Tablet · 820 · 84%
• Site Published / Site Hidden — whether the site is open to visitors
• All changes saved / Unsaved changes
• Undo / Redo (Cmd/Ctrl-Z / Cmd/Ctrl-Shift-Z)
• Save (Cmd/Ctrl-S) — writes the current page
• View live — opens the current page in a new tab
• Publish / Hide — the site-wide on/off switch

On a phone the bar takes two rows: the page picker on the first, and the status and buttons on the second. The width buttons are left off, since a phone is already showing the phone layout.

Flash toasts appear top-right and auto-dismiss after ~3 seconds. Trying to navigate away with unsaved changes triggers a browser confirm.

The three-panel editor UI

Desktop = three columns. Mobile (≤760px) = one column with a bottom tab strip: Blocks / Preview / Details.

• Left panel — Layers and Add block. Two tabs at the top. Layers lists every block on the current page, in order, each with its icon and a line of what it says. Drag the ⠿ handle to reorder, and hover a row for Move, Duplicate and Delete. The shared Site header and Site footer sit above and below the list; Edit on either opens it. Add block shows the block library, grouped by what each block is for, with a search box at the top. A new block goes below the one you have selected, or at the end of the page when nothing is selected, and the panel says which before you pick. Point at a block in the library to see a preview of it, drawn with your own site's design and data; it closes again when you move off it. The eye button keeps a preview open until you close it.
• Center — Live canvas. The page drawn in a browser window, with the shared header above it and the shared footer below (click either to edit it). Hovering a block outlines it with its name and a small bar of move up, move down, move to another page, duplicate and delete. Clicking a block selects it. The + that appears under a block you hover opens the library to add one right below it. An empty page shows "This page is empty" with an Add your first block button.
• Right panel — Settings. With no block selected: the Theme, with your accent color, the template, corners, starter pages and donations, and links to your form inbox and payments. With a block selected: that block's settings in three tabs, and the × at the top goes back to the Theme. A block type with no editor of its own shows its raw settings in a text box instead.

The three tabs on a block:

• Content — what the block says and shows.
• Style — the block's colors, one row each. A row on Default follows your theme and accent color; click the swatch or type a hex value to set your own, and × to go back to the default. The number beside Style is how many colors the block offers.
• Advanced — the Block ID, which other links can jump to with #the-id, and the Dividers: a shape across the top or bottom edge of the block.

A block placed inside a Columns block keeps its colors, Block ID and dividers at the foot of its own settings, inside the column.

Moving a block to another page

The arrow icon on a block (Move or copy to another page) sends it somewhere else: another page, a template, or the shared header or footer. Everything in the block goes with it, so its text, pictures, links and colors arrive as they were. Pick the page, whether it goes at the top or the bottom, and whether to Remove it from this page or Keep a copy here as well.

Moving saves the page you are on, since the block is no longer on it. If you had other unsaved changes on that page, they are saved at the same time, and the dialog tells you so before you press the button. A copy changes only the page it lands on. When it is done, Open it takes you to where the block went.

Pages a block cannot go to are listed but grayed out. A menu or a footer block only belongs in the shared header and footer, and a template part, such as the post body or the trail map, only works on its own template, where there is a post or a trail for it to show.

Blocks — the building materials

The Add block library groups blocks by what they are for, and the search box at its top narrows the list as you type (try donate or map). The same groups appear when you add a block inside a column.

Page tops

• Hero — Full-bleed cover image with headline and CTAs. Under the photo, tap the part that must always show (Keep in view) and use Darken the photo until the headline reads clearly on it.
• Page header — A title band for the top of an inner page, with an optional button. Give the button a label and a link, or leave the label blank to hide it.
• Alert bar — A slim notice across the top of a page. Write your own message, or let it show your first closed trail automatically and hide itself while nothing is closed.

Text and layout

• Text / embed — Headings, paragraphs and embeds stacked in one block. A paragraph has a formatting toolbar above it: bold, italic, strikethrough, two sizes of subheading, bulleted and numbered lists, a quote, a text color and links. To add a link, select the words, tap the link button, and enter a web address or a page on your site such as /about. A link opens in the same tab unless you tick Open in a new tab. Clear format takes the styling off the selected words. For a video, a map or a form hosted somewhere else, add an Embed item and paste the code the other site gives you.
• Columns — Two to four columns side by side, each holding any of your other blocks stacked inside it. Pick a layout from the row at the top of its settings: 50 / 50, 33 / 67, 67 / 33, 33 / 33 / 33, 25 / 50 / 25 or 25 × 4. Switching to a layout with fewer columns moves the blocks from the columns it drops into the last one, so nothing is lost. Columns fold under each other on a phone, and the blocks inside them take a smaller, card-like shape.
• Buttons — A row of buttons you design yourself. Each one is an icon on its own (in a square or a circle), an icon with a title and an optional second line, or a box with an icon on top, a title and a few lines of text. Choose any icon from the full icon library, a shape, a size, a link, and its background, text, icon and border colors. A background left on default takes your site's accent color. Icon size makes the icon bigger or smaller than the one that comes with the button's size; an icon-only button grows to fit it. On a button or a box, Align across puts the icon and words on the left, center or right, and Align up and down sets where the icon sits beside two lines of words, or where a box's contents sit when it is taller than they are. An icon-only button reads its title aloud to screen readers and shows it on hover, so give it one. Any button can also have a Background photo: tap the part of it that must stay in view, and use Darken the photo until the words on the button are easy to read. The background color shows while the photo loads.
• Timeline — Milestones down a line, each with a date, a title, a sentence or two and an optional photo. On a wide screen the photo sits beside the words; in a narrow column or on a phone it goes above them.
• Questions — Questions and answers that open one at a time.
• Files to download — Documents and images visitors can open or download: a trail map as a PDF, a waiver, meeting minutes, a spreadsheet. Choose or upload files opens your files library, where you can pick files you have already uploaded or upload new ones. Each file can have its own name and a line about it. See Files and uploads.
• Call to action — Centered headline + subtitle + buttons. Add a photo and it splits in two, photo on one side and the words on the other, like a Join us band.
• How it works — Numbered steps row with connecting line.

Trail info

• Trail conditions — How many trails are open, as a sentence and a colored bar, over a row per trail or network with its status. A trail's row also shows how wet it reads and your crew's condition note, and the length when it is known. Wetness shows only while weather is turned on for your organization. Tick Show forecast to add the weather to the same block, with the same choices as the Forecast block (which network, hourly or daily, how many days, a heading and subtitle), placed above or below the conditions. On the Trailhead and Backyard designs you also choose its background: white, inside the conditions panel, or transparent on the block's own background. Tick Auto-scroll when overflowing to show the trails or networks as one line that scrolls by itself when they do not fit; it stops while a visitor points at it, and each name opens that trail's or network's own page on your site. If your organization does not show trail status publicly, this block does not appear on your site at all, and no other block shows a trail's status either: the Trails list, the trail pages, the map and the hero's open count all leave it out.
• Stats bar — Counters that fill themselves in: trails, distance, networks and bridges, plus this year's volunteer hours, volunteers, trail tasks completed, events, event attendees, trail visits counted and the share of days your trails were open. The this-year numbers count from January 1 and match your annual report. Any slot can also hold a number you type yourself. Tick Count up to each number and the numbers run up from zero when a visitor scrolls the bar into view; a value without a number, like YEAR-ROUND, stays as it is.
• Trails list — The full trail list grouped by network — same layout as the hub page. A visitor taps a network's name to fold its trails away and taps it again to bring them back; the name, trail count and status stay in view. Tick Start with networks folded to show just the network names at first, which keeps a long list short on a phone. A search always opens the networks it finds trails in. Each trail shows its length, difficulty and main use, and opens the trail's own page on your site. That page shows a map of the trail with its start, finish and any hazards over contour lines of the ground around it (in feet or meters, to match your organization's country), and an elevation chart a visitor can trace along the route. Under the chart are the distance, climb and descent, the steepest and average grade, and which way the trail faces. Below those are the difficulty, which way the trail is ridden, whether bikes and e-bikes are allowed, the surface, the access, the main use and the other uses allowed, all taken from the trail's own settings; anything you have not filled in is left off. Then come your description and the current conditions. Beside them are the trail's network, the hazards on the trail, a Trails nearby list of up to four of your other public trails, closest first (a trail that meets this one says Connects), and a link that opens TrailsIQ Go at that trail. While weather is turned on for your organization, a Trail weather box under the current conditions shows how wet the trail reads now, whether it is drying or wetting, and a chart of the last five days and the next two with the rain on each, along with soil temperature, today's high and the rain over the last 24 and 72 hours. The days around today are worked out the same way as today's reading, from the rain that fell or is forecast. The chart and the bar above it always mark where caution starts and the trail's closure threshold. If your organization shows trail status publicly, the box also gives a verdict (good, caution or too wet); if it does not, the box shows the readings without a verdict. When your crew has recently logged a wetness reading on the trail, the days after it start from that reading, the same way today's reading does.
• Find your trail — Dark CTA section with linked cards.
• Trail map — A map of one of your networks, drawn right in the page in your site's own fonts and colors. Color the trails by status (open, caution, closed) or by each trail's own color, pick a map look (Trails, Outdoor or Minimal), and choose whether the trails are listed under it. A visitor taps a trail, on the map or in the list, to see its status, your crew's note and its length, with a link to the trail's own page. On the TrailsIQ map it is a live map visitors can zoom and pan; one finger scrolls the page past it and two fingers move the map. With any other map setup the block draws the trails as an outline instead.
• Hazards — Active hazards, listed by hand or filled in automatically: maintenance items your team marked Warn the public, at their own level (Danger, Warning, Caution or Notice), then your closed and caution trails that carry a note. A visitor taps a hazard to open its trail's page; one you list by hand links when the trail you name is one of your public trails. See Warning the public about a hazard.
• Live from the trails — The Activity today feed from your public hub page, on your own site: today's public day notes with their photos, the weather, and the trail and lift changes your public timeline shows, newest first. It follows the same settings as the hub page, so an event you hide there is hidden here too, and turning off public trail status or weather takes those rows off both. It starts over at midnight in your organization's time zone. Choose how many updates show before Show more, leave the weather out if the page already has a forecast, and write the line visitors see while nothing has been posted yet. A public post appears on the site as soon as it is posted; a status change or new weather can take a few minutes to follow.
• Grooming report — When each trail was last groomed.
• Hourly forecast — Weather now and the next couple of hours, or a few days ahead with each day's high and low. Pick the network whose weather it shows, or leave it on Automatic, which uses the network with the most weather readings. A network with no forecast yet shows nothing rather than another network's weather. On the Trailhead and Backyard designs you choose its background: a white panel, or transparent on the block's own background.

Get involved

• Get involved — A row of linked tiles, each an icon, a title and a line of text: Join, Donate, Volunteer, News and Events to start with, and you can change, reorder or add to them. An optional Subscribe tile at the end takes an email address.
• Donation form — Preset amounts, one-time or monthly, and a progress bar toward a goal. Gifts go straight to your own PayPal, Stripe or other giving page.
• Shop — Sell t-shirts, hats, stickers and other gear. Each product has a photo, a name, a price, a line about it and the sizes or colors it comes in. With your Stripe account connected (under Settings → Card payments (Stripe), or Donations in the Theme panel), a product with a price in numbers, such as 25, needs nothing else: it gets an Add to cart button, with your sizes or colors to choose from beside it. Visitors can put several products in one cart, in different sizes and amounts, and a Cart button in the corner of the page opens it. Check out pays for the whole cart in one card payment on Stripe's page, which asks, unless you untick Ask card buyers for a shipping address, where to send it. To charge for postage, type an amount under Shipping fee per order: it is added once to every card order that asks for an address, however many products are in it, shown under your products and in the cart before checkout, and listed on Stripe's page as Shipping. If one cart holds products from two Shop blocks with different fees, the higher fee is charged once. The cart stays in the visitor's browser while they look around your site. Each order is listed under Settings → Payments with who bought it, each product with its size and how many, the shipping fee, the address and when it was paid. If a product in somebody's cart has been removed, sold out or no longer comes in the size they picked, checking out stops and tells them which one, and nothing is charged. A product can instead carry a link to a checkout of your own: a Stripe Payment Link, a PayPal button, a Square checkout link or any other https:// page that takes payment. Its Buy button then opens that page in a new tab, that page collects the card, the address and the size, and the order is only in your account there. A product with its own link is bought on its own and does not go in the cart. Either way the money goes straight to your account. Tick Sold out to keep a product on the page without a button. Without Stripe connected, a product with no checkout link shows without a button.
• Volunteer signup — Name, email and the kinds of help somebody is interested in.
• Newsletter signup — One email field.
• Contact — Your contact details beside a message form.
• Sponsors — Sponsor logos or names with optional links. Tick Show in random order and each visitor sees them shuffled, so no sponsor always gets the first spot; the editor keeps your list order while you work.
• Local guide — A guide to the places around town that a visitor needs before and after the trail: coffee, the bike shop, food, a brewery, somewhere to stay. Each place gets a card with its kind, its name, a line in your own words on why to go, an optional Trail perk such as a member discount, its address, hours, phone and website. Places of the same kind share a filter button, so a visitor can tap Coffee and see just the coffee. Directions opens the address in Google Maps; fill in Town and it is added to any address that does not already name it, so 12 Main St finds your Main Street rather than somebody else's. Tick Supports our trails on a place and its card carries a ♥, with a line under the guide saying what the heart means. It is a way to thank sponsors with something visitors actually use, rather than a logo they scroll past, and it tells visitors plainly which businesses help pay for the trails. You can list places that are not sponsors too, and the guide reads better for it. Tick Show in random order so no business always gets the top spot.

Every email field on your site checks the address as it's typed. A common misspelling such as gmial.com gets a Did you mean gmail.com? line, and the form won't accept an address whose domain can't receive email, so what lands in your inbox is somebody you can actually write back to.

News and events

• News grid — Grid of article cards with image, title, excerpt. Auto-pulls from your published News dashboard (up to 12), or you can hand-curate a list.
• Events list — Upcoming events with date, meta, and tag. Same auto vs manual toggle as News.
• Social posts — Posts you pick from Instagram, Facebook, TikTok, YouTube or X: paste the link from a post's Share or Copy link button, up to 12, and each shows as that platform's own post card or player. The editor tells you when a link is a profile or page rather than a single post. Or switch it to Latest YouTube videos, enter your channel link or @handle, and your newest videos appear on their own, in your site's style, usually within half an hour of going up.

Photos and features

• Photo gallery — A grid of photos with captions.
• Card slider — Carousel of feature cards; center card stands out. Each card can have a photo; once it has one, tap the part of the photo that must stay in view (Keep in view), and every screen size crops around that spot.
• Features grid — 3-column icon + title + description cards.
• Feature showcase — Two-column: text + bullet list + image.

App showcase

• Marketing hero — Dark hero with badge, headline, buttons + optional phone mockup.
• Smartphone mockup — Standalone phone frame you can slot into columns.

Menu and footer

• Top menu — Fixed navigation across the top. Lives in the shared header page, not a regular page.
• Footer — Lives in the shared footer page, not a regular page.

Trails page

• Trail directory — Every public trail, grouped by network, with a search box and network and difficulty filters. Beside each network are its location and description from the network's own settings, and its trail count, length and how many trails are open. The network's name opens its own page, and a long description is shortened, with a Read more link to that page. Each trail shows its difficulty, uses, length and status, and opens the trail's own page. Choose which filters show, whether network descriptions show, and how many trails each network lists before a Show all button (3, 6, 10 or all of them).
• Types of trail — A card for each type of trail you have (singletrack, flow trail, multi-use path and so on) and the networks it is found in. Each network pill opens that network's page. The types come from each trail's own settings, where a trail can have a primary type and others it also is, and it is listed under each one. A type no public trail has is left off.
• Difficulty ratings — Each difficulty rating your public trails use, in your own difficulty colors, with how many trails have it and a couple of them to try.
• Features by network — A table of features such as rock gardens, roots, creek crossings and viewpoints, network by network. Lots means at least half of a network's trails have it, Some means at least one does. It reads the features ticked on each trail, and Horse access comes from the trails open to horses.

All four start on the Trails page, and you can add any of them to another page too. Every one has its own title and subtitle, and the last three let you rewrite the description of each type, rating or feature in your own words; leave one blank to keep ours. In the builder, a block with nothing to show yet says what it needs.

The Post template, Event template and Trail page template groups appear only while you are editing those templates.

Every block supports rich per-block color overrides so you can tint a hero eyebrow, a card background, or a CTA button independently from the site accent. The fonts come from the template you pick; see Website templates, donations and forms.

Creating and editing pages

+ New opens the "New page" modal:

• Title — the label that shows in the page picker (placeholder "e.g. Conditions").
• URL slug — prefixed with /. Auto-fills from the title until you edit it. Hint: "Letters, numbers, hyphens. Auto-fills from the title." Server rules: lowercase letters + digits + hyphens, must start and end with an alphanumeric, unique per org.

Errors surface as "Slug can only contain lowercase letters, digits, and hyphens." or "A page with that slug already exists." Flash on success: "Page "{title}" created." The new page lands in your page picker; the canvas opens on an empty state ready for blocks.

⚙ Page settings on the topbar opens a modal for the current page: preview URL, Title, URL slug (locked to '' for the home page with hint "The home page's slug is locked."), "Page published (visible to visitors)" checkbox, and a Delete page button. Home cannot be deleted — the server refuses with "The home page cannot be deleted."

The Trails page. Every site has a Trails page at /trails, listed with your pages in the picker. It starts with a page header that counts your networks, trails and miles (pick Trail totals as the header's eyebrow to use that line on any page), then a Trail directory, Types of trail, Difficulty ratings and Features by network. Move, retitle, remove or add blocks like on any page. Its address cannot change, because every trail's own page lives under it, and it cannot be deleted. To hide it, untick Page published. To keep it off the menu, untick Show in the menu in its page settings; the page stays at /trails. No other page can use the trails address. The Trails page appears only while trails are turned on for your organization.

Switching pages with unsaved changes shows "You have unsaved changes. Switch pages anyway?" Flash messages on save/delete: "Page updated.", "Page deleted.", "Page saved."

The shared header + footer

The nav bar and footer aren't per-page — they live on a dedicated Shared chrome page in the page picker (under a "Shared chrome" group). Both are Menu / Footer blocks with their own editors.

Menu editor. Wordmark (defaults to your org name), Menu links (add/reorder a list of label+href pairs), and a Call-to-action button (label + href; leave the label blank to hide the button — hint "Filled button on the right of the menu."). Your org logo from Settings auto-renders next to the wordmark.

The Trails link adds itself. Your Trails page is in the menu without you adding it, after Home (or first, if there is no Home link), named after the page's title. To put it somewhere else or call it something else, add your own link to /trails in Menu links; yours is used instead. A link already named Trails that only jumps to a spot on the home page, like the starter menu's, is pointed at the Trails page. The link is left out when the Trails page is unpublished or Show in the menu is off, and while you have no public trails.

Footer editor. Tagline, Social links (Facebook, Instagram, X/Twitter, YouTube, LinkedIn, TikTok, Strava — each shows the platform's icon; a row with no link is left off), a TrailsIQ Go switch (on for every site: the TrailsIQ Go icon in your footer opens your organization's page in the app, or offers the download to somebody who doesn't have it yet; there's no link to enter, and the icon isn't shown while your organization is hidden from the app), Link columns (each with a heading + link list), and a Copyright line (defaults to "© {year} {org name}").

Both render on every public page — the canvas locks them and shows a purple Shared header — click to edit / Shared footer — click to edit badge; clicking jumps you into the shared editor.

Post + Event templates

Every news post and every event renders through a template — one for posts, one for events — so you set the layout once and all articles / events pick it up.

Post template. Editable in the page picker under Templates → Post template. It's composed with template-only slots: post_hero, post_title, post_meta (published date + "By {author}" byline), post_excerpt, and post_body. Drop these in whatever order you like; wrap them in Columns; add a CTA underneath; whatever fits your brand. If you clear the template, sensible defaults render (hero + excerpt + body).

Event template. Same idea. Slots: event_hero, event_title, event_when, event_location, event_excerpt, event_body, event_maintenance ("What we'll be working on" — auto-pulls the linked open maintenance issues), and event_signup (the RSVP form). Rearrange them, wrap them in Columns, drop a features grid underneath — anything.

Trail page template. Every trail's own page, the one a visitor reaches from the Trail directory, the Trails list or a map, is built from this template. Find it under Templates → Trail page template. Its blocks are the parts of a trail's page: Trail header (name, difficulty, status and photo), Trail map and profile, Trail details (length, climb, grade, type and features), About the trail (description and current conditions), Trail weather, Trail hazards, and Network and nearby (the network, uses, trails close by and a report link). It starts with the header, map and details across the page, then a Columns block with the description and weather on the left and the hazards and nearby trails on the right. Reorder the parts, remove one, change a heading, or add any other block between them, such as a Call to action or a Donation form. The builder draws the template with one of your public trails so you can see the result; every trail fills it with its own data.

Network page template. Every public network has its own page too, at /networks/ followed by the network's name, reached from the network names and Read more links on the Trails page, the type pills under Types of trail, and the Other networks list on another network's page. Find it under Templates → Network page template. Its blocks are Network header (name, location and how many trails are open), Network map (the trails in their difficulty colors, trailheads and hazards on one map over contour lines, where pointing at a trail shows its name and clicking it opens the trail, with the trail count, total length, open count and the low and high points), Network details (season, parking, fees, uses, dogs, access and who manages it, plus the mix of difficulties), About this network, Trails in this network, Network weather, Trailheads (trailhead and parking points, with directions), Network hazards and Other networks. It starts with the header, map and details across the page, then a Columns block with the description, trails and weather on the left and the trailheads, hazards and other networks on the right. Season, fees and dogs come from the network's Visitor details. Trailheads lists the network's points of interest marked Trailhead or Parking in one Trailheads & parking box, a row per location that opens to show its address and parking, the trails that start there (each linking to its page), what is on site, the other types the point also is, the types of the infrastructure linked to it, Also types included, such as a kiosk that is also a trail map, and a Get directions button. The first location starts open. A trail starts at a trailhead when one of its ends is within 75 m (about 250 ft) of it, or when the trailhead is filed against that trail; an uphill-only trail starts at its bottom and a downhill-only one at its top. Only public trails are listed. The block's settings change the box's heading and the Trails from here label. A hidden network has no page. With public trail status off, the page shows no conditions and no open counts.

Slot blocks are hidden from the palette on regular pages so you can't accidentally place a post_body on your home page and stare at a blank spot.

Theme and per-block styling

Template decides the whole design: fonts, spacing and how each block is laid out. Every template has every block, so switching keeps all your pages and words. Pick one in the right panel when no block is selected; Website templates, donations and forms covers the choice.

Accent color is the other site-wide lever, editable in the same panel. It cascades: explicit website accent → the org's Settings → Primary color → an STP fallback if both are blank. The accent drives buttons, headline accents, and hover states across every block.

Every individual block has a Colors section under its editor that overrides the accent for that block only — hero eyebrow, card background, section background, CTA button, whatever the block exposes. Overrides are stored as config.style.{key} and applied as CSS custom properties on the block root, so they never bleed sideways.

Logo comes from your Settings → Organization logo. Update it there once and the menu block, favicon, and every share preview pick it up.

Uploaded images. All image blocks share the same uploader: POST to a shared endpoint under website-images/{orgId}, JPG/PNG/WebP up to 5 MB, gated by your org's plan-storage quota. If storage is full the upload fails with the plan-limit error.

Publishing and previewing

Publishing is site-wide, not per-page. The Publish / Hide button in the topbar flips the whole website's visibility. Flash: "Website published." / "Website hidden."

Per-page publish flag. Every page has its own Page published checkbox in the Page settings modal, so you can draft a page while the site is live. Unpublished pages return a 404 to public visitors.

Preview. Managers always see everything, published or not, with a yellow banner across the top:

• "Preview — this site is currently hidden from visitors." when the site is off.
• "This page is unpublished — visitors get a 404." when a specific page is drafted.

View live ↗ on the topbar opens the current page's preview URL in a new tab so you can spot-check the render.

Custom (vanity) domain

By default your site lives at /site/{your-org-slug} on app.trailsiq.com. Attach a custom domain to launch it as your real website — a subdomain such as trails.example.com, or your root domain example.com itself, in which case www.example.com is set up beside it and sends visitors to the same site. Custom domain covers which to choose and the DNS records each needs.

Setup lives at Settings → Custom domain. Same Pro/Enterprise plan gate applies. The flow:

1. Enter your hostname. Error copy blocks the obvious mistakes: "Enter a valid hostname like trails.example.com (no http://, no path).", "That domain is already attached to another organization.", "That hostname is reserved."
2. Flash on success: "Custom domain registered. Add the DNS record at your registrar, then click "Re-check status"."
3. Update your registrar's DNS to point the hostname at the CNAME shown on the page (or the A-record IP fallback if you're stuck at an apex domain that can't CNAME).
4. Click Re-check status until the pill flips to "Live".

Once the domain is Live, TrailsIQ serves the block-based site directly at that hostname. Forms, event signups and the donation page work there exactly as they do on your TrailsIQ address, with spam protection built in.

If your builder is turned off, the vanity domain falls back to the bare hub page at /hub/{slug} so your visitors still see something.

Permissions and plan gating

Plan gate. The website builder is available on Pro and above. On a plan without it the sidebar row is hidden; Settings → Website still opens and lands on a "Pro plan required" card with the body "The website builder is part of the Pro plan, alongside vanity domains." Mutating endpoints abort with "Website builder requires Pro or Enterprise." if hit directly.

Role gate. The "Manage website" permission (blurb: "Edit the website-builder pages, navigation, theme, and the home + about content that surfaces on the public hub. Requires Pro or Enterprise.") defaults on for owners and managers; off for field workers and volunteers. Toggle it per-role from Settings → Roles & permissions. Platform admins always pass. The sidebar entry only renders when the permission is on.

Custom domain shares the plan gate and adds its own role gate. The error copy on the customer domain create endpoint reads "Custom domains are available on the Pro plan and above."

Common gotchas

• The home page slug is locked. It can't be renamed or deleted. Renaming would orphan every href="/" link across your site; deleting would leave you without a root URL.
• Turning off the site hides everything from visitors but managers keep seeing every page with the yellow preview banner. Individual pages can be unpublished while the site is live.
• Menu + Footer live in the shared chrome page, not on individual pages. Trying to add them to a regular page's canvas isn't possible — the palette hides them.
• Post and event body slot blocks are template-only. They inject data from the currently rendering news post / event. Dropping a post_body block on your home page shows nothing.
• Auto news/events blocks show published items only. A news post has to be published and its publish date reached; an event has to be published and still upcoming.
• Auto-mode blocks show up to 12 items. Max posts to show picks any number up to that.
• Image uploads count against your plan storage quota. A rejected upload returns the storage-limit error from the guard.
• Vanity domain quirk — no sessions. Signup flashes on vanity domains use URL query flags (?signup=success&signup_msg=…) instead of session flash so success messages still land.
• Internal links on the canonical preview host get auto-prefixed. A block's href="/about" becomes /site/{slug}/about on the canonical URL and stays /about on vanity, so you can author bare links once and both hosts work.
• Search titles and descriptions write themselves. Every page gets its own title (the page name and yours, and just your name on the home page) and a description taken from its opening text: the line under its heading, or its first paragraph. A news post uses its summary, an event its summary, and a trail or network its description, or a sentence saying how long the trail is, how hard and where. The home page uses your site description from Settings → Website when you have written one. Page settings shows what a search result for that page will say. To word it yourself, press Write your own there; clear the boxes to go back to automatic. Search results cut a title after about 60 characters and a description after about 160, and Page settings shows the count.
• Search engines are told what each page is. Events carry their date, time and place, posts their date and author, trails and networks where they are, and every page sits under Home in a breadcrumb, so a search result can show more than a bare link. Every published page, post, upcoming event, network and trail is listed in a sitemap that search engines read on their own. With your own domain, the sitemap and every page's address are on that domain, and the TrailsIQ copy of your site points search engines there. A page you are previewing before it is published is marked not to be indexed.
• Every page arrives finished. Your site's pages are built before they are sent, so a search engine reads your headings, trail list, news and events straight away rather than waiting for the page to assemble itself in a browser. Visitors see the same page either way. A page also downloads only the design your site uses, so it opens faster on a phone, which search engines take into account too.

What's next

• Read the News article to see how the News grid block turns your published articles into a live section.
• Read the Events article to see how the Events block, /events index, and per-event event_signup form all compose through the builder.
• Set your custom domain on Settings → Custom domain and launch. The rest — page copy, hero photos, menu links — you can iterate on with the site live.