Featured Hero Image

The Featured Hero Image is the image that spans the width of the site at the top of each page, below the Mega Menu Navigation.

Not every page will have its own unique image. By default, subpage's Featured Hero Image should be the same as its parent's Featured Hero Image.

To begin with, all pages should have the same image as their Department (and in some cases, Division) landing pages.

  • Ex: "Report a Missed Pickup" lives under Utilities/Trash & Recycling/Report a Missed Pickup. It will have the same image as Trash & Recycling, which will have the same image as Utilities, unless it is customized.

The Featured Hero Image can be changed. However, please seek the approval of your Department Content Manager or the Site Administrator first.

Featured Hero Image Requirements

  • Photo should be 1400x500. NOTE: The top quarter of the image will be covered by the mega menu. Keep this in mind when resizing. Suggested tool: BeFunky.com
  • Photo should be compressed. Suggested tool: optimizilla.com
  • Text is not permitted on the image itself (use a regular photo and you can use the caption if you want to add context).
  • We strongly recommend sending your desired photo(s) to the Site Administrator for resizing.
  • Resize the browser to mobile size after you upload to see if it works well.

Don't want a hero image at the top of your page? 

Department and division landing pages should have featured hero images. However, subpages are not required to have a featured hero image.

If you do not want to have a featured hero image, go to Page Options Page Properties in the black toolbar. Go to the Theme dropdown and select Subpage (no Featured Image).

Choose a Featured Image

Looking for a featured photo image? Browse our Flickr album of sized feature photo options

Important: Make sure you download the Original Size (1400x500).

How to add a Featured Hero Image

Go to Page Options > Page Properties in the toolbar.

Change the Theme to Subpage.

  • The theme should be Inherit on every page, unless you are customizing the image. This way the featured hero image will default to the image of its parent page.

Click the search icon next to Featured Image to choose the photo you want to use.

How to change featured hero image

If the photo is not already on the website, you will need to upload it. 

First, navigate to the folder for your page. You may need to create one if it doesn't already exist.

  • For example, the featured image for Robinson Preserve should live under Government/Department/Parks & Natural Resources/Parks, Preserves & Beaches/Robinson Preserve

Once you’re in the right folder, click the +Upload button and find the sized image on your computer. Select it and click the Upload button.

After the image is uploaded, you will need to double click on it in the window to select it as your Featured Image.

Click the Update Page button in the Page Properties window. The image should update. It should also appear on all child pages, if there are any. (If not, go to Page Options > Page Properties on the page and change the Theme to Inherit.)

How to add a caption to a Featured Hero Image

Go to Page Options > Metadata…

Enter your desired caption in the field next to Page Header Title.

  • Keep captions short. Don’t let your caption to extend to a second line, or it will cover up most of your photo on mobile. 

If you want to include a link, you will have to use HTML to add a link to a word or phrase:

  • <a href=”URL”>word or phrase you want linked</a>
  • Example: Registration for summer camps is now open. <a href="http://www.mymanatee.org/camp">Register now.</a>

Click Submit when you’re done. Refresh the page to see the caption.

How to add a caption to your featured hero image