New web
  1. Typefaces
    1. Alternate Typefaces
    2. Font stacks
    3. Primary Typefaces
    4. Web-specific Typefaces
  2. Content
    1. Buttons
    2. Content
    3. Embelishments
    4. Headings
    5. Headlines
    6. Lists
    7. Messages
    8. WYSIWYG Styles
  3. Colours
    1. Accessibility
    2. Core colours
    3. Core tints
    4. Grey colours (web only)
    5. Social colours
  4. Icons
    1. Academicons
    2. Font Awesome
    3. Icons8
    4. Other icons
    5. Social
    6. Study Area icons
  5. Images
    1. Generated Varieties
    2. Recommended Sizes
  6. Templates
    1. Recruitment Templates
    2. Restricted Templates
    3. Specialised Templates
    4. Standard Templates
    5. Template Heirarchy
  7. Container Templates
    1. About Section - General
    2. Alumni Award Profile
    3. Area header
    4. A-Z People Listing
    5. Campagin Call to Action
    6. Centres Listing
    7. Contacts Footer
    8. Content Promo Banner
    9. Highlights Feature Carousel
    10. Homepage Carousel Slide
    11. Icon List Row
    12. Index Listing Item
    13. Landing Page Find Staff
    14. Landing Page Header
    15. Landing page search
    16. Media gallery
    17. Overview index
    18. People Listing
    19. Quicklinks Box
    20. Related Degrees List
    21. Reputation Story
    22. Reputation Video Content
    23. Section Footer
    24. Subsite Page Header
    25. Video Content
    26. VR Viewer
  8. Global Components
    1. Cookie trail
    2. Menus
    3. Page Footer
    4. Page Header
    5. UON Global Footer
    6. UON Global Header
  9. Content Components
    1. Accordion
    2. Call to action
    3. Icon List
    4. Landing Page - Feature Widgets
    5. Landing Page - Featured Degrees
    6. Landing Page - Featured Rankings
    7. Large Call to Action button
    8. Specialty Grids
    9. Standard Grids
    10. Sub Landing Page - Feature Widgets Grid
  10. Sidebar Components
    1. Sidebar setup
    2. Call to action widget
    3. Events widget
    4. Facebook widget
    5. Feature widget
    6. Highlight widget
    7. LinkedIn widget
    8. News widget
    9. Twitter widget
  11. Logo
    1. Alternate Logo
    2. Restricted Logo
    3. Square Logo
  12. Metadata
    1. Degrees
    2. Disciplines
    3. Dublin Core
    4. Key Dates
    5. MOOCs
    6. Settings
    7. USP
  13. Resources
    1. CSS
    2. Fonts
    3. Images
    4. Javascript
    5. Unicorn library
    6. XSL Templates
  14. Data Sources
    1. CSV
    2. DB
    3. JSON
    4. REST
    5. XML
  15. Parse Files
    1. Blank 2016
    2. Freeform 2016
    3. UON 2016
  16. Developer Guidelines
    1. Asset Setup
    2. Code Templates
    3. Naming Conventions
    4. Regex
  17. Identity Guidelines
    1. Introduction
    2. Brand
    3. Basics
    4. Colour
    5. Typography
    6. Creative
    7. Imagery
    8. Extras
    9. Examples

New web

Web pattern library, style and technical reference

Sidebar Components

Facebook widget

A Facebook widget can be used in your sidebar to display the posts from a specific public Facebook page, the posts can be display as a test-only list, or in a carousel that will also display any relevant images attached to the displayed posts.

Facebook - Page Timeline

Facebook timeline widget

Asset setup

Asset type Standard page (with nested content)
Nested content asset #237973

Available variables

Variable Name Type Example Default
facebook_page required text TheUniversityofNewcastleAustralia - none -
Can be found by looking at the end of your page URL,
eg. http://www.facebook.com/TheUniversityofNewcastleAustralia
Alternatively, you can use a numeric Facebook ID which all people, pages and groups have, you can find ou the correct numeric ID here.
facebook_count optional number (1-10) 5 3
number of statuses to display in list/carousel
facebook_title optional text UON on Facebook - none -
defaults to name of facebook page eg. "The University of Newcastle, Australia"
facebook_carousel optional booloean false
setting to true switches widgets from list to carousel, including images

Technical info

REST Resource #237973 - Facebook - Page Timeline
Feeds https://graph.facebook.com/v2.9/%globals_get_facebook_page%/posts?fields=id,message,link,icon,picture,object_id,created_time,comments.limit(0).summary(true),likes.limit(0).summary(true),shares&limit=20&access_token=136340366440546|a789e5bf66d890eaa8b04c3f7ef5548f
https://graph.facebook.com/v2.9/%globals_get_facebook_page%/?fields=name,username,fan_count&access_token=136340366440546|a789e5bf66d890eaa8b04c3f7ef5548f

Facebook - Page Timeline - Carousel

Facebook carousel widget

Asset setup

Asset type Standard page (with nested content)
Nested content asset #237973

Available variables

Variable Name Type Example Default
facebook_page required text TheUniversityofNewcastleAustralia - none -
Can be found by looking at the end of your page URL,
eg. http://www.facebook.com/TheUniversityofNewcastleAustralia
Alternatively, you can use a numeric Facebook ID which all people, pages and groups have, you can find ou the correct numeric ID here.
facebook_count optional number (1-10) 5 3
number of statuses to display in list/carousel
facebook_title optional text UON on Facebook - none -
defaults to name of facebook page eg. "The University of Newcastle, Australia"
facebook_carousel optional booloean false
setting to true switches widgets from list to carousel, including images

Technical info

REST Resource #237973 - Facebook - Page Timeline
Feeds https://graph.facebook.com/v2.9/%globals_get_facebook_page%/posts?fields=id,message,link,icon,picture,object_id,created_time,comments.limit(0).summary(true),likes.limit(0).summary(true),shares&limit=20&access_token=136340366440546|a789e5bf66d890eaa8b04c3f7ef5548f
https://graph.facebook.com/v2.9/%globals_get_facebook_page%/?fields=name,username,fan_count&access_token=136340366440546|a789e5bf66d890eaa8b04c3f7ef5548f

Last updated
07 September 2018 @ 14:06 — Dean Robinson