Twitter profile pictures

Overview

Whether you use Twitter for signing in users to your site or you simply integrate with Twitter profiles in your Web application, you probably need to display Twitter profile pictures in your site.

Twitter provides access to the profile pictures of users as part of their API. They provide the pictures in multiple dimensions, but they don’t necessarily match the requirements of your Web site design.

Cloudinary allows you to easily display Twitter profile pictures as part of your web application. You can display them in any dimension or aspect ratio you need, Cloudinary resizes or crops the pictures for you and deliver the images through a high performance CDN. Images are also automatically refreshed when users change their profile pictures.

Note: Cloudinary supports profile picture fetching also for other social networks, such as Facebook, Google+, Instagram and Gravatar.

Viewing profile pictures

To integrate a profile picture in you web site, you simply point to a URL that contains the unique Twitter User ID or Twitter Screen Name of the user.

For example, if your Cloudinary cloud name is ‘demo’, the following URL will display the profile picture of Bill Clinton:

https://res.cloudinary.com/demo/image/twitter_name/w_100/billclinton.jpg

100x100 JPG

You can also display the same profile picture using the numeric ID of this Twitter profile:

https://res.cloudinary.com/demo/image/twitter/w_100/18913373.jpg

100x100 JPG

Here’s an example that adds an image HTML tag using our Ruby on Rails library:

twitter_name_profile_image_tag("billclinton.jpg")

Or when using Twitter User ID:

twitter_profile_image_tag("18913373.jpg")

When a user accesses such a URL for the first time, Cloudinary downloads the appropriate profile picture from Twitter, stores it locally in a high performance storage solution, and distributes it through a CDN. The next users to access it will receive the image quickly through the CDN while using smart cache settings.

Picture transformation

You can create transformed versions of users’ profile pictures using your required image format and dimensions. Twitter provides profile pictures in different resolutions. Cloudinary smartly decides which resolution to use as a baseline for generating the image you need.

For displaying Twitter profile pictures in your desired format and dimensions, simply pass transformation instructions as part of the URL.

For example, if the graphic design of your web site requires profile pictures in JPG of 80x120:

https://res.cloudinary.com/demo/image/twitter_name/w_80,h_120,c_fill/billclinton.jpg

80x120 JPG

When using our Ruby on Rails library, you can do the following:

twitter_name_profile_image_tag("billclinton.jpg", :width => 80, :height => 120, 
                               :crop => :fill)

See Image transformations for more details about the possible transformation options and the supported crop modes.

Automatic refresh

By default, Cloudinary checks one time after 7 days to see whether a fetched Twitter picture has changed (by comparing the etag value). If it has changed, the cached image is replaced with the new one, and the next time that image, or a transformation of that image, is requested, the updated version is delivered. Cloudinary customers with a paid account can request to change this default from a single 7-day refresh to any desired repeating interval by submitting a support request.