Embed Tinypic Images in WordPress with Shortcode

Tinypic is a photo and video sharing service, owned and operated by Photobucket that allows users to upload, link and share, images and videos. The website is to images what Tinyurl, Shor.tt and others are to truncated URLs. One of the biggest criticisms of Tinypic is that images (and videos) get deleted quite quickly after they’re posted… often in just a few days. The quick deletion is the reason we’ve chosen Tinypic for this particular shortcode.

Image Shortcodes and Timthumb

Despite having vowed to steer away from Timthumb usage a few months back, we’ve implemented it at least a few times since simply because it’s easy to use. In looking for timthumb alternatives, however, and finding nothing useful, we’ve had to apply our focus back onto native WordPress functions. We now upload all remote images to your local uploads directory before. Tinypic was a good test platform given the kicking and screaming we’ve read from users of the service; they’ll often embed Tinypic images into their websites and forums only to have the image permanently deleted days later. By migrating the image to your local WordPress installation we obviously avoid the image-rot that invariably occurs when relying on third-party websites.

We’ve scheduled a post that details the method of image migration and usage.

It should be noted that this shortcode only applies to images – not video (yet).

The Result

Consider the image located here . To include it into your WordPress website, use [tinypic i="http://tinypic.com/view.php?pic=23t5u7m&s=5&hid=0&tag=girls"]. The result:

By default the image will center without any formatting and without a link.

To display this image with a width of 400 pixels, a title, a caption, and a link back to our Flight website, I’ll use [tinypic i="http://tinypic.com/view.php?pic=2copldt&s=8&hid=0" title="Girl in Bikini" Caption="A girly in a bikini looking confused" link="1" url="http://www.flight.org/" width="400"]

A girly in a bikini looking confused

You can optionally align left and right, and the image will inherit standard WordPress image styling.

The Shortcode Function

Copy and paste the WordPress function into your theme's functions.php file or, if you sensibly have one installed, your custom functions plugin.

If you require shortcode to work in a sidebar widget, you'll have to enable the functionality with a filter. If you're using our custom functions plugin, you'll have that feature enabled by default.

Shortcode Attributes

i

The i is the full image URL.

alt | title

The alt and title tags aren’t any different to the alt and title tags you use on any other image. They are both optional.

link

If you would like the image to link to the original version of itself, use link="1". Default is false.

url

If you would like the image to link to a URL rather than the original version of itself, use url="http://www.flight.org/" (substituting for another address, of course). If you define a URL, you don’t have to use link="1" – it’s assumed.

width

The width is the width of the image. Consider the width of the original image when sizing.

caption

A caption will be formatted like any other caption on your website. It will inherit your default design.

align

Align can be align="left", align="right", or align="center".

Considerations

WordPress only makes a single request to Tinypic for your image. Once done it will upload the image to your WP uploads directory and record image details to your WordPress database. The image is now accessible in your media library like any other. This will be the standard way in which we copy images for our image functions in the future (and we may rewrite some of the shortcodes we provided in the past).

Consider the copyright that may apply before copying images.

Download the Code

Download the shortcode function here .

Shortt URL for this post:

Leave a Reply

Your email address will not be published. Required fields are marked *