Instagram Embedded Feed

  • Display an embedded Instagram feed on your website using the Instagram smartform. You’ll need to have log-in access to the account you wish to feature. This embed will display the 12 most recent posts to the account.

    Contact the Web Team to request this smartform be enabled in your folder. Please submit an ihelp ticket and include the smartform needed (Instagram Feed) and the content folder you would like it enabled in. This will generally be your homepage, but it can be added to any regular CMS page (not news or events).

  • Instagram Account-Specific Information You Will Need

    User ID

    To find your Instagram user id, visit this site and follow the directions provided. Copy the ID and save it, as you will need it when setting up the smartform.

    Access Token

    Visit the PixelUnion site.

    Click the Generate Access Token button. This will take you to a login page for Instagram. Continue with the login, and you should be prompted to authorize access for Pixel Union.

    You should be returned to the same page you started on, and the access token will be displayed. Copy this access token and save it, as you’ll need it when setting up the smartform.

    Set up the Smartform

    Once the smartform has been enabled in your CMS folder, go to the folder and create a New > Smartform > Instagram Feed.

    All fields are required.

    *Note once you have the smartform set up, you'll still need to place it into your page layout.

    Layout Options

    When selecting the layout, consider where you will place the Instagram feed. You can choose full-width or less-than-full-width layout options. All three layout options will go to the 2x6 layout at the main breakpoint.

    2x6 Full-Width

    Will display two rows with six images across, and will be edge-to-edge (no gutters).

    Place into a full-width column in your page layout.

    screenshot of the 2x6 instagram embed option

    1x12 Full-Width

    Will display one row with 12 images across, and will be edge-to-edge (no gutters).

    Place into a full-width column in your page layout.

    screenshot of the 1x12 instagram embed option

    3x4 Less-Than-Full-Width

    Will display three rows with four images across, and will have gutters on either side. (The Instagram feed embedded on this page is the 3x4 layout.)

    Place into a half-width (six column units) column in your page layout. You can also use a minimum of four column units and max of 8 column units wide column in your page layout.

    screenshot of the 3x4 instagram embed option

    Place the Smartform Content into the Page Layout

    You'll place this content into a page layout using the IUP Content Widget. The layout option (from above) will determine the width of the column you place the content into.

    Note that when you place this content into the page, you may not see the actual images until the page is checked in or submitted, and then refreshed. You can always place the content, and use the Preview Mode to verify it is working that way.