Both Facebook and Twitter offer simple ways to generate the code needed to display your timeline on your site. 

• Facebook Developers - Page Plugin: developers.facebook.com/docs/plugins/page-plugin/
• Twitter Developers - Enter a Twitter URL: publish.twitter.com/

These are visible throughout your site when added to the sidebar content. Check out the documentation on 3rd party embed code for more info on editing your sidebar content: How to Embed 3rd Party Code. 

Have your Facebook and Twitter URLs copied and ready to paste. Visit your public social media pages to find your Facebook and Twitter URLs. For example, LWVUS' social media URLs are:

• Faccebook: facebook.com/leagueofwomenvoters/
• Twitter: twitter.com/LWV

For each social media site, they provide their own set of instructions, which we've outlined here.

When working with HTML embed code within your MyLO site, it's important to remember to use the Full HTML text editor instead of WYSIWYG. This will ensure your widgets appear properly.

Steps to Embed Facebook Timeline

1. Visit the Page Plugin.
2. Enter your League’s Facebook Page URL in that field (replace the default value pictured). 
3. OPTIONAL: Select your preferences, for example, Tabs, Width, and Height of the output display. The Page Plugin, by default, will adapt to the width of the device being used to view the site (i.e. phone, desktop).
4. Click Get Code. 
5. Copy the code from the pop-up window. 
6. In a new tab, travel to your MyLO site and make your way to the page you want to add this code to and start a new draft or edit the existing one (i.e. to display in the sidebar, edit your homepage).
7. Paste the code into your sidebar, or anywhere else on your website, making sure to set the text editor to Full HTML. Be sure you've copied/pasted all parts of the code (if there are two chunks of code, copy/paste both) into the same place. 
8. Save your changes.

These instructions were adapted from TeamUnify Support Docs.

Steps to Embed Twitter Timeline

1. Go to https://publish.twitter.com/.
2. Enter the URL of the timeline or Moment you’d like to embed.
3. Choose your display option (Embedded Timeline displays your entire scrollable timeline).
4. Customize the design by specifying the width, height (we recommend 1000 to prevent a very widget), and theme (light or dark) to match your website. 
5. Click Copy Code to automatically copy the code to your clipboard.
6. Travel to your MyLO site and make your way to the section where you want to display this widget and start a new (or edit) draft (i.e. to display above your Calendar, edit your League's Headers).
7. Paste the code into your website wherever you would like the timeline to appear (i.e. sidebar content), making sure to set the text editor to Full HTML.
8. Save your changes.

These instructions were adapted from Help.Twitter.com. 

Tips and Troubleshooting

• Adding these widgets to your sidebar makes them visible throughout your entire site. To reach your sidebar content, start a new (or edit the existing) draft of your homepage.
• Your widget(s) may be off-center; you can fix this by centering your code. When adding embed code to the sidebar, center the widget by adding in <center> tags. At the start of the embed code type <center> and after it type </center> so the entire embed code is enclosed within these <center> tags.
• If your widget won't display, be sure the text editor (found under the textbox) is set to Full HTML:
• If the text editor is set to WYSIWYG, the widget will display on the editing form, but won't display on the content after saving.
• If your widget won't display, try publishing your latest changes. This will especially work if you've added the code to your sidebar and don't see it yet on your front page.

Examples of Each Embedded Timeline