Using Social Media On Pages

Starting with version 4.0.99 you can now embed social media directly through the page properties.  All base code required to show Facebook, Twitter, or Flickr has been preloaded into the page for you.  To get them working you do need to provide the account embed codes for each media type.

Embeding Social Media

The page properties provides you with several fields for each editable zone.  

  • Data Object - set to social media type
  • Data Source - copy/paste embed code from social media site document
  • CSS Style - you can use campus styles in the zone, but it may conflict with social media content

Facebook

Facebook Plugin DocumentationOpens in new window

Use the Facebook documentation to create your iframe embed code.  Facebook has several different types of widgets that you can embed into your pages. 

We recommend using the Post and Page plugins.  Read the documentation on how to configure each type which will create the code for you based on your choices.  You want to choose the IFRAME code from the Facebook embed options. 

Facebook Post Embed Example:

Below you will see what a simple post embed looks like.  There is no special formatting here just the out of the box formatting.


 

Facebook Page Example:

You can embed the timeline for a page within Facebook.  This works for pages, not an individual's profile page, and you may need to change some configuration options in order for it to appear on public web pages.  See Facebook documentation for details.


 

Twitter

Twitter Plugin DocumentationOpens in new window

For Twitter there are two major types of plugins, either a button or a feed.  The buttons allow users to either post content to a feed or link them to your Twitter account so they can follow it.  A feed will embed your timeline right in the page.  We recommend using the Publisher ToolOpens in new window which will help you create the feed content you need.

For Twitter just copy the code that is generated from the publisher tool and paste it into the data source.  If you make changes to your display remember to copy and paste the full code again.

Example of a Twitter button embed type.

Example of a Twitter timeline embed type.

Flickr

Flickr Sharing DocumentationOpens in new window

Flickr allows you to share and post photos and albums to your pages.  You need to copy the embed code for sharing content from Flickr and paste it into your data source.  They have options for what you can do so make sure if you change that you copy and paste the updated embed code back into your page.

Example Flickr feed shown as a slideshow.

Pan-Afrikan Graduation Ceremony

Example Flickr album.

Welcome to CSUF Day 2019