UNH Today: RSS Feed Integration into Websites

Summary

The Publishing Platform allows you to create and manage news articles of interest to the UNH community and display them in UNH Today, which is available online at UNH Today. In this session, we will demonstrate how to integrate UNH Today news feeds into websites using both the Panelizer and Paragraphs features.

• Preparation
• Using the Panelizer feature
• Using the Paragraphs feature

Related Video(s)

How-To

Preparation

In order to complete this tutorial you will need feed URLs.

Instructions

Step 1 - Open your web browser and navigate to the UNH Today website.

Step 2 - Scroll halfway down the page and click on the SUBSCRIBE TO UNH TODAY RSS button

Step 3 - Scroll through the Feeds page to find the feed specific to your needs

Step 4 - Right-click on the RSS Feed link and copy the URL, then paste the URL into a text editor

Step 5 - Scroll back to the top of the page and click on the All Topics menu item

Step 6 - Scroll through the page to find the topic specific to your needs

Step 7 - Right-click on the Topic link and copy the URL, then paste the URL into a text editor

Outcome

You have successfully collected the feed URLs.

Back to top

Using the Panelizer feature

In this segment, we will add a news feed to a website home page using the Panelizer utility.

Please note: The Panelizer Utility is only available in the Drupal 7 top-level UNH.edu build.

Instructions

Step 1 - Navigate to your site home page and click on the "Customize this page" button located in the lower section of your browser screen.

Step 2 - Scroll to the panel region where you want your news feed to display and add a new Panel Pane.

Step 3 - From the List of choices click on "Feeds," then on "Display Feed."

Step 4 - If you would like to title your news section, click the checkbox next to "Override title," then type in your preferred title. For example, "Community News" or similar.

Step 5 - Copy and paste your RSS Feed link into the "Feed URL" field (use the URL you pasted into your text editor).

Step 6 - Choose the number of feed items to display. We recommend 3 to 5 items depending on how many news items are available at any given time, and whether news items are displayed vertically or horizontally.

Step 8 - Copy and paste your topic page link into the "More Items URL" field (use the URL you pasted into your text editor).

Step 9 - Modify the "More Items Text." For example, "More Community News Items".

Step 10 - Select your desired Alignment from the dropdown list, then click on FINISH.

Step 11 - If necessary, drag and drop the new Panel Pane into your desired panel location.

Be sure to save your changes!

The RSS Feed will pull news item headers onto your home page, and the topic page link will take your visitors to the UNH Today website where only YOUR news items will be displayed.

Outcome

You have successfully added a news feed to a website home page using the Panelizer utility.

Back to top

Using the Paragraphs feature

In this segment, we will demonstrate a similar process using the Paragraphs feature.

Please note: the Paragraphs feature is only available in the Drupal Current build.

Instructions

Step 1 - Navigate to your site home page and click on the Edit tab

Step 2 - Your UNH Today RSS feed and topic page link are managed in a Paragraph. For this example, we will assume a Paragraph has already been created for this purpose.

Step 3 - Scroll down the Edit page to the list of Paragraphs near the bottom, identify the Paragraph you will be working with, and click on the Edit button.

Please note: If you are adding a new Paragraph for this purpose, choose the paragraph type Feeds: UNH Today Article List.

Also note: The UNH Today news section is typically stylized with a textured background. To achieve this, first create a One Column Paragraph, then format the background via the Styles tab, then add the UNH Today Article List Paragraph via the Edit Content tab.

Step 4 - Beginning on the "Edit Content" tab, fill in the Title field. We recommend using "Recent Stories" as the text for this field.

Step 5 - Next, choose the Display Format. We recommend using UNH IRP - Horizontal to produce a typical horizontal display of stories.

Step 6 - Next, choose the number of items to display. As mentioned previously, we recommend 3 to 5 items depending on how many news items are available at any given time, and whether news items are displayed vertically or horizontally.

Step 7 - In the "FILTER ARTICLES BY TAXONOMY TERMS" section, choose an appropriate Topic and, if applicable, choose an appropriate Tag.

Please note: If you have questions about which topics or tags to use, you can contact Web and Mobile Development - a link to the work request form is available at the end of this video.

Step 8 - Next, in the "More Items URL" section, type in your more items title in the "Title" field - we recommend using "View All News Stories" as the title - then add the URL to your topic page into the URL field, then choose "Open URL in a New Window."

Step 9 - After editing these content settings, click on the "Styles" tab and set the Heading Styles to "Caret - Centered, Dark Orange" as shown.

Upon completion of these steps, scroll down to the bottom of the Edit page and click on the Save button. The end result should be a display where your most recent news items appear as configured, along with a "more" link that opens a new window and takes you to the topic page showing your news items in UNH Today.

Outcome

You have successfully added a news feed to a website home page using the Panelizer utility.

Back to top

Want to learn more?

Additional help on this and other related topics is available during a regularly scheduled Drupal/myPages/Website Tools - Walk-in/Zoom-in Session. More information, including a complete schedule, is available at Drupal/Sites@USNH/Website Tools - Virtual Walk-in Session.

Need additional help?

If you have any additional questions, please fill out the Website, Mobile, & SharePoint Development & Design Support Form.