With over 170 billion tweets cataloged by the Library of Congress, there’s no shortage of short, pithy snippets of text available for use in your blog posts. All text and no visuals, however, can be the kiss of death for your blog post. How can you use the quotations you want without sacrificing the power of images? Two words: screen capture.
Screen captured images can be set up so that when clicked, the reader is directed to a custom URL of your choice. This method solves several problems in one fell swoop, including the biggie: attribution. Although it’s also good practice to include a brief mention of the originator of the quote, a direct link to their Tweets suffices beautifully.
In this tutorial, we’ll go through to process of inserting a clickable image into a WordPress blog post from finding the Tweet to the final, nitpicky details.
1. Find the Tweet you want to use. Storify users have an advantage over non-Storify users as the search function makes it easy to find and collect a series of web elements. The search function on Twitter also works well. When looking at an individual element in Storify, notice that there are several small, grayed-out links on the bottom.
The date link–in this example, “6 days ago”–points to the permanent status update on Twitter. Click on the link to go to the permanent link for the individual Twitter update (the “permalink”).
2. Capture your image. How you capture each image is highly dependent on your system. I use Grab, a program that is native to Apple computers. Many PCs have the Snipping Tool. Linux-users have a variety of tools such as Wink, Shutter, and Greenshot.
3. Convert your image to an acceptable format. Once you capture your image, check to make sure that it’s in a format that your blogging platform accepts. WordPress accepts .jpg, .jpeg, .gif, and .png images. If you need to convert your image–Grab users will have to convert from .tiff–open your photo editing software and do so. Once you have your selected Tweet in an acceptable form, it’s time to insert it into your post.
4. Insert your image. In the upper left corner of the text input area, there is a button labeled “Add Media.”
When clicked, an Insert Media shadowbox opens up. In the upper left corner, there is a link “Upload Media.”
From there, click on the “Select Files” button.
When “Select Files” is clicked, a file box should open up. Find your file, select, and click “open.” Depending on your computer and your software, this may read “open.”
4.5. Add identifying details. There are Attachment Details on located the right side of the screen: Title, Caption, Alt Text, and Description. The only field that should be left blank is “caption;” a caption interrupts the visual flow of the post. The title field has the title of the image, such as “Screen Capture Tutorial, Step 1, Wordsmith Studio.”
Information in the Alt Text field will display if, for some reason, the image isn’t rendering on screen. Even if the image appears, the text in the Alt Text field is still used for SEO.
EXAMPLE: <img alt=”Screen Capture Tutorial for Hawaii Content Marketing, Step 6″ src=”http://latesprouts.files.wordpress.com/2013/02/screencap6.png” width=”470″ />
Bottom line: the text in the Atl Text field is important. Use this field!
Underneath the Attachment Details fields are the Attachment Display Settings: Alignment, Link to, and Size. When using screen captures of Tweets, use the Link to field to point to the permalink of the Tweet by selecting “Custom URL” from the dropdown menu and inserting the URL in the field underneath.
Click “Insert into post” et voila! You have successfully inserted a screen captured Tweet into a story.