Twitter Feed Blocks

Adding a Twitter feed to your webpage allows your organization or department's tweets made on your Twitter account to show on your Web Press site. Follow the instructions below to add a Twitter Timeline to your website. Note: You will need your Twitter Username and Twitter Widget ID to complete these steps.

Preview

Below is a sample of how the Twitter Feed Block would render on your Web page. The feed scales to fill the column width.

Best practices

  • Only use when your Twitter handle is active.

  • Strive to use one social feed per Web page. Choose the feed that is most active or applicable.

  • Use as supplemental content on a Web page. Use rich text blocks to provide primary content.

  • Use within a 50% or 66% column width to accommodate feed images and other wide content.

Add a Twitter Feed Block

  1. Click the dot for Open Row.
    New dot options appear.
  2. Click the dot for Edit column contents.
    The Edit Link Element window opens.
  3. On the Edit Link Element page, click Create and Connect Page.
    The Content Class Groups window opens.
  4. On the top portion of the screen, click the Feeds group.
  5. Click Twitter Feed Block.
  6. Enter a Headline for the page.
    This headline will not be visible on the live site.
  7. Open the Twitter Timeline page if it is not already open.
  8. Click the dot for Edit Twitter feed properties.
    The Edit Elements via Form window pops up.
  9. Enter your Twitter Username and Twitter Widget ID.
    See the section below for finding your Twitter Username and Widget Id.
  10. Height is optional, if left blank 300px is used.
  11. Click Ok

Finding your Twitter Username and Widget ID

  1. Log into Twitter and go to https://twitter.com/settings/widgets
  2. Click the Create new button in the top right.
    If you already have a timeline set up, click Edit next to the timeline you'd like to use.
  3. Your Twitter Username will be listed at the top of the form following the @.
  4. Insert *.missouristate.edu in the Domains section. Click Create.
    A code box will appear below the sample timeline on the right.
  5. Your Widget ID is the number listed after data-widget-id= in the code box on the bottom right of the page.
    Example:
    Twitter Widget Id