Embedded Tweets as Questions

, , ,
1

Hi! I'm working on stance classification of tweets. I was wondering if there was a way to use Twitter's embedded tweets with the HTML interface. I was able to have the first question load as an embedded tweet by adding <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> to static/index.html. However, the script only loads once and won't rerun for the next question. I looked into using a custom script but I'm unsure how to apply it to my situation.
Here's a sample input:
[{"id": "773678512867639297", "fulltext": "Is someone murdering Ferguson protestors??? http://www.nytimes.com/2016/09/07/us/ferguson-protest-leader-darren-seals-found-dead-in-vehicle.html?_r=0", "html": "<blockquote class=\"twitter-tweet\"><p lang=\"en\" dir=\"ltr\">Is someone murdering Ferguson protestors??? <a href=\"https://t.co/t1rbx86cAp\">https://t.co/t1rbx86cAp</a></p>&mdash; Ikai Lan \ud83d\ude10 (@ikai) <a href=\"https://twitter.com/ikai/status/773678512867639297?ref_src=twsrc%5Etfw\">September 8, 2016</a></blockquote>\n<script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n"}, {"id": "1269854206271221760", "fulltext": "Whoa. Othello Park right now. South Seattle standing together for Black lives and to end violence! #blacklivesmatter (link_to_media_content)", "html": "<blockquote class=\"twitter-tweet\"><p lang=\"en\" dir=\"ltr\">Whoa. Othello Park right now. South Seattle standing together for Black lives and to end violence! <a href=\"https://twitter.com/hashtag/blacklivesmatter?src=hash&amp;ref_src=twsrc%5Etfw\">#blacklivesmatter</a> <a href=\"https://t.co/PSKYz189dv\">pic.twitter.com/PSKYz189dv</a></p>&mdash; Girmay Zahilay (@GirmayZahilay) <a href=\"https://twitter.com/GirmayZahilay/status/1269763149177032705?ref_src=twsrc%5Etfw\">June 7, 2020</a></blockquote>\n<script async src=\"https://platform.twitter.com/widgets.js\" charset=\"utf-8\"></script>\n"}]

If you could provide any insight in how to run the script for all questions, it would be a great help.

Thanks in advance!

2

Hi! The way Twitter's embed script works is that once it's loaded, it will scan the page for Twitter blockquote markup and then load the widgets. If the content of the page changes dynamically, the Twitter embed won't know, so it won't render new embeds.

One feature of the widget that's apparently not really documented (?) is that it exposes itself globally as twttr. So you can manually call its methods to make it reload any widgets on the page. The prodigyupdate event is fired whenever the current task is updated, including when a new task is loaded. So you could do the following to reload Twitter widget embeds on every update:

document.addEventListener('prodigyupdate', event => {
    twttr.widgets.load()
})

Alternatively, you could also use a tool like this that allows embedding tweets via an iframe. This should work out-of-the-box with no scripts needed:

https://twitframe.com

1 Like
3

Twitframe works great, thanks for the quick reply!

1 Like