Register to attend Frog's Release Showcase... Register Now
John Elliott from Ashington High School shared this tutorial for embedding multiple Twitter feeds across FrogLearn.
The issue
For some reason, the embed code Twitter supplies will only work on the first embed on a page, and because you have one on a dashboard, any site that opens within FrogLearn will not be able to display a Twitter feed. Also, if you have a site/page open in FrogLearn that has a Twitter feed on and open another site/page with a Twitter feed on (before closing the first one) only the first Twitter feed will display correctly.
Through a little trial and error, you need to follow these directions:
Step 1
On dashboards (staff, student, etc) place this code into an HTML widget at the bottom of the page:
<script type="text/javascript">
if (typeof twttr ==="undefined") {
// <![CDATA[
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
// ]]>
}
</script>
It is much preferred to place that HTML code on only one dashboard, if there is a single dashboard that all users can see (e.g. a school dashboard.)
It doesn't matter if it is the user's default dashboard or not, as long as it is in one of the pips at the top. If you don't have a shared dashboard, it should still work without issue if you place it in more than one.
Step 2
First, get your normal embed widget code from Twitter. All you will need is the first line that looks similar to this:
<a class="twitter-timeline" data-height="400" data-dnt="true" href="https://twitter.com/User" data-widget-id="664381433750888448">Tweets by @User</a>
Delete the second line of the embed code and put this in its place*:
<script>if (typeof twttr != "undefined") twttr.widgets.load();</script>
Using above instructions, the widget html should look like this, with your own <a> tag in:
<a class="twitter-timeline" data-height="400" data-dnt="true" href="https://twitter.com/User" data-widget-id="664381433750888448">Tweets by @User</a> <script>if (typeof twttr != "undefined") twttr.widgets.load();</script>
Finally
You need to change all of your Twitter feed HTML widgets to this format for it to work correctly.
Tutorials in this series...
