Flexible Content in Drupal

Posted February 6th, 2022 at 4:05 pm.

Flexible Content

What is it?

Flexible Content items are specially designed content that you can add to any page. Some pieces will pull in content from other areas. Some pieces will be unique for each page you add it to, and can therefore be customized to that specific page. Some are a combination, providing some syndicated content paired with something custom for that page.

Most Content Types have the ability to add some or all of these Flexible Content Items. These are Basic Page, Event, News, Program and Story content types.

Flexible Content Items:

WYSIWYG
Accordion
Announcement 4-up
Callout
Course Code
Description Code
Carousel
Columns
Contact
Donor List
Embed
Event: 3-Up
Feature: Grid
Feature: Large
Feature: Medium
Feature: Quote
Homepage Feature: Large
Homepage Feature: Medium
Homepage Feature: Story
Image Detail: Large
Image Gallery
Image List
News-3up
News & Contact
People: List
Slide: Homepage Hero
Social Media: Callout
Social Media: Connect
Special List: Large
Special List: Small
Story: 1-Up
Story: 3-Up

Who uses it?

Web Stewards have the ability to create Basic Pages and News articles as well as submit Events. NOTE: All Events are subject to review and approval by the Communications Team, so even though you can add Flexible Content Items, you may want to check with them before doing so.

How to use it?

Regardless of your Role in Drupal or the Content Type you find it in, these Flexible Content Items work the same way everywhere you will find them.

You can add only the ones you need.
You can add multiple of the same type with different content in each.
You can shuffle them around to get them to display in the right order for your specific page.

Instructions for Flexible Content Item:

In most Content Types you will see a HEADING: “FLEXIBLE CONTENT” with a small “pill” shaped dropdown beneath it that you can use to select one of the Flexible Content Items by pressing the down arrow and click-selecting the item you wish to add.

Once opened each type will have different fields to fill in. Make sure to fill in all the required fields for the Flexible Content Item you are adding.

Once you have added some content, you can save the page (at the bottom of the page) and see what your content looks like.

You can then click the Edit tab if you want to rearrange the order of the flexible content by dragging and dropping by the crosshair next to each one, or you can add additional Flexible Content Items by clicking the pill dropdown and selecting one to add.

You can do things like expand and collapse each one or all of them.

You can also edit, remove or duplicate any individual one.

WYSIWYG

A typical WYSIWYG (What You See Is What You Get) editor that gives you the ability to

Embed images
Embed videos
Embed tables
Blockquotes
Make links
Make primary buttons and secondary buttons out of links
Link to content on the site by title instead of URL.
You can also upload files there (there will be a pop-up window that has Help Text near the Upload File button that says”Use the button above to upload a document in a new tab. Once you add the document, close that tab and return to this screen and search for your document in the URL field.”)
And all the other things a typical WYSIWYG can do

WYSIWYG text editor options:

Hover over a button to see a description of the button, or review the options below.

Click the down arrow on the Formatting to see the list of available options. Please note that there are additional formatting options when text has been made into a link. Paragraph formatting options allow you to set normal text or headings. Links can be formatted for Primary or Secondary buttons. Other font and style options are set by the College template and cannot be changed here.

Left to right: Bold, Italic

Left to right: Link, Unlink

Left to right: Insert/Remove Bulleted List, Insert/Remove Numbered List

Left to right: Image, Video, Table, Blockquote, Insert Horizontal Line.

Note: Tables should be used only for tabular data, not for layout purposes. See the Accessibility Guide for details.

Left to right: Align left, Center, Align Right, Justify

Left to right: Remove Format, Set Language, Source, Maximize

Adding a link:

Searching for content by title. For internal brynmawr.edu links, the title search is the recommended and best approach

When you select the title you want

Drupal will put in the Drupal-specific relative URL so Drupal can find it for the user later when they click on the link:

Once you’ve made your selection, click the save in the popup window to return to the normal WYSIWYG.

If you need your link to be outside of our website, you can also use the Link Icon to achieve this.

Simply type your text and highlight it. Then click the Link icon.

This will open the Linkit Popup window where you can type the full address of the external URL, please note that you will need to put in a full external URL into the link field but it must begin with either http:// or https://

Once you’ve typed in the full external URL, click the save button in the popup window to return to the normal WYSIWYG.

Links as Buttons

Now you can highlight the text link and get to apply one of two styles to it, Primary Button or Secondary Button. You could also just let it be link text, if it is just part of a paragraph.

The nice part is that you can see the style for either button right in the WYSIWYG:

Linking to a specific part of a page: These links are called “anchor links.”

One last note on links is making an anchor link. In order to do so you would need to set the anchor name and then link to it. There are two ways of doing it, on, using the Anchor Link Flag icon, and one by manually placing the anchor in the code.

To add an anchor link to a page using the Flag icon, click the flag icon.

Choose a name for your anchor (example: “target”).

The address of your anchor will then be “#AnchorName”. For example, “#target”.

Drupal will tell you that it couldn’t find any suggestions for that text so it will use it as is, which is exactly what we want.

Press Save in the pop-up to return to the WYSIWYG.

Manually setting the anchor link:

In this example we will manually place the anchor in the code. Here we have some text that will link to a table. First, we need to set the anchor name. We do this by clicking the source icon in the toolbar and scrolling down in the code until we get to the area in which we want to add the anchor. Here we will place our cursor and type <a name=”tableJump”></a>

Then, click on the source icon again to return to the WYSIWYG view. Once we see just the text and not code, we will link the text to that anchor name by typing the text, highlighting it, clicking the link icon in the toolbar and typing the anchor name with a preceding #, like so

Drupal will tell you that it couldn’t find any suggestions for that text so it will use it as is, which is exactly what we want.

Press Save in the pop-up to return to the WYSIWYG.

Remove links by highlighting them and clicking the chain link with x icon.

Linking to documents

Linking to an email address:

Simply type the email address in the WYSIWYG. Drupal will convert the email address to a link upon save.

Images and Videos in the WYSIWYG

The other things that are improved or different are how you can embed an image or video, and also how a blockquote looks on the actual page. To see how to upload new Videos and how to upload new Images, please read our Media article.

To add an image, simply place your cursor where you want the image to appear and then click the image icon in the toolbar. This will give you a pop-up to select a new image for upload or select one that is already in the Media Library. In this example we are using one that is already in the Media Library.

You will be able to select the style the image receives as it is appearing in the WYSIWYG area of the page. You can have it float right or left or take up the width of the WYSIWYG area.

You can scroll down in this popup window to create a caption or just have the image appear on its own.

When you are satisfied with all the selections you have made in the popup window to embed the media item, you can press the Embed button

If you realized you needed to edit the image, you can right-click on it within the WYSIWYG and select Edit Image. Double clicking on the media object also brings up the edit screen. This will bring you back to the Embed Media Item popup window so you can amend your selections.

To embed a video in the WYSIWYG, you would place your cursor where you want the video to appear and then click the video icon in the toolbar

This will give you a popup to either select a video in the Media Library or Add a new one

In this example I’m just picking one in the Media Library. Make sure to scroll down in the popup window and then click Embed button.

Once you click Embed, Drupal will ask you to make sure you picked the correct one. If you are satisfied with your selection, Click Next. This will give you a popup to add a caption to the video, if you’d like. Whether you add a caption or not, you will need to click the Embed button to complete the process of embedding the video

Blockquote in the WYSIWYG

To add a blockquote, simply type your text then highlight it and select the quote-marks in the toolbar. PLEASE NOTE: the blockquote style will NOT just indent it like in the old site, but rather, it will put it in a talk-bubble.

As you can see, when I save my page and look at it, the blockquote appears in a talk-bubble on the right side:

Tables in the WYSIWYG

You can also create a table in the WYSIWYG by putting your cursor where you want the table to be inserted and pressing the table icon in the WYSIWYG dashboard:

Once clicked, you will get a Table Properties popup window where you can tell it how many rows and columns you want, as well as if there should be table headers, row headers, a caption or summary

Once you are satisfied with the properties you entered, you can hit the OK button

Note: All properties may be adjusted later by right clicking (ctrl+click on a Mac) on the table and selecting “Table Properties.”

Then you will see the empty table inserted into your text, ready for you to fill out.

Pasting tables from Word or Excel

You can also insert a table and then paste a table from Word into it by highlighting all the cells. You can also just put your cursor where you want the table to show up and paste the table from Word right there. Either way, Drupal will popup a message that asks if you’d like the Word extra code to be cleaned up. You should say OK

This puts your data right in the table:

You can also copy some cells from an Excel spreadsheet and paste it right into the WYSIWYG or you can insert a table, highlight all the cells and then paste. Here is how they look in the WYSIWYG, but they don’t look different in the actual page.

If you need to edit the table properties to, say, add a header row, you can right click to see what things you can do. You can add cells, rows, columns just by hovering over the triangle on the right to see more options. You can go into the table properties to add header row or header column

The rest of the things you can do is very similar to what you are used to with a typical WYSIWYG such as bold, italics, text alignment, and bullet points.

Accordion

This Flexible Content Item is a typical accordion element, where you have a Title and an Item for each accordion item in the accordion list. You can add as many Accordion Items as you’d like, using the “Add Accordion Item” pill button. The Accordion has a Heading and Introduction that will appear before the accordion list.

It displays like this on the page:

Announcement 4-up

This Flexible Content Item is a way to syndicate Announcements based on a tag or manual selection so that they can appear on your page. There is a place for a heading and an intro so people know what these announcements are about.

If you click on the Tag Selection dropdown you will see all the tags you could select. Selecting a tag here will display the latest four announcements associated with that tag. If there are less than four announcements associated with that tag, less than four will display. If there are no announcements associated with that tag the Announcement 4-Up Flexible Content Item will not display at all.

A Note on Tags: For News, Events, Announcements, and Story it is worth noting that using the tag approach will keep content fresh by updating the the latest 3/4 items. Manually selecting items will require manual upkeep to keep content fresh as these will not update on their own.

The other option would be to manually select specific announcements. For this you would Open the Manual Selection area and click open the Select Announcement Items pill button

This will open a pop-up window that will allow you to search for and select the item you want

Simply click the box next to the item you want, scroll down and click the “Embed” button.

You can select up to four items total. You can click open the Select Announcement Items pill button as many times as you need to search and find the item you need.

You are able to rearrange the items by simply hovering over the title so you see the crosshairs and then dragging and dropping them to reorder.

This is how it will display on the page:

Callout

This is a Flexible Content Item that calls attention to something. It allows you to have an image, title, body text and up to three links. This is a versatile element because you have the ability to just have a heading, or just have links or just have some text, or include an image. This is what it looks like displayed on the page with all the options filled in:

When you choose to Add Callout you will see options to fill in. A heading and a heading level. This allows you to be mindful of accessibility needs by properly setting the correct heading level. It is defaulted to H2, which is usually fine for most situations. If you don’t fill in a heading, no text will appear.

It allows you to select the color background for the box, with choices of either grey or yellow. It is defaulted to grey.

You can optionally add an image, body text and up to three links.

You can either upload or select an image that is already in our site’s Media Library. We will go over Uploading an image in detail on our Media techdoc.

The three links can be set to open in a target window, and is default to “none” (no target selected). These links are optional.

These links can also be set to have either a primary or secondary style, or just be a plain link

Course Code

This is only for Course Editor. Only certain people will receive this supplemental role. It provides permissions to edit a Courses page. Please contact Communications if you need your Department Courses page edited.

Course Code is only used for the Courses Content Type. It is a Flexible Content Item because you are able to add more than one.

If you are editing a Courses Page, you could add another Course Code, if you are displaying multiple Courses or Concentrations (like the Classics where they display Greek, Latin, etc.).

Description Code

This is only for Course Editor. Only certain people will receive this supplemental role. It provides permissions to edit a Program Description page. Please contact Communications if you need your Department Program Description page edited.

Description Code is only used for the Program Description Content Type. It is a Flexible Content Item because you are able to add more than one.

If you are editing a Program Description Page, you could add another Description Code, if you are displaying multiple Descriptions (like the Classics where they display Greek, Latin, etc.).

Carousel

A carousel is a Flexible Content Item that can be added to any Basic Page, News Article or Event, if logged in.

When you click-select the Carousel from the Flexible Content list, you will get fields to fill in for the behavior of the Carousel and fields for each slide, with a button to add another slide item

The behavior of the Carousel is just telling it which way to align the overlay text box, on the left or right side of the image. This alignment is for ALL the slides in the Carousel. This means that you will have to curate your images so they all look good with the text box over the same side throughout your carousel.

The fields for the Slide are Title, Supertitle (which appears above the title), Image, Body and a CTA (or Call to Action) which has a URL field and a Text field.

The CTA can have an outside URL like https://google.com or you can use the type-ahead box to look for the title of a node to link to. (Note: external or outside URLs must include http:// or https://)

Once you add all your slides, you can save the page and see how it looks.

Columns

Columns is a Flexible Content Item that allows you to make a columned display of a list of items that have title, image, body text and URL that display three across as a block of content. The Columns Flexible Content Item starts with a heading and an introduction field to display before the list of items

Each item has title, image, body text and URL fields where the only field that is required is the title. The URL field will make the title text into a link to that URL you put in.

This example shows all fields filled in with four items

Contact

This is a great piece of Flexible Content that will allow you to put contact info on your page. It consists of Heading, Title, Image, and a body field, which is a limited WYSIWYG where you can write the contact info exactly the way you want.

Here is how our example looks on the page:

Donor List

Only used in Honor Roll. Since the Donor List is a Flexible Content Item, you can add as many as you’d like.

Embed

If you have been granted Embed permissions (This was Full HTML permissions in the old site), you may use these instructions to embed forms and other content that provide iframe or javascript embed code.

If you don’t have this permission but would like to request it please reach out to help@brynmawr.edu or communications@brymnmawr.edu for assistance.

Only embed content from known, trusted sites. Ask Web Services if you aren’t sure.

This Flexible Content Item is used to embed a form or something advanced that the WYSIWYG is programmed to strip out. It is similar to the old Full HTML ability in the old site.

It should only be used for specific code-related embedding needs. It is an extra level of permission. If you don’t have that level of permission, you will see something like this:

If you do have permission to use that Flexible Content Item, you would see a non-WYSIWYG text box appear. In this example, we have pasted in the WuFoo embed code so a form will appear on the page.

Copy the embed code. For example, in Wufoo, hover over your form and click “Share” to get the form code.

Edit your page and scroll to bottom to Add Embed Flexible Content Item then paste the code into the non-WYSIWYG text box

Save your page and see if the form or other content is displayed as expected.

Event: 3-Up

This Flexible Content Item allows you to curate a listing of 3 events either by tag or by manually selecting the ones you know you want to advertise in this list. These events display similarly to the Columns above. To create this listing, you have a Heading and Intro field, along with selecting events by tag or manual selection.

To select a tag, simply click on the arrow on the dropdown to see all the tags you can choose from

If you prefer to use the Manual Selection, you can press the Select Event Items pill-button and a pop-up window will come in with a list from which you can make your selection. You can filter by title or date and click apply to see a less broad list.

Once you have checked the boxes of all the events you want to display, you can scroll to the bottom of the window and click the Select Events pill-button. This will put them in the Flexible Content area. Then, you can drag-and-drop them to rearrange the order if you want

Feature: Grid

This Flexible Content Item displays a grid of images with linked text below or next to a heading and some intro text, depending on the page display. This Flexible Content is most akin to the Image Linkset functionality from the old site.

Here is the grid feature in a page:

Feature: Large

This Flexible Content Item is a great way to draw attention to an important program or feature. This Feature Large has all the pieces overlaid on the image. It has an image, heading, intro field and space for up to three links as well as an additional dropdown of links (Feature Child: Dropdown)

This is the Feature Large without any Child Features

Feature Child: Dropdown,

If you choose to add Feature Child Dropdown, you will get these fields to fill out. Note that you can add up to 5 items maximum.

Feature Child: Quote,

If you choose a Feature Child Quote, you will get these fields to fill in

Here is how it looks with a dropdown and a child quote

If you want to change the Block Item for a different one, simply edit the page, expand this Flexible Content Item and the scroll down to the Item Block, click the dots and select “Remove”

Then you can use the Item Block dropdown to select a different Add Feature Child

Feature Child: Special Caption,

If you choose Feature Child Special Caption you will get these fields to fill in

This is what it looks like with a Special Caption

Feature Child: Statistic,

If you choose to add a Feature Child Statistic you will get these fields to fill in

This is what it looks like when you add a Feature Child Statistic

Feature Child: Video

If you choose to add a Feature Child Video you will get these fields to fill in

This is what it looks like to add a Feature Child Video

Feature: Medium

What is the difference between Feature: Large and Feature Medium?

Feature: Medium is a more subtle way to feature content than the Feature: Large as it isn’t a full-width display.
Feature: Medium presents the image as smaller than in the Feature: Large
Feature: Medium arranges the text and extras around that image differently than in Feature: Large.

This Flexible Content Item is a great way to draw attention to an important program or feature. This Feature Medium has only the quote, statistic, caption or link to a video overlaid on the image, if you choose to add one. It has a heading, image, image alignment option, intro field and space for up to three links.

This is the Feature Medium without any Feature Child

You can also have a quote (Feature Child: Quote), statistic (Feature Child: Statistic), caption (Feature Child: Special Caption) or link to a video (Feature Child: Video) displayed prominently. Please see Feature: Large for how the entry forms look for each of these Feature Child Items by following the link for each item below.

Feature Child: Quote,

This is how the medium feature looks with a quote

Feature Child: Special Caption,

This is how it looks with the Feature Child Special Caption

Feature Child: Statistic,

This is how it looks with a Feature Child Statistic

Feature Child: Video

This is how it looks with a Feature Child Video

Feature: Quote

This Flexible Content Item is a nice way to feature a photo, quote, and attribute (Name) to highlight something. No need to put quote marks around the quote.

Fill in the required fields and then press Save to see the Feature Quote on your page

Homepage Feature: Large

This is for HOMEPAGE EDITOR, SITE EDITOR and above and is only available for the Homepage Content Type.

This Flexible Content Item is a great way to draw attention to an important program or feature. This Homepage Feature Large has one of the Feature Child block options overlaying the bottom portion of the image (see each example below). It has an image, title, intro field and space for up to three links.

Feature Child Dropdown

Feature Child: Main List Item

NOTE: These things will be displayed under a The Details heading along with the Additional List Items

Here is how it looks with the Main List and a drop down both closed and expanded

Once you have a Feature Child option filled in, you are able to remove it if you want to change what you use there. Simply click the three dots on the right of that item and select Remove. Then you can decide to use a different option. Please note that once you remove it, you would have to create it from scratch if the removal was accidental.

Feature Child: Quote form looks like this

This is how it looks with a quote

Feature Child: Special Caption form looks like this

This is how it looks with the Feature Child Special Caption

Feature Child: Statistic form looks like this

This is how it looks with a Feature Child Statistic

Feature Child: Video form looks like this. You can see that you can pick an existing Remote Video or add a new one. You can learn more about adding videos in our Embedding Videos tech doc.

Here we will just select an existing one

This is what the form looks like after we have pressed the Embed button

This is how it looks with a Feature Child Video

Homepage Feature: Medium

This is for HOMEPAGE EDITOR, SITE EDITOR and above and is only available for the Homepage Content Type.

This Flexible Content Item is a great way to draw attention to an important program or feature. This Homepage Feature Medium has one of the Feature Child block options overlaying the bottom portion of the image (see each example below). It has an image, title, intro field and space for up to three links.

Feature Child: Main List Item

Feature Child: Dropdown. Here is the form for the Dropdown, where you can add up to 5 items

NOTE: These things will be displayed under a The Details heading along with the Additional List Items

Here is how it looks with the Main List and a drop down both closed and expanded

The Feature Child Quote form looks like this

This is how it looks with a quote

This is how the Feature Child Caption form looks:

This is how it looks with the Feature Child Special Caption

Feature Child: Statistic form looks like this. NOTE you can only have a 4-character Statistic Number.

This is how it looks with a Feature Child Statistic

Feature Child: Video form looks like this. You can see that you can pick an existing Remote Video or add a new one. You can learn more about adding videos in our Embedding Videos tech doc.

Here we will just select an existing one

This is what the form looks like after we have pressed the Embed button

This is how it looks with a Feature Child Video

Homepage Feature: Story

This is for HOMEPAGE EDITOR, SITE EDITOR and above and is only available for the Homepage Content Type.

This Flexible Content Item has a few more fields than a typical Flexible Content Item Story 1-up. This allows you to really feature a story and add extra links and text to it.

Here we see the fields available: Heading, Introduction, CTA, story, story title (this is something like Academic Excellence, to help promote certain categories), quote alignment, a The Details section that helps you provide more links and additional text to further enhance this content item.

Here are how all these fields look in the display:

Image Detail: Large

This Flexible Content Item is a great way to draw attention to an important program or feature. This Image Detail Large has the top of the text block slightly overlapping the bottom of the image. It has an image, title, intro field and space for up to three links.

Feature Child: Quote,

This is how it looks with a quote

Feature Child: Special Caption,

This is how it looks with the Feature Child Special Caption

Feature Child: Statistic,

This is how it looks with a Feature Child Statistic

Feature Child: Video

This is how it looks with a Feature Child Video

Image Gallery

This Flexible Content Item consists of a Main Image that is used as the cover photo to indicate there is a gallery, then when the visitor clicks on it, a slideshow opens up in a Lightbox so the person can view the gallery of images as slides.

As you can see, the Main Image and first slide title and image are required fields. It is recommended that the Main Image be one of the images from your slide deck. The Slide optional fields can be filled in, but do NOT appear on the Gallery Slide. The Gallery optional field (Introduction) does appear if filled in.

Once you add a second slide, you can drag to reorder the slides using the crosshair next to the word Slide

This is how the gallery appears on the page

This is how it appears in a Lightbox when you click on the Gallery element

Image List

This Flexible Content Item has the ability to pair an image with text and to alternate which side the image aligns on, this makes it a great choice for creating a list of Image/Text pairings to present some important things to highlight. Please note that some fields are optional, which gives you flexibility in how your content is displayed.

The first item we filled in all the fields, the second item we only filled in the required fields

News: 3-Up

This Flexible Content Item provides a great place to curate the three latest News items either by tag or by manually selecting them.

If you choose a tag you will get up to three of the latest News articles associated with that tag. It is possible that if you choose a tag nothing could show up on the page. This is usually because either there are no News articles with that tag association or it may not be permitted to display in the page’s main theme.

In our example here, we chose a test tag called IFTEST Tag 1

If no news articles are showing up, you can circumvent this by using Manual Selection, which allows you to choose any News article to display, up to three.

Please note that you can only select from the list page you are on. If you page forward and select more, the system will only remember the selection from that page, not the previous page.

You can also drag-n-drop the articles to reorder them

News & Contact

This Flexible Content Item provides a great way to curate a place for a few News items paired with a Contact Us. Please note that the Contact area is just a WYSIWYG field that allows you to format it the way you like.

Selecting News Items is the same as in the News 3-Up Flexible Content Item above

People: List

This Flexible Content Item allows you to curate a list of people to make a department or lab people page. It works similarly to how you can select News Items where you can only make selections on one page, embed them and then select more from a different page of the people picker pop-up

You can search for people by their name, or department

Just remember to hit Apply once you have put in your search criteria in the filters at the top

Once you have embedded people from one page of the picker, you will have to click Embed and then reapply the filters to find more folks on the next page of the picker for your search criteria

You can also drag and drop your selections to reorder folks

You can also use the Remove button to remove that person from the list you are creating. Note: This will only delete them from the listing. They will still appear on other departments’ listings if applicable.

You can also add multiple People Lists so that you could have a list of Faculty and then a list of Staff on the same page

Slide: Homepage Hero

This is for HOMEPAGE EDITOR, SITE EDITOR and above and is only available for the Homepage Content Type.

If only one Hero slide is added, it will be just a hero image. Once you add a second one, it becomes a carousel.

Only a title and an image are required for a Hero slide.

If you would like a link on the slide, you can choose between a CTA or a Video Link.

Here is what each type of link looks like on the slide

Social Media: Callout

This Flexible Content Item allows you to add URL links to your department’s various social media accounts so folks can follow you online.

You can add URLs from Facebook, Instagram, Twitter, LinkedIn and YouTube

This is what it looks like on the page:

Social Media: Connect

This Flexible Content Item allows you to hand curate posts from various social media accounts. The Handle is required so it can display on the image. The background color is required if there is no image uploaded in the form to use as a background (used most often with Tweets). The URL should be the full URL to your social feed for instance https://instagram.com/BrynMawrCollege

You can select from Instagram, Twitter and YouTube. It is recommended that you have a minimum of 4 items to have it look its best.

We used only three items in our example. As you can see fewer items take up less of the page width

Special List: Large

This Flexible Content Item allows you to have a Special List with a title that can be linked or not, along with some additional text that you would add to the body field.

This is what it looks like on the page

Special List: Small

This Flexible Content Item is a small list of titles only. It is also an additional part of the Basic Page in a special spot at the top called Audience Quick Links. Adding links to it is the same in either spot, but the Audience Quick Links can’t be moved like the Special List: Small can within the Flexible Content.

You can add as many items as you’d like

This is how it looks on the page

Story: 1-Up

This Flexible Content Item is a way to syndicate a Story onto your page. This can be done with tags or manual selection.

Since this is a single story, it will display as a nice feature item to help your visitors connect your page content to that story.

This example was done with an Alumnae/i tag to bring in the content.

Story: 3-Up

This Flexible Content Item is a way to syndicate three Stories onto your page. This can be done with tags or manual selection.

Since we chose Alumnae/i as the tag it is only displaying one item

Since only one item is coming in, we can remedy this by manually selecting items, much as we did for the News 3up. Or switch this to just be a Story 1up if we truly wanted that tag.

We can also reorder the Story Items