Learn how to use Homepage Featured Items to showcase content at the top of your Homepage with these step-by-step Instructions.
December 23, 2021Homepage Featured Items allow you to showcase content and media.
![Screenshot of the the Test Group homepage on the Energy.gov CMS Support Site](/sites/default/files/styles/full_article_width/public/2021-12/Screenshot%201%20-%20Edit%20Tab.png?itok=EbxYJGbf)
![Screenshot of the Entity type field in the edit tab of a homepage in the Energy.gov CMS](/sites/default/files/styles/full_article_width/public/2021-12/Screenshot%203%20-%20Content%20vs.%20Media%20%28002%29_0.png?itok=6GYAa3Zs)
![Screenshot of the Label field in the Edit tab for a homepage featured items](/sites/default/files/styles/full_article_width/public/2021-12/Screenshot%204%20-%20Adding%20in%20your%20label%20%28002%29.png?itok=GYLlCt0n)
![Screenshot of the Title Override field in the edit tab for a homepage in the energy.gov cms](/sites/default/files/styles/full_article_width/public/2021-12/Screenshot%205-%20Title%20Override.png?itok=ZGQQQYUL)
![Screenshot of the image override field in the edit tab of a hompepage on energy.gov](/sites/default/files/styles/full_article_width/public/2021-12/Screenshot%209%20-%20image%20override.png?itok=Y4DXqjBn)
Color Scheme Examples
![Screenshot of color scheme field for a homepage featured item](/sites/default/files/styles/full_article_width/public/2021-12/Screenshot%208%20-%20color%20scheme.png?itok=X8ORQVSs)
- Light Text
- Light Text on Dark Overlay
- Dark Text
- Dark Text on Light Overlay
- Plain White
- Plain Gray
Please Note: Choosing the color scheme options 'Plain White' or 'Plain Gray' will overwrite the image.
![Screenshot of an example layout](/sites/default/files/styles/full_article_width/public/2021-12/Screenshot%207%20-%20Design%20Examples.png?itok=vqPGX6B7)
Trouble Referencing a Node?
Difficulty Searching for Title
- If you are struggling to find the content or media item in the label field, search using the following format: Title (nid). See example below.
- Updating Homepage Featured Items (4816264)
- Scroll to the bottom and select 'Save'.
Unable to Reference Content/Media
- The CMS prevents users from referencing certain types of content and media as homepage featured items (e.g. Webforms).
- To reference a disallowed item, simply create an External Resource linking to the item you would like to feature.
- Add the External Resource as your homepage featured item to link to your desired piece of content or media.
Responsive Design
Keep in mind that images will be cropped and displayed differently in response to the size of the screen on which the end user is viewing the site.
See below for examples of how homepage featured items will be cropped on different device sizes for the Energy.gov Homepage, Primary Group Homepages, and Nested Group Homepages.
To learn more about the different types of groups mentioned above, see the Energy.gov Glossary.
Energy.gov Homepage
![Energy.gov Homepage Featured Items Large Desktop screenshot](/sites/default/files/styles/full_article_width/public/2022-01/Homepage-Featured-Items-Large-Desktop.png?itok=O6UhR_7x)
![Energy.gov Homepage Featured Items Small Desktop screenshot](/sites/default/files/styles/full_article_width/public/2022-01/Homepage-Featured-Items-Small-Desktop.png?itok=_JMW0o9k)
![Energy.gov Homepage Featured Items Mobile Screenshot](/sites/default/files/styles/full_article_width/public/2022-01/Homepage-Featured-Items-Mobile.jpg?itok=i7LwZh8E)
Group Homepage
![Group Homepage Featured Items Large Desktop](/sites/default/files/styles/full_article_width/public/2022-01/Group-Homepage-Featured-Items-Large-Desktop.png?itok=-YTjnCzO)
![Group Homepage Featured Items Small Desktop screenshot](/sites/default/files/styles/full_article_width/public/2022-01/Group-Homepage-Featured-Items-Small-Desktop.png?itok=ZnIZU7Fn)
![Group Homepage Featured Items Mobile design screenshot](/sites/default/files/styles/full_article_width/public/2022-01/Group-Homepage-Featured-Items-Mobile.jpg?itok=BF-E4LGI)
Nested Group Homepage
![Nested Group Homepage Featured Items Large Desktop screenshot](/sites/default/files/styles/full_article_width/public/2022-01/Nested-Group-Homepage-Featured-Items-Large-Desktop.png?itok=lXy12dEv)
![Nested Group Homepage Featured Items Mobile screenshot](/sites/default/files/styles/full_article_width/public/2022-01/Nested-Group-Homepage-Featured-Items-Mobile.png?itok=6mI0j8cR)