Skip to content

Contents: Title starter block

Reference · Intermediate · Bootstrap 5

Organize related content into the reading pattern shown by this layout.

Organize related content into the reading pattern shown by this layout.

  • A page with Bootstrap 5 included. Load its JavaScript for collapse, dropdown, tab or dismiss interactions.

Organize related content into the reading pattern shown by this layout. This reference describes the inserted template. It contains static sample content and no App Connect data bindings or application event handlers.

Insert the block into a Bootstrap 5 page, then expand it in App Structure. Select the child whose content or styling you want to change; there is no separate block configuration form.

Part How to adapt it
HeadingsStart with the h1 reading “Use a title-only section when the page needs a clear opening statement before the supporting content begins”. Replace sample headings with your own content and keep their levels consistent with the surrounding page.
Responsive columnsThe template uses `col-12`, `col-xl-8`, `col-lg-9`. A numeric span is a fraction of the 12-column row; a breakpoint-qualified span applies from that breakpoint upward. Change the column, then check both narrower and wider views.

Replace the sample content with the message, images and destinations for this page. The layout supplies structure and Bootstrap styling; add a data source or application actions only where the intended workflow requires them.

Change the first heading from “Use a title-only section when the page needs a clear opening statement before the supporting content begins” to a title appropriate to your page, for example “Prepare your project brief”. Preview the page at narrow and wide widths and confirm the text remains readable without clipping. Then replace the remaining sample content and verify every route or control you kept.

Use the starter-block guide for insertion and adaptation. For live records or user actions, connect the matching App Connect workflow after the static layout is readable.

You can identify the inserted parts, replace sample content and distinguish supplied Bootstrap behavior from application work still to implement.