NOTE: This support article is outdated and deprecated. ShortPoint has created a Twitter Design Element, which you can use to embed Twitter on your SharePoint pages. Check out Introducing ShortPoint Twitter Design Element to learn more about it.

Issue

Embedding Twitter timeline into SharePoint's Script Editor Web Parts using an auto generated code from Twitter APIs may not always work, as your Script Editor Web Part might get broken if you edit the page for multiple times.

Solution

A workaround solution to make the Twitter timeline work always is by loading Twitter javascript file dynamically instead of embedding the script tag using HTML. The following steps explain the solution in details:

Step 1: Get Your Twitter Timeline Embed Code

1. Go to Twitter Publishing tools.
2. Type the Twitter timeline you would like to embed. For example, this is the embed code for our Twitter timeline: https://twitter.com/shortpoint_tw
3. Then click on Copy code.

Watch this recording: https://cl.ly/kqyR

You can find details on how to create embed code for your Twitter timeline from here.

Step 2: Create New ShortPoint

Go to Site Settings > ShortPoint Dashboard > ShortPoint Generator

Type the name of the generated ShortPoint (e.g: Twitter)

In the rich text editor, switch to the code view and paste the Generated HTML from Twitter APIs excluding the script tag,
Your code will look similar to the following:

You can change the height using the data-height property:

Important: 

When you paste the Twitter HTML into the editor, make sure to remove the <script> tag, as we're going to load that JavaScript file in a different way next.

Now Save the Generated ShortPonit

Step 3: Add Twitter Script

Edit the page where you want to add the Twitter Timeline and add a Script Editor Web Part (anywhere in the page):

Note: 

It does not matter where you actually place the Script Editor Web Part, as it will be invisible to end users, and it's only required to load Twitter's javascript file dynamically.

Click Edit Web Part

Click Edit Snippet

On a new browser tab, open the link load-twitter.js (or load-twitter-in-tabs.js if you want to put the twitter inside tabs element) and copy the content of the Script File

Note: If you are planning to put the Twitter feed inside a Tabs element, then you need to copy the content of this script (load-twitter-in-tabs.js) instead

Now paste the copied content into the Embed dialog, and click Insert

Step 4: Insert the new Twitter ShortPoint

We're almost ready, the only thing that is left, is to place the new ShortPoint we just created in the place that we would like the Twitter Timeline to appear.

On the same page, Open the ShortPoint Insert Button 

Search for the Generated ShortPoint we created in Step 1 ( e.g: we named it here twitter ), and Click on it

Then Click Insert to add it to the page

Save the page, and you are done.

You can add your new ShortPoint into other ShortPoints as well, like Panel for example.

Soon, we will release Twitter ShortPoint that should make it much easier to add and control twitter timeline and also tweets.

Happy Twitter :)

FAQ

Q: Twitter feed does not render on IE, why?

A: Make sure that your master page targets the very latest document mode of IE, refer to the following article to know how to do that

• IE Compatibility on SharePoint and Office 365