John D Wells

I build websites with HTML, CSS, jQuery, PHP, ExpressionEngine & CodeIgniter.

Proud co-founder of the kick-ass, London-based creative agency One Darnley Road.

© johndwells

EE Hive’s Flickr for ExpressionEngine2 now available on GitHub. Wygwam integration coming soon.

Known simply as ‘Flickr’, this modest yet powerful EE2 add-on fully integrates Flickr into your website. And it’s awesome.
Flickr is now Matrix2 compatible, and even more awesomeness is on the way - like integration with Wygwam.

Published:
Feb 11, 2011
Filed under:
EECMS
Comments:
11 - add yours

What are you waiting for?
Get Flickr for EE2 now on Github.

First of all, this is a big shout out to Brett DeWoody and the clever chaps at EE Hive / Digital Wax Works. Not only have they built an already brilliant add-on, not only have they released it for free, but they've invited other EE developers (like me) to get involved and help make Flickr even better.

I've really taken this open source opportunity to heart, and have begun (perhaps over-enthusiastically) contributing to the project.  First order of business was to restore Matrix2 compatibility, which was completed just prior to its release on Github. This week I've been busy with another feature...

Flickr button for Wygwam

I could go on and on (and on) about how awesome Wygwam is - which is also a heavy endorsement for CKEditor as a whole - but I'll leave that for another time. But as I was first setting up Flickr as a custom fieldtype for a current project, I just knew that my client was going to eventually ask how he could embed a Flickr image into his Wygwam field. I imagined the conversation going something like:

Open Flickr in a 2nd browser tab, and find the image you want. Click Actions > View all sizes, and then click on your image. Click on 'Share This', select 'Grab the HTML/BBCode' and...
Awe, fuck it, nevermind. I'll get back to you.

I had little choice. It took a bit of wrestling, a bit of late night sweat and tears. It's still rough around the edges and needs refining, but here's what's soon to come...

What's this, a Flickr button? Hmm, I wonder what this does...

Neat, a CKEditor overlay! So let's click on a thumbnail then...

Oooh, I get to choose which size image I embed into my Wygwam field!

Clicking "Insert" drops the selected image size straight into your Wygwam field, and it's there just as a normal image; you can edit it's properties, alignment etc by using the CKEditor's native image button.

But wait, there's more

Lot's more is in the works for Flickr. We'll be moving the authentication settings away from the fieldtype setup and into an extension. All of the documentation could use a good refresh. I hope to investigate the possibility of handling videos coming from Flickr. We also might reconsider how Flickr saves image info in the custom field, and maybe even look at some caching down the road.  See, lots to do - stay tuned, or get involved!

Published:
Feb 11, 2011
Filed under:
EECMS
Comments:
11 - add yours
 

Have your say...

Sweet! Looking forward to it!

  • #2
  • On 02:29 PM, 14/02/11
  • Paul said:

Hi,
I

  • #3
  • On 02:43 PM, 14/02/11
  • From London, UK
  • John D Wells said:

@Paul, go ahead and download the source from Github, it should support pulling in thumbnails from a photoset no problem. The documentation desperately needs to be updated we know, but in the meantime something like the following will hopefully guide you:

{exp:eehive_flickr:photoset set_id=“yoursetid” size=“thumb” limit=“10}
<img src=”{flickr_img}” >
{/exp:eehive_flickr:photoset}

But if this isn’t what you’d had in mind, feel free to send me a zip to hello at johndwells dot com and I’ll take a look.

Cheers

  • #4
  • On 05:10 PM, 14/02/11
  • Paul said:

Thanks John,
I’ll give it a go.
Can you use Imgsizer within these tags?

Regards, Paul

  • #5
  • On 05:14 PM, 14/02/11
  • From London, UK
  • John D Wells said:

@Paul Yes you should be able to use Imgsizer, though I believe technically its remote abilities are considered “experimental”.  If it gives you trouble, try CE Image (commercial add-on, but supposedly very good).

Let us know how you get on! :)

  • #6
  • On 12:39 PM, 15/02/11
  • Paul said:

Hi, The set thumbnails is working fine, thanks.
Just to let you n

  • #7
  • On 12:44 PM, 15/02/11
  • From London, UK
  • John D Wells said:

@Paul, would you be willing to post a support request in the devot-ee forums?  We’re going to start handling all support requests there.

http://devot-ee.com/add-ons/support/flickr/viewforum/390/

When you do, please tell us a bit more about what might be going on - browser/platform you’re on, if you’re seeing any JS errors, etc.

Also be sure the extension is installed and set up correctly, i.e. you’ve authenticated with Flickr etc…

Cheers

Simply amazing, can’t wait for this.

It would be great to have a similar interface for YouTube videos!

  • #9
  • On 03:57 PM, 16/02/11
  • Oskar said:

Very nice. Love the UI. Picasa and Youtube version of this would be mint too. ;-)

  • #10
  • On 08:01 AM, 21/02/11
  • From San Diego, CA
  • Natetronn said:

John this looks like it’s going to be great!

  • #11
  • On 08:20 PM, 16/03/11
  • From Curacao
  • Alex said:

Hi John, first of all i love your work.

I try to get my photosets and display all photos in it…

{exp:eehive_flickr:photosets}
{exp:eehive_flickr:photoset set_id=”{set_id}” size=“square” limit=“10”}
  {flickr_img}
{/exp:eehive_flickr:photoset}
{/exp:eehive_flickr:photosets}

But the code above doesn’t do the trick, how can i get it to work?