Tuesday, January 05, 2016

How to embed Flickr photos on Blogger - Tutorial

The new Flickr has been frustrating a lot of people, me included.

I've always been of the belief that if something is not broken, then LEAVE it alone.  It's quite annoying when people constantly feel the need to change things, mess with them, remove them or update them if nothing is wrong in the first place.

I've been on Flickr since 2006, it is actually the only online site that I pay a subscription for yearly, and I will continue to do so because I've used it for my blogging photos since the beginning.

A few months ago I noticed that Flickr had decided to change the way we embed the photos on our posts or online in general. What went from being a simple html code pasted into the posts, became an embedded html code which includes our account names and the title of the photo etc.....and worse for me, no way of centering the darn thing which I like doing with my photos.

To say that I hated it is an understatement.

_MG_1631

Above is the example of a photo taken directly from my Flickr account and using their new embed html code.  I am not able to center it, it has that white border on the top with my account name on it and Flickr on the right side.....and if you hover over it, you will see that it brings up sharing buttons and the name of the file etc.

For some this may be perfect and exactly what they're looking for, but for blogging purposes, and speaking strictly for myself, I don't like it one bit.

It took me a few weeks of messing around with it and finding a way around it, and I did, so I thought I would come in today and share it, for those who are not happy with this new format and would like to be able to post the old photos with no borders, information, and the ability to center.

First things first, I'm sure you all know how to do this part, but nonetheless, when you select a photo to share in Flickr, this menu will come up.  Choose the size photo you want, I usually have it on Medium as you see.

Now, before it would just say HTML, now it says HTML embed.  Copy that code and paste it into the HTML tab of your new post.







It will look like this. 

If I were to just publish the post now, it would show up like the photo above, with the white border and all the other unnecessary stuff.

So let's work around it, and it's still a little annoying just because I have to do this for every photo I post, but I like the ability to work around it.

First thing you are going to do, see the highlighted portion of code?  You are going to delete it, so delete data-flickr-embed="true"


Once that is deleted, you are also going to delete the following portion from the code....


Now go ahead and finish your post and then publish.

Here is the new photo without all the added embed code from Flickr. See the difference? Back to how it used to be and centered.


_MG_1631

I do hope that this has helped you all, I've had a few friends ask me for help with this because they've also struggled to get the photos on since Flickr made the change.

Let me know if you still have any issues, I will try to help as much as I can :)

Happy posting!!!!

4 comments:

Liz said...

This is very helpful! Thank you. I've been just using my pictures from facebook or my hard drive and not using my flickr account at all out of irritation. Maybe now I can go back to using it though.

Steven Ng said...

Very helpful tips, thanks :)

Bob K. said...

This is the best explanation of how to work around the problem of embedding a flickr photo I have read. It is a real pain in the neck though when I try to use a whole series of photos. Hopefully flickr will start to realize that since we're PAYING them for the service, we deserve better.

Bob K. said...

Thank you for the best explanation of how to remove the logo code. It is annoying in a serious blog post and if you leave the link to the photo in the html code you don't violate their 'community standards,' although I wonder why they are fussy at all if I am paying for 'Pro.'