Skip to Content - Skip to Navigation

Social Media Callout Box: Create and Add to a Page

Social media callbox 4 icon exampleSocial media callbox 1 icon example

The Social Media Callout Box (examples shown, right) will allow you to display one or more of your department's social media network links on your homepage, and other pages in your site.

Setting one up is easy. There are two steps: creating the Social Media Callout Box, and then adding it to a page. You just need your department's social media links (it might be helpful to have them in a word document before you start), and the page you want them to display on. The social networks available are: Facebook, Twitter, LinkedIn, and YouTube*.

*If your department has video(s) on the IUP YouTube channel, talk to the Web Team about getting a link to the video or to a playlist of your videos for use in your callout box.

Step 1: Create a Social Media Callout Box

  1. In the CMS workarea, go to the folder that contains that page you will add the callout box to.
  2. In that folder go to New > SmartForm > Social Media Callout: Depts. (If this is not listed, contact web-team@iup.edu to have it activated for your folder)
  3. In the form, choose Columns to Span. The standard size is Span-6 (6 columns / 271 pixels wide), which is half of a regular page. If you are in doubt, choose Span-6. If your page has a different layout, you can choose 3, 4, or 5 columns wide; whichever suites your layout best.
  4. In the Position dropdown, set your callout box to display on the right or the left side of the page.
  5. Enter your Department Name, which will appear in running text in the box. (ie: Connect with Department Name on Social Media). What you enter in this field will appear between the words “Connect with” and “on Social Media.”
  6. Add your social networks.
    • Choose the network name from the dropdown.
    • Copy your URL address for that network. (Note: Make sure you copy the full address, ie: http://www.facebook.com/name)
    • Add in the URL address by clicking on the Link icon.
      • Paste the URL address in the URL field, AND the Link Text field (if on a Mac you might instead have a Description field).
    • Click OK
  7. To add another social network, click the blue and white rectangle to the left of the words Social Media Network, and choose Insert Below (or Insert Above to add it above) and follow the same process for each additional network.
  8. When you are done, click Submit.

Go to Step 2


On-Page Placement Set Up Guide

Page Type Position Placement in Metadata Position Setting
Needed
Home Page Bottom Left Learn More Normal
Home Page Top Right Extra Content Normal
Regular Page Bottom Left Extra Content Normal
Regular Page Bottom Right Extra Content Float Right
Regular Page Top Right Learn More Float Right

Note: If there are other pieces of content in your Learn More or Extra Content fields, the position of the Social Media Callout Box on the page may change. Contact web-team@iup.edu for assistance.

Step 2: Adding your Social Media Callout Box to Your Page

To add your callout box to your page:

  1. In the CMS Workarea, open your page for editing.
  2. Click on the Metadata tab. See the On-Page Placement Set Up Guide for setting options.
  3. Look for ExtraContentBlock (or Learn More) and click the “Edit” button underneath. (If you do not see either choice, please contact the Web Team and we will add that option for you.)
  4. In the window that opens, navigate through the folders to the section you put the callout box in.
  5. Double-click on the title of the Callout Box so the title appears in the lower box, and then click the Save button located just above it.
  6. The ExtraContentBlock (or Learn More) in your Metadata tab will now show the content title.

After your page is published, you will see the Social Media Callout Box.

  • Web Team
  • Sutton Hall, Room 316
    1011 South Drive
    Indiana, PA 15705
  • Phone: 724-357-3062
  • Fax: 724-357-5512
  • Office Hours
  • Monday through Friday
  • 8:00 a.m. – 12:00 p.m.
  • 1:00 p.m. – 4:30 p.m.