Create a Social Media Banner

The social media banner is a page element that includes links to your social media accounts, and displays your latest tweets. An RSS feed is also linked, allowing visitors with an RSS reader to stay up to date on your latest announcements and activities. This tutorial explains how to integrate your social media accounts with the Digital Bell, and add the social media banner to a page.

Note: For your Tweets to be displayed, you must first complete the Twitter API 1.1 tutorial.

To enter your Facebook, Twitter, and YouTube links, first mouse over the "Tools" link, located in the menu at the top of your Digital Bell Dashboard. From the drop-down menu, click the "Site Settings" link. 

In the "Site Settings" section, click "Social Network Links," located in the right margin.

This will bring you to a page with fields for your Facebook, Twitter, and YouTube URLs. Enter the URLs (ex. http://www.facebook.com/myschool) for your social media pages in their respective fields, then click the "Submit" button to complete the process.

The social media banner displays your latest tweets to the right of the link buttons. To do add the feed to the banner, you will first need to follow the steps in the Twitter Feed Integration tutorial. Once the integration process is complete, proceed to the next step.

Once you have integrated your Twitter account and entered the links for you social media pages, you can add a social media banner to any page, using a Developer Action.

Begin by editing the content of the page you wish to add the banner to. To edit a page's content, first click the "Pages" link, located in the menu at the top of your Digital Bell Dashboard. Locate the page you wish to edit on the list that appears, then click the Edit button (pencil icon) to the left of the page title.

In the content editor, click the "Developer Actions" link, located in the right margin, under the "Add Content" heading. This will add a "Developer Action Group" to your page.

At the bottom of the new group, click the "+New Developer Action" button to display the "Add Developer Action" form.

After clicking the button, a form will appear. Add the following information to the form's fields:

Title: Social Banner

Action: Modules.Load

Attributes: Leave blank.

FAVs: "module" = "social-banner"

Once you have filled out the form, click the "Submit" button to create the banner. The banner should now display your latest Tweets, along with buttons that link to the social media pages you entered in the previous step.