, , ,

Using Flickr to embed images

They say a picture is worth a thousand words. It can help illustrate a point you’re trying to make, how you felt at a particular moment or provide something to look at while you’re giving a presentation. I mainly use images to break up the writing on my posts. Using images means that I’m taking up space on the server to use them on my blog. That space can fill up quickly when you have a limited amount of space on a server too.

But there is a way around this! You can use Flickr to easily embed your own images on your site without taking up a ton of space on my account. Flickr is a ‘freemium’ web service where you can upload up to 1TB of images for free. You can organize the photos into albums and even edit the photos.

I stumbled across this solution when I was quickly reaching my storage quota for my website during ds106. I needed a way to upload all the images I created and didn’t have enough room on my website. So I thought I would show you all how simple it is to embed the images in posts and pages.

Uploading Images:

Before you can put the images on your website, you’ll need to upload them to Flickr. From the Flickr homepage, click the cloud icon in the top right corner.

You can click ‘Choose Photos and Videos to Upload’ or click and drag the images directly onto the screen to upload the images.

Once the images render, you can change the name, add them to albums, and give the item’s tags to organize them. This is totally your preference. When you’re ready, click ‘Upload’ in the top right corner. You’ll confirm the upload as well.

Embedding the Images

Once you have the images on Flickr. Click the photo you’d like to put on your website. Then click the down arrow icon. Click ‘View all sizes.’

This will bring up a new screen where you can toggle between image sizes. Select the image size you’d like to embed, then right click and click ‘Copy Image Address.’

This will give us a direct link to the image, rather than the Flickr album/photostream. Navigate to the WordPress post/page you’re working on. Within the visual editor, paste the link to the image.

Flickr will automatically change the URL into an image. You can manipulate it like you would if it was uploaded directly to the site.


, , , , , ,

Reclaiming this Blog

Reclaiming this Blog

As I wrap up the 2012 year and celebrate 2 full years of blogging I've begun the process of taking a harder look at what I post here and where I put my media. It's no doubt a popular topic of conversation in light of concerns people are having regularly with various services terms and agreements. A great post by Anil Dash titled The Web We Lost made the rounds on the internet recently and highlights this sentiment perfectly. As a culture we are putting more and more of our media in places where we don't have control or security. I've also closely followed the Project Reclaim work that was started by Boone Gorges and have always found the ways D'Arcy Norman locally hosts the media he creates on his blog inspiring. I have a few different motivations from those folks however so this post is the start of me outlining what my goals for this space are and how I plan to tackle them. Boone, and to some extent D'Arcy as well, have been motivated by philosophical arguments in favor of owning and controlling your data. A great example of this is Boone choosing whenever possible to use open source software including his operating system. A lot of the work I've seen D'Arcy do this past year has been to move away from commercial services like Flickr and YouTube in favor of having all of his media and work be published locally on his blog. My plan is a bit different in that I don't find the use of tools like Flickr, Facebook, YouTube, and Twitter to be inherently bad as long as* I always have a local copy of the data here on my blog*. In some cases I can use the benefits of aggregation to still post to the services I love and have them pull the data in here for perpetuity. In other cases it will mean locally publishing and then having that data feed out to the social networks I use for better community interaction there. Whether the activity around the work I create happens here on my blog or elsewhere is of no consequence to me. My utmost goal is that when these services inevitably get closed down I'm not sent into a panic, rather I already have everything here and can find a new service. I've started by giving this blog a much needed facelift. The previous theme was a modified version of the Skeleton template which was heavily focused on one single thing: the text I write. I rarely posted images with my posts and so I made sure the text was large and legible, that the blog as a whole was responsive, and that everything else got out of the way. I liked it, but if I'm to begin housing more photos, videos, and other work I create elsewhere I need to have things like a menu and a sidebar to contain some of it. I've switched up to the Yoko theme which I find pretty elegant and as a bonus it remains a responsive design. For full width browsers you'll get the benefit of 2 sidebars where the "extra stuff" will be. For smaller widths like mobile devices that information will drop below the posts which remain the primary focus. The next area I've begun to tackle which is still a work in progress is the act of posting photos to Twitter. In the past I typically defaulted to TwitPic for this (I also occasionally used the built-in photo functionality of Twitter when they released that, but always liked that TwitPic had full-size images). Earlier this year I briefly played around with a plugin called Tweet Images that allows you to setup the necessary API endpoint to create a new Image Post when a photo is added to Twitter using Twitter clients that support the feature. I use Tweetbot on both of my iOS devices and Twitter for Mac on my laptop. Tweetbot supports this and after installing the plugin I'm given a URL that I can put in as a "custom URL" for photo sharing. Now when I tweet out some text with an image, what happens in the background is that a new Image Post is created on my blog with a category I've assigned, the photo is attached and embedded in the post linking to the full size version, and the URL for that post is sent back to Tweetbot and used alongside the tweet. There's currently no support for custom image uploads in Twitter for Mac so I'll either have to find another desktop client to use, or accept that any images published from the desktop won't get pulled in. Since these image posts are something I do quite a bit more often than regular blog posts, I used the Ultimate Category Excluder plugin to make sure they wouldn't appear on the homepage and overwhelm the rest of the content. I wanted to also have a way for now to show these images in the sidebar of the homepage as a gallery. I thought an image gallery restricted to a specific category (or even better all Image Posts) would be relatively easy but my searches have been pretty lackluster so far. I did find Category Grid View Gallery which is what I'm using for now. It grabs the image from posts that have a specific category assigned to them and creates a gallery of thumbnails that open in a Lightbox fashion when clicked. I love that it has a lot of settings to adjust (category and tag exclusion, thumbnail size, number of images, etc) and that I can also use these galleries in posts if I wanted since it works as a shortcode. What I don't like right now is that when clicked what opens in lightbox is a windowed version of the entire post. I really just want to have the image open in large size rather than have a lightbox appear that has scrollbars. So it works for now but I'll keep searching around for something a bit more elegant. I've also gone ahead and setup a new IFTTT recipe. Any image from the feed of those Twitter photos gets pushed to Flickr. If there's any chink in the armor it's IFTTT because I can already tell its ease of use for a non-programmer type like myself means I'm going to rely on it for a lot of this automated work. Yet IFTTT has no business model (yet). They don't charge for there service, there are no limits that I'm aware of, and I don't see any ads (even if they did have ads it's not like I'm actually on there site for much longer than it takes to setup a new task). They've done an incredible job of making automated aggregation dead simple but the future of it does worry me. If they began charging for the service I'd have no problem paying for it, especially as I envision more of the work I do here hinging on the tasks I setup there.


I did say I was going to outline my goals for what I want to accomplish. I'm sure there are things that I will realize as I get into this project could be useful that I'm not thinking of here but this is a short-term list of what I'd like to do: - Have any video posted to YouTube or Vimeo also get added to my blog with a local copy of the video and metadata - Have any photo I upload to Flickr with a specific tag get pulled into my blog as an Image Post (the tag to prevent duplication with Twitter photos that get pushed there from coming right back) - Possibly setup some archive of all of my status updates on Twitter (maybe ADN too, but I honestly am not finding I post there much yet) - Pull in any photo onto my blog that gets posted to Facebook that I'm tagged in - Setup better ways of viewing these new media containers in gallery form - Setup a bookmark area (possibly here on the blog but this doesn't necessarily have to be public or live here) that automatically bookmarks favorited tweets, upvoted Reddit posts, and any link I share.

What else might I be missing that would be useful if you were doing something similar?