Feature Story
Feature Story Overview
The Feature Story content is located in the Story Card component item and consists of five elements to modify:
1. Title
2. Description
3. Teaser
4. Image
5. Call to Action Link
Access the Story Card
1. Navigate to the Story Folder from Content > Agency Name Here > Content modules > Story Folder from the Content Tree.
OR
2. Navigate to the _resources folder under the page.
a. If it does not exist, insert a Story Folder
Create a Story Card
1. Right-click on the Story Folder item.
2. Insert the Story Card option.
3. Name the Story Card title.
4. Modify the Story Card Title if needed.
a. This field is automatically populated from the file name.
5. Enter the Story Card Description.
a. Select the ‘Show editor’ link to add content from the Rich Text Editor.
b. If the Story Card is selected to be highlighted, this content will display.
6. Enter the Story Card Teaser.
a. The teaser text displays when the story card is a sub-story.
b. If the Story Card is not selected to be highlighted, this content will display.
7. Enter the Story Card Image.
a. The image size should be 667x445 px
b. Ensure an Alternate text is displayed on the image.
c. Ensure the image has been optimized for quicker load.
8. Select the Story Card link.
a. Select the ‘Insert link’ to link to a page in Sitecore.
b. Select ‘Insert media link’ to link to a document file in Sitecore.
c. Select the ‘Insert external link’ to link to an off-site website.
9. For internal Sitecore links, select the page you want to link to.
10. Enter the navigation title in the ‘Description’ field.
11. Select the Insert button.
12. Select the Save icon (top left in the Content Editor Ribbon).
Repeat steps 1-11 to create additional Story Cards.
Insert the Story Card on the Page
1. From the Experience Editor, insert a sublayout on the page.
2. Select the sublayout container you want to insert the Story Card component into.
a. Story Card only available on following sublayouts:
i. Full-Width
ii. 9-3 sublayout (9 container)
iii. 8-4 sublayout (8 container)
iv. 6-6 sublayout
v. Dynamic Grid sublayout
3. Select the ‘Story’ tab and select the Featured Story component.
4. Select the Featured Story you want to insert.
5. Select OK.
6. Select the Save icon (top left in the Experience Editor Ribbon).
Create a Story Group
A story group is multiple story cards grouped together into a single component. The Story Group component displays multiple Story cards with one being a lead story and the others as sub-stories. There are two ways that the Story Group displays:
1. Lead story with sub-stories in text boxes aligned right (default view)
2. Lead story with sub-stories showing images under the lead story
Example 1: Lead story with sub-stories in text boxes aligned right (default view)
Example 2: Lead story with sub-stories showing images under the lead story
1. Right-click on the Story Folder item.
2. Insert the Story Group option.
3. Name the Story Card title.
4. Modify the Story Group Title if needed.
5. This field is automatically populated from the file name.
6. Select the Story Group URL.
a. Select the ‘Insert link’ to link to a page inside of Sitecore.
b. Select the ‘Insert external link’ to link to an off-site website.
7. For internal Sitecore links, select the page you want to link to.
8. Enter the navigation title in the ‘Description’ field.
9. Select the Insert button.
10. Select the Save icon (top left in the Content Editor Ribbon).
Insert Story Cards into the Story Group
1. Insert individual Story Cards under the Story Group to display them in the component.
a. See Create a Story Card above
2. To identify the lead story, select the ‘Is Highlighted Story’ under the Title field.
Insert the Story Group on the Page
7. From the Experience Editor, insert a sublayout on the page.
8. Select the sublayout container you want to insert the Story Group component into.
a. Story Group only available on following sublayouts:
i. Full-Width
ii. 9-3 sublayout (9 container)
iii. 8-4 sublayout (8 container)
iv. 6-6 sublayout
v. Dynamic Grid sublayout
9. Select the ‘Story’ tab and select the Story Group component.
10. Select the Story Group you want to insert.
11. Select OK.
12. Select the Save icon (top left in the Experience Editor Ribbon).
Change the Story Group View
1. From the Experience Editor, select the Story Goup component on the page.
2. Select the Display Settings icon from the Story Group toolbar.
3. Select the ‘Display images for all stories in the group’ checkbox.
4. Select the Number of Stories to Display dropdown and assign the number of stories you want to display.
5. Select OK.
6. Select the Save icon (top left in the Experience Editor Ribbon).
Story Group in smaller containers or screen sizes
Default view – Large Desktop
Default view – 1200px
Default view – 576px
Default view – 375px
Image view – Large Desktop & 1200px
Default view – 576px
Default view – 375px
Create a Story Collection
A Story Collection is multiple story groups displayed together in a single component separated by a horizontal line.
Insert Story Groups under the Story Group List
1. Insert Story Groups under the Story Group List to display them in the component.
a. Story Groups need Story Cards added as well. See Create a Story Card above
Insert the Story Group List on the Page
1. From the Experience Editor, insert a sublayout on the page.
2. Select the sublayout container you want to insert the Story Group List component into.
a. Story Group List only available on following sublayouts:
i. Full-Width
ii. 9-3 sublayout (9 container)
iii. 8-4 sublayout (8 container)
iv. 6-6 sublayout
v. Dynamic Grid sublayout
3. Select the ‘Story’ tab and select the Story Group List component
4. Select the Story Group List you want to insert.
5. Select OK.
6. Select the Save icon (top left in the Experience Editor Ribbon).