Introduction

The purpose of this quick reference guide is to outline the intended uses of the News Detail Page template on the UChicago Intranet for Sitecore content authors. The document also includes best practices for components most commonly used on this page template. 

If you are unfamiliar with the terms in this guide, you may find this Glossary helpful. If you are unfamiliar with navigating the Sitecore Ribbon, you may find this guide helpful.

Where to use the News Detail Page template

The News Detail Page template should be used only to create internal news stories for the UChicago Intranet. News Detail Page stories must be created in a News folder. 

Examples in use

• https://intranet.uchicago.edu/news-and-events/news/2022/03/artperks
• https://intranet.uchicago.edu/news-and-events/news/2023/10/savasana-at-sunset-in-rockefeller-chapel
• https://intranet.uchicago.edu/news-and-events/news/2024/01/new-years-resolutions-five-things-to-do-at-uchicago-in-2024
• https://intranet.uchicago.edu/news-and-events/news/2024/02/uchicagoreads-black-history-by-black-authors
• https://intranet.uchicago.edu/news-and-events/news/2024/02/sixty-plus-years-of-defining-folk-culture-at-the-university-of-chicago

Taxonomy

The Taxonomy section of your News Detail Page is important for adding tags to help categorize your news story to reach its intended audience.

To make edits to Taxonomy, navigate to your page in the Content Editor, and find the Taxonomy section (toward the bottom). 

School/Division

You can choose from a list of schools and divisions to associate with your content. To select a school/division, click on the school/division of your choosing, and click the right arrow to move it over into the Selected box. You can choose more than one school or division if applicable. If you do not see your school/division in this list, please reach out to uchicagointranet@uchicago.edu.

Tags

This section is not currently functional. Please ignore this section.

Target User Role

If your news story is meant for a specific user role (like Staff or Academic) you can select that role in this section from a dropdown. If your news story is meant for all user roles, please select "All." Note: if you leave this blank, it will still be visible to all roles. 

Topic

Please select the topic most relevant to your news story from the dropdown list. If no topics are relevant you can select "none." 

Commonly used components

If you are unfamiliar with how to add components, you may find Introduction to Data and Components and Navigating the Experience Editor helpful. You can explore a list of all Sitecore components in the Sitecore Components List.

Default components

The News Detail Page template comes prepopulated with the following components. If you decide not to use any of these components they must be removed from the page in the Experience Editor before publishing to avoid accessibility issues.

Article Header

Allows content authors to create a small banner at the top of the page with a text title, topic, publish date, and author. All News Detail Pages should use this header. Please do not remove or replace. The component uses the News Detail Page template as its data source, so you do not need to create a new data source in the data folder. 

To edit the Article Header, navigate to your page in the Content Editor. Under the Content section, you can edit the Page Title. Under the Author section, you can edit the Author and News Source and Publish Date. Please note that if you leave the News Source blank it will automatically populate as "UChicago News." If you're unsure, the News Source should be the name of your Unit.

Important notes on Publish Date: Setting the publishing date of your story will determine in which folder it lives in the content tree. The month and year of this publish date will also be a part of your URL. It is imperative that you do not change the date to a new month and republish once you have already published your news story. This will change your URL and break your original link. 

News Image with Caption

Allows content authors to display a full-width image with an optional caption as the lead image of their story. This will also appear as a thumbnail next to the story when it appears in a News List. The News Image with Caption uses the News Detail Page as its data source under the Summary Content section of the page in the Content Editor. 

Fields: 

• Image: Images for this component should be 1000px wide. Height can change depending on your preference, but if you're unsure, 600px height is standard. It should have a clear file name and should be uploaded into an appropriate folder in the Media Library. All images uploaded must include alternate text. Learn more about uploading to the media library with alt text here.
• Image Caption: Use this space to add a caption for your photo. A brief description and photography credit is recommended, but if can leave this field blank if necessary. 
• Thumbnail Image: This image can be exactly the same as the image used in the Image space. This image will appear next to the news story when it appears in a news list on the Intranet's News page or in Search. 

Quick Takeaways

Allows content authors to create a full-width banner with a title and rich text, built to function on the News template. This component can be used for calling attention and summarizing important content. The header "Quick Takeaways" cannot be changed. The component uses the News Detail Page template as its data source, so you do not need to create a new data source in the data folder. 

To edit Quick Takeaways, navigate to your page in the Content Editor. Under the Quick Takeaways section, you can edit Quick Takeaways using the Rich Text field. Bullet points are recommended for this component.

Rich Text 1

The main body of your news story will live in the Rich Text components. The template comes pre-populated with Rich Text 1, but you can add Rich Text 2-5 if more fields are required. Please use Rich Text 2, Rich Text 3, Rich Text 4, and Rich Text 5 in order. This component uses the News Detail template as its data source, so you do not need to create a new data source in the data folder. 

To edit Rich Text 1-5, navigate to your page in the content editor, find the Rich Text section and the corresponding Rich Text field. If you are unfamiliar with how to edit Rich Text please refer to the Rich Text section in Navigating the Content Editor. 

Please note that it's extremely important to make sure you are not copying over formatting from another source into Sitecore. This can easily lead to accessibility issues and create inconsistent formatting across our site. We highly recommend using the "Paste Plain Text" feature to avoid this issue.

Recommended components

Related News

Allows Intranet content authors to display a short list (3 maximum) of news stories that relate to the page content from a list of all news (via the content tree). When adding this component to the News Detail Page, create the data source in your page's data folder.

Fields: 

*Fields with an asterisk are required

• Heading*: We recommend "Related News" but this can be edited if needed.
• Use Highlight Style: Leave unchecked
• Link: We recommend linking to the news page.
• Link Text: We recommend "see more news" which would appear at the bottom of this component. 
• News*: Select a maximum of three news stories from the Content Tree by selecting the story, and then using the right arrow to move them into the Selected window. 

Callout Box

Allows Intranet content authors to place a colorful, outlined box with a header, description, and button in the small column of a two-column page, or in the Main Header of the UChicago Intranet navigation menu. Users also have the option of adding a background image if desired. Several color themes are available. 

We recommend using a callout box to call special attention to a linked resource. When adding this component to the News Detail Page, create the data source in your page's data folder. If you intend to use the same callout banner on multiple pages, you can create the data source in the global Callout Box data folder. This will allow you to use this same data source for multiple pages. 

Fields:

*Fields with an asterisk are required

• Heading: Text placed here appears in a colorful box at the top of the component. In the example above, this is "Campus Messages."
• Description*: The description appears in the main body of the component. In the example above, this is "See more recent messages from the University."
• Call to Action*: External links (leading away from the Intranet) should open in a new window. Internal links (links within the Intranet) should open in the same window.
• CTA Text*: This text appears in a button on the component. In the example above, this is "Announcements Home."
• Background Image: If you would like your callout box to have an image in the background, you can insert one here. If you choose to include a background image, your Heading will not appear. See examples above. Recommended size is 400 by 400px. It should have a clear file name and should be uploaded into an appropriate folder in the Media Library. All images uploaded must include alternate text. Learn more about uploading to the media library with alt text here.
• Theme: You can choose from three color treatments for callout boxes without an image, and three for a callout box with an image. DO NOT USE LIGHT GOLDENROD (it does not meet accessibility standards).

 

Image with Caption

Allows content authors to display a full-width image with an optional caption. When adding this component to the News Detail Page, create the data source in your page's data folder.

Fields: 

• Image: Images for this component should be 1000px wide. Height can change depending on your preference, but if you're unsure, 600px height is standard. It should have a clear file name and should be uploaded into an appropriate folder in the Media Library. All images uploaded must include alternate text. Learn more about uploading to the media library with alt text here.
• Caption: Use this space to add a caption for your photo. A brief description and photography credit is recommended, but if you would like to leave the caption blank, just insert a space. 

Pull Quote

Allows content authors to display a quote with attribution. When adding this component to the News Detail Page, create the data source in your page's data folder.

Fields: 

• Quote: Type or paste the quote you would like to include here. Do not include quotation marks.
• Citation: Include the name and title (if applicable) of the person quoted.

Video Inline

Allows content authors to embed a full-width video that is hosted externally, such as YouTube. Content authors can also add a heading, still image, and set the width of the video. When adding this component to the News Detail Page, create the data source in your page's data folder.

Fields: 

• Embed Script: paste the embed code from YouTube here. You can find your YouTube embed code by selecting "Share" and "Embed" on the YouTube video. Copy the entire script that appears and paste it into this field in Sitecore.

• Heading: If you would like a heading to appear above the video on your page, you can insert the heading here. 
• Still Image: If you would like the video to show a different image than the default before a visitor presses play, you can insert that image here. Make sure it has the same dimensions and pixel size as the video you're displaying.
• Maximum Video Width (in pixels): The height and width of your video will be set in the embed code (in the example above it is 560 by 315 pixels, but if you would like the image width to be smaller, you can insert the maximum pixel width here. To make the image larger the width and height must be changed in the embed code.