Join 3,572 readers in helping fund MetaFilter (Hide)


i thought tumblr was supposed to make blogging easy
August 29, 2011 11:44 AM   Subscribe

why do photos on my Tumblr blog get squashed when I look at them on a mobile device or other people reblog them?

I use Flickr to manage my photos; when I want to put them on my Tumblr blog, I copy the HTML/BB code out of "Share this photo" on Flickr and paste it into the HTML editor for the Tumblr post. This works fine when you look at the Tumblr blog on a big screen. But when I look at the mobile version of the blog, the photo is squashed horizontally, with the aspect ratio all messed up. And if someone reblogs the photo, it usually "breaks" their Tumblr theme, sticking out beyond the edges of the content area, and it's squashed horizontally again.

All my landscape-oriented photos are generally at a ratio of 1.6; I crop them to 1440x900 in iPhoto, upload them to Flickr, and then post the 640/400 version. This only happens with the landscape photos; portrait photos work fine.

I'm not super web-literate, so maybe I'm using the wrong terms here, and that's hampering my fixit efforts—I'm not really sure what to be looking for or where in the chain the problem is. Can you help me troubleshoot, or at least figure out where to start? Thanks!
posted by peachfuzz to Computers & Internet (4 answers total)
 
Do you have the same problem posting a photo directly to Tumblr (i.e. using the "photo" button on your Tumblr dashboard)? I suspect the problem is that flickr functionality.
posted by mattbucher at 11:59 AM on August 29, 2011


Hmmm. I'll have to try one and see. Good thought!
posted by peachfuzz at 1:58 PM on August 29, 2011


Tumblr automatically resizes photos when you post as mattbucher describes. But you are copypasta-ing the html from Flickr, not replying on Tumblr to "find" the image code itself. Does the html code you are posting by chance have code in it that looks like "width=640px"?

If so, that tiny bit of code could be overriding Tumblr's automatic resizing capability, especially if your tumblr theme just so happens to be 640px wide, but a different width when viewed on the phone or a different width from others themes who have been reblogging you.
posted by Brittanie at 9:12 PM on August 29, 2011


Okay, try this and tell me if it helps.

The normal html code for flickr looks something like this (I'm using one of my own photos as an example):

<a href="http://www.flickr.com/photos/fastcarsandfastboys/4092042386/" title="Me on steps by Brittanie Shey, on Flickr"><img src="http://farm3.static.flickr.com/2609/4092042386_ef0820f221.jpg" width="500" height="375" alt="Me on steps"></a>

Now, remove the part on your code that is similar to this:

width="500" height="375"

Past everything else into Tumblr and see how that works.
posted by Brittanie at 9:21 PM on August 29, 2011


« Older Attention math teachers: what ...   |  I recently had to reinstall Wi... Newer »
This thread is closed to new comments.