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.
Step 1: Get Your Twitter Timeline Embed Code
- Go to Twitter Publishing tools.
- 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
- 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:
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):
Click Edit Web Part
Click Edit Snippet
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 :)
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