Skip to main content
All CollectionsFAQsWebsite
How do I embed a Twitter widget?
How do I embed a Twitter widget?
Jamie Lubiner avatar
Written by Jamie Lubiner
Updated over 4 years ago

If you want to embed information from Twitter on your event website, you can do by following the below steps.

Step 1: Create JavaScript file

Using the code below, create a JavaScript (.js) file.

var loadedTwitter = false;function loadTwitterIfDivPresent() {  if (!loadedTwitter) {    if ( ($('.twitter-timeline').length > 0) || ($('.twitter-grid').length > 0) || ($('.twitter-tweet').length > 0) || ($('.twitter-share-button').length > 0) || ($('.twitter-follow-button').length > 0) || ($('.twitter-mention-button').length > 0) || ($('.twitter-hashtag-button').length > 0) || ($('.twitter-dm-button').length > 0) ) {      window.twttr = (function(d, s, id) {        var js, fjs = d.getElementsByTagName(s)[0],          t = window.twttr || {};        if (d.getElementById(id)) return t;        js = d.createElement(s);        js.id = id;        js.src = "https://platform.twitter.com/widgets.js";        fjs.parentNode.insertBefore(js, fjs);        t._e = [];        t.ready = function(f) {          t._e.push(f);        };        return t;      }(document, "script", "twitter-wjs"));      loadedTwitter = true;    }  }}setInterval(loadTwitterIfDivPresent, 1000); 

Step 2: Upload file to Site Settings

On the Website tab, click the Site Settings menu item. Click the "Scripts" tab to upload your file. This file needs to be uploaded in the Custom Head JS section. Click to upload your file and save your edits.

Note: If there is code present in the Custom Head JS field already, ensure that it is included in your new file as well. If you have an existing file you can add above code to that file.

Step 3: Get your Twitter embed code

Easily generate the embed code you want by visiting Twitter Publish. On this page you are able to select what you would like to embed, with options such as a Tweet, a hashtag, or a list.

Step 4: Clean the code

The code you receive will look similar to the one that is below. The first section of this code is specific to the type of embed that you selected in the previous step. There is a second part of the code, between the <script> and </script> tags the are generic to all types.

The second part of the code, between (and including) the <script> tags should be deleted.

Step 5: Add the code to your event website

Wherever you want your Twitter content to appear, add a Raw Code block. Remove the placeholder code and add the first part of the code that you got in the above steps. As an example, using the above code, I would add the following into a Raw Code block:

Note: It is important that the <script> section must be removed for the code to properly be embedded.

Step 6: Save

Save your work and remember for it to be reflected on your event website you must republish the event page.

Did this answer your question?