Skip to main content
OCLC Support

Twitter Follow button

  1. Last updated
  2. Save as PDF

 Link:  See a live example.

 View:  View source code in CONTENTdm Cookbook Demo Site.

At the 2019 CONTENTdm User Group at the Indianapolis Public Library, OCLC held a workshop covering the CONTENTdm JavaScript event lifecycle and how to manage the timing of customization recipes within the lifecycle. The example recipe used to demonstrate these concepts added the official Twitter Follow button to your website. This recipe uses the approach that is recommended in Twitter’s official documentation, Follow Button, which means that it first loads an external JavaScript module from Twitter. This official method supported by Twitter also requires that you agree to their usage policy found on the Twitter for Websites Overview page.

This recipe uses JavaScript to load the Twitter for Websites JavaScript file and inserts the button HTML into every page of CONTENTdm in the page footer. This recipe can be altered to insert the Twitter button at a different location in your CONTENTdm website.

The Twitter for Website JavaScript widget gives you several options for how the button appears. This recipe is configured to display the Twitter screen name, to hide the follower count, and to show the large version of the button. These options can be changed by modifying the various true vs. false settings found in this line of the recipe’s .js file:

linkContainer.innerHTML = '<a href="https://twitter.com/' + screenName + ' " class="twitter-follow-button" data-show-count="false" data-show-screen-name="true" data-size="large">Follow OCLC</a>';

For example, if you wanted to show your follower count and use the small version of the button you would change the above line from your copy of the .js file to:

linkContainer.innerHTML = '<a href="https://twitter.com/' + screenName + ' " class="twitter-follow-button" data-show-count="true" data-show-screen-name="true">Follow OCLC</a>';