Social Media Technical Guide

Overview

The Social Media plugin will allow you to consolidate your social resources into an easy to maintain section on your page. If you have a Twitter account, Facebook account, or YouTube account that pertains to your site, this plugin will allow for easy access to them.  This plugin will require that you have an account with one or more of the supported social networks.  Primarily we support Facebook, Twitter, and YouTube widgets, but we have linked icon support for many additional networks.

Facebook Block Section

In order to display a Facebook Widget on your page, you’ll need to provide some basic information such as the Name and URL of your Facebook page.  Your choices in the Advanced Options section will help you customize the visual appearance of the widget. By using the "+" button in the top left corner of this section, you can easily add multiple Facebook sections. 

  • Facebook Page Name: This field will hold the name of your Facebook page.
  • Page URL: This field will hold the URL link to your Facebook page.
  • Display Facebook Widget: This option will allow you to display the Facebook widget on your site. By default it is set to Yes to show the widget.

Facebook>>Advanced Options

There are several options available to help you better customize the layout and appearance of your Facebook Widget.

  • Layout Style:   This option controls the layout of the Facebook Widget, chosen from a list of prepared formats.
    • Standard: This option will show a standard display for Facebook, with a “Like” button and the number of people who have liked the page.  If you have selected the “Show Faces” option, a user will also see a list of their Facebook friends who have also liked the page.  However, the user must be logged in to Facebook for this information to be displayed.
    • Button with Count: This option will show the Like button along with the count of likes your page has acquired to the right of the button. 
    • Box with Count: This option will show the Like button with the count of likes your page has acquired above the main button. 
    • Linked Icon: An option that will show a simple icon with the link to your Facebook page.  You can control the size of the icon under the Advanced Options section.
    • Text Only: This final option will display Find *Facebook Name* on Facebook in text and will also link to your Facebook Page.
  • Show Faces: If set the “Yes”, a user will be shown the profile images of their friends who have also liked the page.  This setting only affects the widget when the Layout Style is set to Standard.

Twitter Block Section

This section of the block will be where you can add your Twitter account. The available Advanced Options will determine how this widget will be displayed.  By using the "+" button in the top left corner of this section, you can easily add multiple Twitter sections. 

  • Twitter Page Name: This field will hold the name of your Twitter feed.
  • Twitter Username: In this field you will type your username to your account starting with the @ symbol. An example for this would be @johndoe for the username.
  • Page URL: This field will hold the URL link to your Twitter feed.
  • Display Twitter Widget: This option will allow you to decide if you wish to display the Twitter widget. By default it is set to Yes.

Twitter>>Advanced Options

There are several options available to help you better customize the layout and appearance of your Twitter Widget.

  • Layout Style: For the Twitter widget, the Layout Style will give you a choice between one of four options.
    • Follow Button: This option will generate standard Twitter “Follow” button linked to your Twitter account. Through the Follow Button Options, you can choose to also display your @username on the button as well as the number of people currently following you on Twitter.
    • Timeline:  You can choose to show an Embedded Timeline of your tweets and interactions using the Twitter Timeline widget. This option has added requirements necessary for it to function.  Please see the Advanced Options > Embedded Timeline section. 
    • Linked Icon:  An option that will show a simple icon with the link to your Twitter account.  You can control the size of the icon under the Advanced Options section.
    • Text Only:  This final option will display Follow * Twitter Page Name* on Twitter and will also link to your Twitter page.

Twitter>>Advanced Options>>Follow Button Options

If you selected “Follow Button” under the Layout Style options, you can control the layout and appearance of that button here.

  • Show Username: By default this option is set to “Yes”and it will show your @username on the Follow Button. 
  • Show Followers Count: The default setting is “Yes” for this option, and to the right of the Follow Button the widget will display how many people are currently following your account on Twitter.
  • Button Size: An option that will manipulate the size of the Follow Button. You can choose between “Medium” and “Large for the button size. The default for this setting is “Medium”.

Twitter>>Advanced Options>>Embedded Timeline Options

Creating a Twitter Timeline widget will require you to copy and paste code generated within your Twitter account.  You must select “Timeline” in the Layout Style options in order for this to take effect.

This option requires a bit more setup as follows:

First, you will need to login to you Twitter account.  The next step is to create a widget; this can be achieved by going to your Twitter Settings option. Towards the bottom of the settings list in the left-hand navigation, you’ll find the Widget option. After selecting this option click on the Create New button.  In the Configuration, type in your information and press the blue Create widget button. This will generate a code block that you will then copy and paste into the Twitter>>Advanced Options>>Embedded Timeline Options text area.

  • Embedded Timeline: In this section you will paste the code block you attained from creating a Twitter widget through your Twitter account
If you experience an "Attribute name 'async' associated with an element type 'script' must be followed by the '=' character" error, then please contact us at webhelp@mso.umt.edu or call us at (406) 243-4361 and we will fix this for you.

YouTube Block Section

This section of the block will be where you can add your YouTube account. The available Advanced Options will determine how this widget will be displayed.  By using the "+" button in the top left corner of this section, you can easily add multiple Youtube sections. 

  • YouTube Page Name: This field will hold the name of your YouTube Page.
  • Channel Name: This field will hold the name of your YouTube Channel.
  • Page URL: This field will hold the URL link to your YouTube channel.
  • Display YouTube Widget: This option will allow you to decide if you wish to display the YouTube widget. By default it is set to Yes.

YouTube>>Advanced Options

In this section there are several options available for you to control how the YouTube widget will be displayed.

  • Layout Style: For the YouTube widget the Layout Style will give you a choice between one of four options.
    • Subscribe Button: This is the default option. This option will generate a “Subscribe” button for your YouTube account with a count of how many people are currently subscribed to your Channel.
    • Subscribe Button-With Avatar: This option will generate a “Subscribe” button also with the number of subscribers to your channel. However this option will display your YouTube avatar image to the left of the “Subscribe” button.
    • Linked Icon: This option will generate a simple icon with the link to your YouTube Channel. You can control the size of the icon under the Advanced Options section.
    • Text Only: This final option will display Subscribe to * YouTube Page Name* on YouTube in text and will also link to your YouTube Channel.

Other Networks

We have added support for linking to other networks besides those listed above.  Supported networks as of April 24, 2017 include: Flickr, Instagram, Pinterest, LinkedIn, Wordpress, SnapChat and Google+.  By using the "+" button in the top left corner of this section, you can easily add multiple network icons.

  • Display Name:  Provide the name of your network page or blog.
  • Page URL: This field will hold the URL link that users will visit upon clicking the icon.
  • Network Type: This option will generate the appropriate icon for the selected network with the link to your page. You can control the size of the icon under the Advanced Options section.
  • Display Network: This option will allow you to decide if you wish to display the icon. By default it is set to Yes.

Advanced Options Section

This final section will allow you to customize how your Social Media Integration will display as a whole.

  • Display Inline: By default this option is set to Yes. The default will allow for the social icons to be displayed one after the other in a horizontal fashion from the left to the right. When selecting No, the social icons will be displayed vertically with the first social icon you have displayed first and so on.
  • Color Scheme: An option that will allow you to have your social icons displayed with a color theme. By default this is set to Light.  Dark is intended for use against dark backgrounds.
  • Linked Icon Size: When choosing the Linked Icon option for any of the social widgets above, you will be able to choose from three icon sizes. By default this option will have the Linked Icon set to Medium.
  • Display Other Networks on New Row: By default this option is set to No.  The default will allow for the icons to be displayed on the same line as your Facebook, Twitter, and YouTube widgets.  Depending on the formatting decisions for these widgets, you may toggle this to Yes to display Other Networks in a separate row below the Facebook, Twitter and YouTube sections.