Edit Your Homepage

Your program has its own public web address, like stonefield.triopilot.com. You build the homepage visitors see there block by block in the Homepage Builder. Only admins can open it.

Where Your Homepage Lives

Your homepage is your program's web address: your application link without /student/application on the end. The Application Builder page shows the full application link at the top.

Every visitor sees a top bar with your program's logo, or your program's name if you have not uploaded a logo on the Program tab in Settings, plus an Apply Now button that opens your application form. That bar is there no matter how you design the page. A short footer sits at the bottom. The browser tab shows your program's name, from the Program tab in Settings.

The homepage is optional. While it is off, visitors to your program's address go straight to the application form. See Turn the Homepage On or Off.

Open the Homepage Builder

1. In the admin sidebar, choose Homepage Builder.
2. The first time you open it, a starter layout is already filled in: a welcome banner, a "What We Do" section, two eligibility cards, a services list, a "Start Your Application" button, and a contact section.
3. Edit the starter text so it describes your program. It is placeholder copy, not something you have to keep. On an EOC program it describes adult college access; on every other program type it names no group of students, no eligibility rule and no college access services, so add your program's own. A new Hero Banner starts with the same kind of wording.

The contact section is filled in from the Project Information on the Reporting tab in Settings. Details you left blank are left off the page.

Work With Blocks

The page is made of stackable blocks. The Components list on the left offers Hero Banner, Text Section, Two-Column Section, Contact Information, Image, Divider / Spacer, and Call to Action Button.

• Add a block: drag it from the Components list onto the page, wherever you want it.
• Edit a block: click it on the page, then change its text, colors, and layout in the panel on the right.
• Reorder blocks: drag a block up or down on the page or in the Outline list on the left. The Outline list is also a quick way to find and select a block.
• Duplicate or remove a block: select it, then use the copy or trash button on the small toolbar that appears, or use the Duplicate and Delete buttons beside the block in the Outline list.
• Add a picture: use the Image block, then either upload a file or paste an image URL. Uploaded images must be PNG, JPEG, WebP, or GIF, up to 2 MB.
• Undo a mistake: use the undo and redo arrows in the top bar. Ctrl+Z (Cmd+Z on Mac) also works, with Shift added to redo, as long as your cursor is not inside a text box.

On a narrower screen, such as a tablet held upright, Components and Outline sit above the block's settings in one column on the left, so the page preview keeps most of the width. A block name too long for the Outline ends in an ellipsis instead of making the Outline scroll sideways.

Set Colors

Blocks that can be tinted have a Background Color field (Section Background Color on the Call to Action Button), and the Hero Banner and Call to Action Button also have a Button Color. Leave a color blank and the block uses its built-in default: a deep indigo for the Hero Banner's background and the Call to Action button, a white button on the Hero Banner (indigo when its Text Color is Dark), a light gray background on the Two-Column Section, and no background color on the other blocks.

The homepage does not follow the Color Scheme on the Program tab in Settings. That scheme colors the staff portals only. To use your program's colors on the public page, set them block by block here.

Publish Your Changes

Nothing in the editor reaches the public until you choose Publish in the top bar. A green check and "Homepage saved and published." appear beside Publish (under it on a smaller screen), and the live page updates right away.

When you publish without an image you uploaded earlier, TRIOPilot deletes that image file, and within about a minute it is no longer at its web address. If another admin removed an image and published while you were editing, Publish asks you to upload that image again; the message stays beside Publish until you publish again or turn the homepage on or off.

There is no draft and no autosave: if you leave the page without publishing, your edits are lost. The starter layout is not public until you publish it once.

Turn the Homepage On or Off

Above the editor, a status bar shows Homepage enabled or Homepage disabled, with a button to switch: Enable Homepage or Disable Homepage.

• Enabled: visitors to your program's web address see your homepage.
• Disabled: visitors are sent straight to the application form. Your homepage design is saved, just not shown. Staff of your program who are signed in go to their own start page instead (an advisor's Dashboard, for example), so typing your program's address does not open the form for them. Participants signed in to your Student Portal go to their portal, while the portal is on. To see the form yourself, add /student/application to the address.

New programs start disabled, so turning it on is a deliberate choice. The switch takes effect immediately and is separate from publishing. If you enable the homepage before you have ever published, visitors see a simple page with your program's name, a short "coming soon" note, and an Apply Now button.

Good to Know

• Apply Now is always one click away. The top bar button is always there, and the starter layout's banner and call to action button link to the application form too. Your homepage cannot hide the way in.
• Links must be web links. A button link can be a page on your site (like /student/application), a web address starting with http:// or https://, an email link (mailto:), or a phone link (tel:). Anything else, such as www.stonefield.edu without https://, stops the save. The Button Link and Link URL fields say what to change under the field when you leave it, and Publish names the link to correct and saves nothing. A link inside your rich text follows the same rule: the Link button says what to change, and Publish refuses a new one. A link your page already held does not stop a publish.
• The application form is separate. You build its questions in the Application Builder. See Build Your Application Form.