Project:Badgr | mentalaxis

mentalaxis Badgr2.0

What is badgr?

A very cool Flash-based badge that allows you to display your Flickr photo stream. - Mike Downey

You can place it into your webpage, blog, MySpace page or whatever, and you can try it out here...

Constructr

( Requires Flash Player 9 )

Full page view?

[hide/show instructions]

How to use...

To setup badgr all you need is a Flickr account with some photos and a web page somewhere that allows you to add a little HTML.

If you run your own page and have the ability to upload files to your server you can also download the badgr2.0 SWF file and install it on your server. I recommend the use of SWFObject to place badgr2.0 on your own site.

Download badgr2.swf (right click and Save Link as....)

In either case the code you'll need is automatically generated for you in Constructr which let's you customise lots of different features so that badgr2.0 will look just the way you want.

Using Constructr

When you are ready to start configuring badgr2.0 for you site you will find Constructr very helpful, let's quickly look at what you can do...

Badgr mode and id's

The badgr mode determines where the photos you want badgr to display are going to come from within Flickr, it can be user photos, photosets, group photo's and tag searches, the id will change with the badgr mode, so you'll need to get the id for the search. You can use idFindr to get all the different id's needed, there's more info about that below...

If you're using the badgr mode tag search everyone you won't need an id.

Frame

You can create your own frame style or pick one from the palette and use it or modify it to your taste and to match your page, frames are made up of a background color (which should match your own page background.) The second part of the frame is the overlay, this will fill the entire photo grid when a zoomed image is displayed, you can set it's color and transparency (alpha) if you want to display the frame without the overlay, set the alpha slider to 0. The next two frame parts are the outside edge and the outside border, again you can set their colors and alpha settings, you also control their scaling, the outside edge scales from the overall size, and the outside border scales from the outside edge.

The last two frame colors are for the inside edge and the inside border, the outside edge is scaled from the zoomed photo outwards, the inside border scales back from the inside edge.

If this sounds a bit complicated, trust me it's much easier if you just play with it. Remember you can save frame styles as you edit them and they will be listed in the Frame Styles tab. If there are any parts of the frame you'd like to hide, simply set the alpha slider (transparency) to 0 for those parts.

If you want to delete a saved style from the Frame Style palette you can just click the little trash can next to the style and then confirm you want to get rid of it.

You can also return the style palette to the default styles by clicking the Reset Styles button

idFindr

a version of idFindr is built into Constructr to help you find photos on Flickr from users, groups, photosets and tag searches, you can find users by searching on email address, username or a users Flickr page URL, once you've successfully found a user all the photoset, groups and contacts for that user are listed, you can select any of these and they will update your badgr mode accordingly. Selecting a contact will change the idFindr search to a username search and fill in the contact username, to chain your search through that contact all you'd do is just press the idFindr Go button.

You are also able to get photoset and group id's directly by getting their Flickr page url's and entering them into the Photoset and Group search tabs.

General

There are lots of settings available in the general settings tab, they will help you limit the photos returned by flickr and modify the way they are then displayed, you can set the slide timings, how long to wait between each photo zoom and how long to keep it zoomed. You can also set the size of the badgr photo grid by adjusting the rows and columns, a small visual representation of the grid will be displayed to give you a quick idea of the shape, with information on the actual size of the grid in pixels.

Selection

Limit - The number of photos to try and get from Flickr, this will work from the most recent photo backwards, default is the number defined by the size of your badgr grid.
All - This forces Flickr to return all the photos for your search
Show in rotation - Badgr will display all the photos returned, by default badgr will only display photos for the number of grid squares, these are picked at random from the returned set of photos, with Show in rotation checked, each photo grid square will get a new photo from the set once it's been displayed

Timing

Wait - The number of seconds to wait between displaying each photo.
Display - The number of seconds to display each photo.

Size

Rows - The number of rows in the photo grid.
Columns - The number of columns in the photo grid.

Tag

When you use a badgr mode which allows tag searching the Tag panel is enabled, where you can enter tags / keywords each one separated by a comma, you can also set the search to find photos with all the tags or photos with any of the tags.

There are a number of options here which let you define a date range and the way that the date range works, either based on photo upload date or the date a photo was taken.

Tag searches can also be ordered by interestingness, date taken or date uploaded.

Generator

When you have made the customisations you want for your badgr you can visit the Generator panel and you will see two sets of code, one for simple embedding, for use with MySpace and other pages where you have limited control over page code, this is also recommended if you aren't familiar with HTML and JavaScript.

The second code box is for setting up badgr on your site with SWF Object, to use it you will need to upload the badgr2.0 swf to your website and be familiar with HTML and JavaScript, you must also install SWF Object on your site for this to work, the advantage is that people browsing with Internet Explorer will not need to click badgr twice to go and view photos on your Flickr page, unfortunately IE has recently been updated to force people to activate Flash components before they can be used themselves, SWF Object get's around this, and you can find out more about this on the SWF Object site.

When using the SWF Object version of the Badgr code you will need to modify the code very slightly to make sure the badgr2.swf and swfobject.js are referenced properly for your setup.

[hide/show advanced information]

Badgr 2.0 querystring parameters

If you are using the code generator to create your embed tag you can ignore this, it's for those who wish to use badgr and for one reason or another cannot use the Constructr. The listed parameters can be appended to the badgr2.swf src attribute in the form of a standard query string, for example src="myflashpath/badgr2.swf?badgrmode=1&rolling=yes

Badgr2.0 query string parameters
Parameter	Description
badgrmode	one of the following numbers (default is `badgrmode=1`) user user set user favourites user tag search group all tag search
userid	which is either the userid, groupid or setid depending on the `badgrmode` you want.
tags	followed by the tags you want to search for (comma separated.) If you're searching for multi word tags such as "Blue Skies" (or whatever) write them in your list as blueskies as Flickr treats them as the same tag. Tags are ignored unless you are using `badgrmode=` 4 or 6.
limit	The maximum number of photos to return from your set, default is rows x columns.
rolling	Set to yes Indicates whether all the images in the returned photo selection be displayed or just the random 25 picked at the start. Set to yes or no (default is no.)
waittime	time in seconds to wait between displaying a zoomed in photo square.
displaytime	time in seconds to wait when a photo square is zoomed up.
rows	Number of rows of small photo squares (I recommend you have 2 or more) The display height of the swf will be 38 * rows. (default = 5)
columns	Number of columns of small photo squares (I recommend you have 2 or more) The display width of the swf will be 38 * columns. (default = 5)
framescaling	This is a string of 4 numbers separated by commas, the default is 1.05,1.0,1.08,1.04 ... They are the scaling factors of the frame, here's a quick description of what they do in order.. (a, b, c, d) The total canvas size / a (The total canvas size / a) / b 75px square * c c / d These settings create the default frame for badgr.
framecolors	Similar to the scaling factors but much simpler this is a set of 5 hex colors separated by commas which are the frames colors... default... #FFFFFF,#000000,#000000,#AAAAAA,#000000
framealphas	The corresponding alpha / transparency values for each of the 5 frame colors. the 5 values are in the following order
bgcolor	The background color of badgr, should match your webpage background.

For more info about the development of badgr click here

Bug reports

If you find an issue with badgr or the constructr you can post a bug report here so we can keep track of it and get it fixed as soon as humanly possible, please provide as much information about the circumstances in which the problem occurs and make a note of the browser you are using.

If you can tell us how to reproduce the problem we'll be more likely to get it fixed.

Not only but also...

Badgr2.0 is under constant development and all that we ask is that you tell others about it, and let us know if there is anything else you'd like it to do, within reason we'll try and make it happen.

Credits

Badgr, Constructr and idFindr are developed and maintained by Jason Milkins - jason at mentalaxis.com

Badgr uses Kelvin Luck's Flashr library to interface with the Flickr API.

idFindr and Constructr uses Darron Schall's AS3 Flickr Library.

147 Comments Add your own

poner un video de cualquier cosa

ApologÃas Rios

Badgr (y Flickr) permite solamente imÃ¡genes.

This is great - I really love badgr. I’m looking forward to see the next enhancements (especially: number of images to display), many thanks to you - in advance.

Thanks Kai, I should be finished in a few days, so hopefully the new release will be available before this weekend.

This is such a coincedence. I was just looking for a more high res alternative to “Slide” so I googled it on 7/21/06 and the first one was Flckr, is this the best MySpace compatible slideshow available?? I know they have a 200 image limit for the free version, ( dont know if there is a better high res alternative online but I like Flckrs slideshow setup the best so far.) Anyway. I got the slideshow up on MySpace, THANKS!! I guess I am one of the first ones as this has just been released? I cant wait to make it 500×500 will the new release allow for that? And I only want to display a certain set. I see that you are creating that , THANKS MAN THIS REALLY IS EXCITING! DO YOU THINK YAHOO OR MYSPACE WILL BLOCK OR DISABLE THIS?
I only have one question really, I know this pertains to Flicker but do you know how to change the sequence of photos in the slideshow? Is that what a set is? Thanks for all your hard work!!

A couple of quick answers for you, badgr will feasibly allow you to show a huge grid of photos, well the new one will anyway, but and this is quite a big but, the zoomed in photo will still be the same size. (75×75px) Since Flickr doesn’t guarantee any other size or clip another size to a square it kinda f**ks with the grid layout… I have been thinking about building what I would describe as an Uber slideshow for Flickr but that’s been done quite well already, so I’m not in a hurry to do that…

The sizes that badgr has been designed for are (in this new version) are for sidebar viewing… even though, feasibly, you could have a 20×20 square badgr it’d be a bit crap (I think!) .. still you’re the boss and when I get the badgr 2.0 out the door in a couple of days you can give it a shot and see how it looks… be sure to post me here and let me know it’s up and running so I can take a look.

Quick update, badgr 2.0 will also let you change the background colour, badgr 1.0 forced a white background on you… and that won’t do.

Flckrs Uber slideshow is amazing. The problem for me is that I havent found out if its even possible to embed that directly into Myspace. Do you know how? You could make so much money in advertising if you created a way to make something bigger than 75×75, as that is any 3rd party would have to click to open up the flckr page which is what most people want to avoid. I like that Badgr2.0 is going with a sidebar because it runs smoother I think , and I guess that with sidebar you could make it bigger than 75×75?
Is there anyway to set it up for myspace so that the slideshow is completely embeded at a large size of at least 200×200?? I would flip if there was a way to embed the Flckr slideshow where all of the images are in rows at the bottom of the black box and above the images the viewer could select the speed and pause on an image, etc..

Dont take this the wrong way, this is a great advancement in the slideshow world but the size of the grid embeded doesnt really matter, its the size of the highlighted zoomed shot. I actually think there would be added value in reducing the size of the grid as it would save valuable space on a page. I guess you realized this and so youre goin with the sidebar format. Anything larger than 75×75 would be great. Do you know what the code would be to embed the ginormous Flckr slideshow box that has the rows beneath the selected photo and above the selected photo are the pause and speed selections. And then when people click on the giant 450×450 photo they could be directed to Flckr to comment on the photo.

Im trying to display a 450×450 slideshow/marquee on MySpace where its similar to the generic Marquee Code which is great except the viewer cant control the speed or pause as well as the main drawback which is that the photo has to be uploaded to a webpage as a source or be taken only from online instead of as a file on your hard drive. So if you want to display a photo online it cant be cropped or enhanced it has to be displayed AS-IS. All of that began my search for something. Slide ruins the quality of the photo otherwise their codes are great.

Very well done to you, it’s a shame it took so much googling to find this site!

Thanks a lot for the brilliant flash!

I take it back, the large grid does look very attractive with the ultra mini hi res grid. Its pretty cool looking kolidascope type thing. It would be cool to have a large grid of 75×75 for each photo.

You know what would be baddass…….. a sidebar with like 3-4 or 5 layers of like 30×30 which is, I guess, the size right now at the top of this page….. then the scrolling sidebar could feature a photo (see above) as its scrolling. That would both save alot of space and encompass alot of images!! I know this all takes time just ideas for the future , theres no way that I have the skill to do somethin like that. For you this has alot of promise, they hire people who tweak this kind of stuff.

and then as the , lets say 5Hx10W grid is scrolling either left right up or down if someone places the cursor over an image it will be selected at 75×75!! Man I wish I had the programming skills, id be working on this day and night and hiring people. You should quit your day job man, this has alot of promise. Yahoo would hire you.

Sean: Theres a lot to answer here so Ive tried to boil it down into a few chunks.

* The sidebar I mentioned is the place youd put badgr, like in the left or right nav (what I call a sidebar) … this isnt a feature Im adding to badgr to make it interactive. (sorry because that seems to foil alot of what youre talking about here.) Badgr is designed to be a photo badge, and itll stay that way, if I were to build a slideshow with larger displayed images itd be called something else… lets say slidrâ„¢ shall we, and lots of the ideas youre talking about here would fit well in something like that, and it would be along the same lines as the Flickr slideshow, but as I say there are a few other slideshows out there so maybe Slidrâ„¢ wont happen… have a look at my Flickr Tools list and see if anything is suitable for you…

* The size of the grid matters to Badgr because it has to fit into a variety of sidebar areas the 190×190px grid is too big for many sites (or too small in some cases) Ill expand on the ways that badgr is designed to be deployed when I build the badgr2.0 page.

* I really appreciate your feedback, its given me plenty to think about!

* As far as working for Yahoo is concerned thatd be very nice, Im a bit busy with the BBC at the moment.

Oh I see. Yeah I have the badgr in my myspace “about me” sidebar. Cant wait to see 2.0, thanks for taking the time to respond!

looks great,is there a way to change the small pics from the square to the 67 x 100 thumbnails for use on myspace?
thanks alot for any help

i cannot get my badgr codes eventhough i provide a valid flickr id, it still doesn’t generate a code. help me please

Hi rhoseiteki

Can you let me know the id you are trying to use… and also what type of computer, browser version and which version of FlashPlayer you have installed.

It should be a simple problem to fix,

[...] badgr A very cool Flash-based badge that allows you to display your Flickr photo stream. (tags: Flickr WebService) [...]

I’m using Firefox 1.5.0.6

When I hit “badge it” the code is not updated.
I am using a valid flickr id (using idgettr.)
When I paste the code that is there in the about me section of my MySpace profile I only see the following code on the profile. (using the pre Microsoft / EOLAS patent problem method)

.. classid=”clsid:d27cdb6e-ae6d-11cf-96b8-444553540000″ codebase=”http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0″ width=”190″ height=”190″ id=”badgr” align=”middle”> ..>

Just thought I’d let you know.

Tom,

Make sure you have JavaScript enabled in your browser or the code generator will not work (this has been tested on PC and Mac Firefox v1.5.0.1 to v1.5.0.6) you must also use the MySpace code for MySpace pages, MySpace will strip embedd tags rendering the Pre-EOLAS code useless on a MySpace page.

Ooops! My mistake, I’d broken the code generator on this page…! Sorry about that!

The myspace code must still be used on myspace pages though.

Excelente Thank You, for this ^^

i love it…

[...] badgr (tags: flickr) [...]

[...] Mashable doesn’t normally feature services without their own domain names, but Badgr, a new tool from MentalAxis, is particularly neat. To create a badge displaying your Flickr photos, head over to Badgr and enter your Flickr ID, then grab the code snippet and paste it into your profile on MySpace, Piczo, Xanga, Multiply, hi5, Friendster, Tagworld, Windows Live Spaces or your own blog. [...]

[...] badgr-flickr badge å·¥å…· [...]

[...] Beaucoup d’entre nous utilisent Flickr pour hÃ©berger nos photos et il y a une possibilitÃ© d’afficher ces derniÃ¨res sur n’importe quel site web. Badgr est un service gratuit assez similaire qui offre beaucoup plus de fonctionnalitÃ©s. Il fonctionne sous Flash. Si cela vous intÃ©resse, vous pouvez l’essayer Ã cette adresse : http://mentalaxis.com/words/badgr [...]

[...] Badgr: The Flash Flickr Badge A very cool Flash-based badge that allows you to display your Flickr photo stream. [...]

This is great! I’ve been wanting to do something like this with my textamerica account but once i found this i decided to go with badgr! I used it on my myspace page but i have one tiny problem. When i click on any of the pictures that badgr uses, it doesn’t send me to my flickr account. i guess the link is broken. but nothing happens. i tried it on my blogspot and it worked perfectly there. i assume it has something to go with myspace.com
Can anyone help me? i just want everyone to be able to visit the flickr page when someone clicks any of the pictures.

[...] badgr (tags: latest OldMedia flickr photos badgr tools myspace) [...]

[...] Just go to Badgr, enter your Flickr ID, choose the number of photos you want to display and get the HTML code. badgr flickr friendster myspace photos piczo slideshow windows live xanga [...]

[...] Just go to Badgr, enter your Flickr ID, choose the number of photos you want to display and get the HTML code. [...]

[...] badgr (Beta) (A very cool Flash-based badge that allows you to display your Flickr photo stream.) [...]

hi, i’m using your badgr on my page, (mainly as the flickr one uses iframes….) , and would just like to say how good it is…

the only thing i’d like is for the images to appear larger when they’re zoomed in, (i.e. to make them the same size as the total flash movie)

Mortel… tout simplement. C’est la bonne idÃ©e du mois! Je vais l’installer immÃ©diatement, et prÃ©venir mes amis et contacts de l’existence de ce nouvel outil.

Flickr vient de prendre un nouvelle dimension.

Bon courage pour la suite

[...] I just discovered this great new app called Badgr you can use to display your flickr photos on your profile. I love Badgr because it has a slick flash layout and provides tons of customization options. I wrote an article a while back about how to post your flickr photos on your profile and Badgr takes that idea to the next level. Badgr allows you to display certain sets of photos, your favorite photos, photos by tags, groups of photos and more. It also allows you to customize the way it displays the photos. Now I know that Myspace has just released its own slideshow utility. To be honest, I was pretty unimpressed with it. It has very few customization options and it doesn’t allow you to pick and choose from your Myspace photos. There are tons of apps out there right now for sharing your photos on Myspace and they all have pros and cons but Badgr ranks pretty high up there in my book! Check it out! [...]

This is a great little piece of flash. How can I change the zoomed size of the images? They are a bit small

Hi Julian, unfortunately Flickr only serves up the 75×75 sq images as a regular size, all other sizes are irregular and are minature versions of the original photo, so you can never rely on an image size.

For example, a panoramic image as a thumbnail (instead of the 75px square) would have approximate dimensions of 100 x 60px and a tall portrait would thumbnail at something like 80 x 100px the long edge is the measure that flickr makes standard, to autocrop an image it’s the small edge we would need to remain constant.

For example… if the minimum size of an image format along either edge was 100px and the other edge was greater than 100px then we could centrally crop the long edge to equal the short edge.

Sadly Flickr does it the other way around.

Imagine you had 5 images of varying sizes, using the short edge to make them square images would mean you’d end up with different sized squares, Using the Long edge would leave you with whitespace to make up the difference.

I’ve been experimenting with creating larger images from the 75px squares, but then we loose image clarity.

If we took a larger image size from Flickr and then scaled it down we could manage the size of the images so that they could be cropped to a uniform square but we’d also loose clarity with the reduction, since Flash only squashes the images instead of resampling them…

If I were to move Badgr to the Flash 8 Platform I could do a image resample using a custom function (Flash 8 allows you to work directly with Bitmap data) but that wouldn’t work out too well…

In theory I could let badgr pickup larger images but then the onus would be on the user to make sure their images were square cropped…

That’d get pretty boring, pretty fast…

I think it’s worth pointing out that badgr is only meant to show you a snapshot of your photo selection so that people can go and visit your photos for a closer look, after all it’s not a full screen slideshow app.

Still if after reading this you can help me solve this little puzzle, let me know, a decent robust solution might be lurking in your brain right now.

I’ve thought about the problem a lot and maybe I gave up on it too soon.

Thanks very much for the reply Jason.

It is a shame that Flickr doesn’t have any larger square crops. However, perhaps you could include the option to simply load in the different image sizes to the badgr movie.

So, by default badgr uses the square size but you let the user change this in the querystring, something along the lines of: “&zoomimagesrc=medium”. This would load in the medium image size (with other settings being “square, thumbnail,small,medium,large”). Provided it was centred in the badgr stage I think it would look alright?

Of course it would be superb if you could crop these and resample accordingly, but i for one would be happy with them at differing aspect ratios.

Hi Julian,

This would open up a few problems…

1) Transistion from the square to the other image…
2) Image larger than the swf size?
3) larger images loading times.

Point 2 is the worst problem, but 1 and 3 also present some difficulties.

I’ll have a closer look at implementing this option but I won’t make any promises, the nice thing about badgr at the moment is the transition, using 2 versions of the same image and transistioning between them (at non matching points) will loose the clean / smooth movement.

Oh yes, it certainly wouldn’t work as beautifully at the moment.

1) I would say that the transition would look fine if the zoomed image started scaled to match the thumnail on it’s shortest side and ended full size and centred in the badgr stage. since it fades in from transparent?

2) I think if it’s centred then it would be fine to have it simply get cropped by the swf. Since the default size would have been manually changed by the user as an advanced feature you can but trust them to choose an appropriate image size!

3) True, perhaps letting people select the large image size is overkill. I personally only need the “small (240px)” size.

Thanks again for looking at this!
Julian

This is truly amazing thank you!

Ok after playing with this for a few minutes I have to say I think it will be VERY popular. I know I have personally been searching for something like this for a long time.

With that said here are a few things I think could be added that would make it even better.

1. Add an option to show a single picture! Currently 2 x 2 is the smallest you can go.

2. Add the option to resize the default thumbnail size and/or allow you to just so show just the blown up pictures. (not really a badge any more but VERY cool and VERY useful none the less)

3. Not sure if this one is possible but it would be FANTASTIC if once all pictures in the badge have been shown to reload with a new set of pictures. (currently you can do this manually by refreshing the page however automating it would be nice!) This would make the badge much more dynamic.

Hi Shurafa,
Thanks for the feedback…

In reply (1) 2×2 is only as small as you can go in the construction kit, you can set &rows and &columns in the URL to be 1×1. I deliberately set the minimum in the construction kit to 2×2 so that I could stem the tide of (likely) comments asking why bother ;) … So it’s possible the question really is why would you want to do that, since the blown up image wouldn’t fit?

2) I’m not sure why you’d want to change the default thumbnail size (unless your asking about having different images instead of the 75×75 square? I’m looking into this, however it is likely I won’t implement that feature.) Still if that’s not what you mean, can I ask you to exaplain why you would want to just display the images at 75×75 square… what sort of transition effect would you want and what would it do, since we’re no longer able to make the image larger. Sorry if I’m not getting the point.

3) There is a checkbox in the general options which lets you do this already, its called rolling selection, tick it and the images from the selection will all display in rotation. Once an image has displayed it will sit back into the grid and while it fades back (very slowly!) it will load a new image from the set. As you can see the initial grid will always be picked at random from the set when badgr starts up.

Hey Jason,

1. The 1×1 would be useful when posting images to say someones comments on myspace and you want to post the image with the cool zoom effect build into badgr. That really makes your picture stand out from the rest. Also if you make it rolling it will keep changing pictures like a single photo slide show!

2. This is my biggest conern. I have a large monitor and 75×75 is tiny less then 1cm. More imortantly is there a way to make the zoomed pictures larger? (without clicking on them) How about scaling the entire badge? Something like 4x the size would be nice. The ability to choose the output size would be AMAZING.

3. The rolling selection is a great feature thank you!

Here is a link to my myspace if you want to see what it looks like. I added the badge to the about me section and I will be adding a ton more!

http://www.myspace.com/shurafa

Hi Shurafa,

First of all I just looked at your MySpace page and what you’ve done with badgr is, wicked hot! I’d not thought of lining them up like that myself and the effect is crazy, great work dude.

On point 2) I would say that getting larger images from flickr will require you to customise the settings a lot … I might do a simple test demo for people who want to use larger images.

I’ll need to think about how this would work, but as an outline you would need options to specify manual crop sizes, grid square sizes, blow up sizes and this would also require tight control of the Flickr images displayed… The main problem I have with that is group and tag based badgr feeds.. my thinking is this may branch into a different tool, or maybe some sort of advanced mode.

I’ll have a think.

Hey Jason,

Thanks for checking out my page. There are tons of applications for badgr like that. I was thinking a photo mosiac setup the way I have my myspace but on a larger scale would be pretty sweet too.

I agree a seperate tool may be the best way to go if you want to integrate tons of advanced features. I think there is a need for that as well.

In the mean time modifying the current tool is a good idea too. A fairly simple work around would be to as follows: Currently when you have a 2 x 2 badgr setup it shows 4 thumbnails followed by a pic the size of these 4 thumbnail. Im no programmer but I would think it would not be that difficult to change the output image to be the size of a 3 x 3 grid instead or maybe a 4 x 4. Giving you an option to choose the size of the output file would be ideal! Does this make sense? How hard would this be to do?

PS. Do you have a forum? That would be a great place to discuss this sort of thing as well as a place for the community to discuss things and help each other out!

err had to take most of them down because it was lagging peoples machines.

I need to do some tests to see if it is bandwith or cpu issue. Then figure out how to optimize it.

Yeah, I thought that’d probably be a problem ; )

There’s only one place that this could be optimised and that’s the frame drawing, I can add an option to switch off the frame, piece by piece or completely.

It’s CPU,

The only bandwidth issue is if we go over the 75px square.

This is not a request, i just wanted to say thank you!
This was exactly what i was looking for.
I just got the nokia N80, and with ShoZu and wifi, I can automatically upload my pictures, then all my latest pics come up on my myspace.
Thanks again, and check it out at:
Ben’s Myspace

[...] Oltre ad una grande collezione di strumentinti, alcuni anche divertenti, in mentalaxis si trovano un sacco di notizie e due chicche: idFidr, una completa utility per trovare lo UserId di Flickr (e lo Id dei gruppi e dei photoset ad esso corrispondenti) e badgr, uno strumento basato su flash per bloggers adatto a creare badges, che permette di visualizzare il proprio photostream di Flickr nelle pagine web. [...]

Hi Ben,

Thanks for that, I just had a look at your MySpace page, if you set the background color in the frame options you can make it blend in better with your page.

[...] francis@media g e m m a Google Analytics Flickr.rb badgr Helio Home | Helio.com â€“ Mobile Devices, Phones, and Wireless Service for You Sounds Familyre – Danielson Danielson JavaScript Shell 1.4 Simplify data extraction using Linux text utilities Django | The Web framework for perfectionists with deadlines [...]

How can I add the badgr to my blog… (blogger - meirou.blogspot.com)

Hi Marko, you can use the construction kit to setup badgr2.0 how you like and then go to the generator tab and copy the myspace code and paste it into a container (e.g. DIV or P tag) in your blog template.

I can’t provide information on how to edit HTML, but there are plenty of places to find out more… Google is your friend.

Just wanna say i love this & Thank You, Sir.

Um, it stopped working on my blogspot blog. I have had it on there for at least a month, and all of the sudden, nothing is showing up. I re-configured with the construction kit, and it won’t work in either html or the SWF? Hmm? Wonder what happened? Please suggest?

I wondered when somebody was gonna do this!!

;))

Good Stuff!

seems to be broken… both the myspace code and the generator dont seem to be able to look up by name email or url…

also.. once it working again, if flickr havent blocked the app… can you put up some clear simply instructions how to use the swf and the code generated

thanks

and
hoping…

Is there any way to make the pictures that show up in the badgr 2.0 slideshow bigger?

Thanks for this tool! You’re the best! I enjoyed using the constructr kit and finally Tweaked out the code I wanted. I only have three questions that I couldn’t find the answers to… (Please ignore the earlier post)

1. “If you run your own page and have the ability to upload files to your server you can also download the badgr2.0 SWF file and install it on your server. I recommend the use of SWFObject to place badgr2.0 on your own site.”

Putting badgr on my own site… does this mean to tell me that doing this would put the code generator on my website for people to use?

2. Is there any way to change the website that people reach by clicking on my slideshow?

3. Is there any way to make the pictures that show up in the badgr 2.0 slideshow bigger? Also, what is an “Image URL”? I read somewhere that this may be able to make the image bigger?

I did some searching, and I usually don’t ask for help. Anything anyone can provide is much appreciated.

Thank you.

[...] HÃ¤r Ã¤r ytterligare en flickr-mashup. Badgr ger dig mÃ¶jligheten att skapa egna badgar med dina Flickr bilder. Enkla instruktiner om hur du fÃ¥r in Badgen pÃ¥ din webbplats, blogg eller var du annars vill ha den. [...]

Hey Joe,

The badgr2.swf is just the photo display Flash movie, Constructr and idFindr are separate Flash movies and you dont need them on your site, you can return to http://mentalaxis.com/badgr and tweak your code whenever you need and then paste the modified code into your site. (You need to make sure the swfobject.js and badgr2.swf are where the code is looking for it, by default the code will look in a folder on your webserver called flash, but you can change that to anything you like…)

2. The Flickr terms of service mean we have to link to the Flickr photo page for the photo clicked.

3. Im working on the image size issue, you can see a demo in action here. http://mentalaxis.com/words/2006/08/23/badgr-20-bigger-images-you-got-it/

An image url is simply the internet address of an image stored online somewhere. URL means Univeral Resource Location, (sometime expressed as URI or Uniform Resource Indicator) … These are just like telephone numbers or street addresses, they just point to an image. If you right click on an image in your browser, you will have an option called Properties, click it and the URL will be shown (it may be called Location, it depends on your browser…)

All the best, and dont be afraid to ask for help, its often the quickest way to find things out…

[...] Badgr es un badge no oficial para las fotos de Flickr en flash bastante atractivo para colocar en el menu de tu blog o web, similar al oficial de Flickr pero con otro formato. En el enlace podÃ©is obtener el cÃ³digo poniendo vuestro id en Flickr que podÃ©is obtener en idGettr. Os dejo un ejemplo: [...]

Hello, and thanks a ton for doing this, Jason!

I’m trying to incorporate badgr into an overlay with MySpace. Pasting the code into a blank account works fine, but when the overlay styles are applied it doesn’t appear. I’m betting that the overlay is just hiding the badge, but I’m not sure, because img src’s display just fine. Do you have any suggestions, or have you run across this problem before?

I’ve been having a problem with badgr when using it on my myspace page. Clicking on images doesn’t go to the flickr page. Is this by design? How do I fix it?

Just wanted to say this excellent. Love it. I have looked at Shurafa’s page, and like what he did with it. Very cool.

hi there, my flickr slide show that i put on my website has stopped working, it just doesnt come up…theres an outline of a square but no photos or text etc….I didnt change anything on my page so i am confused as to why it would suddenly stop! any ideas anyone? what i mean is heeelllppppppp! x

Great tool thnx..

1 problem everytime i click on the image in the flash movie is takes me to a flickr page saying its undefined.

How do i link this to my full size images in flickr?

thnx….

hi there, my flickr slide show that i put on my website has stopped working, it just doesnt come upâ€¦theres an outline of a square but no photos or text etcâ€¦.I didnt change anything on my page so i am confused as to why it would suddenly stop! any ideas anyone? what i mean is heeelllppppppp! x

Caroline, the same problem happened with a site I built for somebody…I just re-downloaded the badgr2.swf file and uploaded it onto the server…after that everything started working again.

Hello, I love badgr!!!! however I cannot seem to get it to produce white as the overlay. It is always a light blue. It looks correct in the preview on your site but when uploaded to Myspace the color is blue. I have tested this on three other myspaces. All of the coding is set to “fffffff” any ideas why? I would love to use this but I am stuck. Here is the code the generator gave me minus my ID.

Is this project still live? I would love an update on the next version. Sizeable pictures would make this plugin near PERFECT. Keep up the good work!

Hi Shurafa,

Sorry, I’m busy preparing for my Wedding.

Badgr will resume development at some point in November.

Congratulations!!!

Thanks dude! Good Times!

It’d be great if we could pre-set the slideshow speed ahead of time so the photos don’t automatically change slowly (& we’re not relying on the viewer to know how to speed it up).

Jason,

Thanks for creating such a great tool. I just got badger up and running on my website and it rocks! You can see it at http://www.sixbentstrings.com/galleries/html.
I also posted a mention and link on my MySpace blog.

Cheers,

Dave Hoskins

[...] - Badgr Ã¨ una badge Flash davvero carina, che visualizza una piccola galleria di foto di Flickr sul vostro sito: non dovete scaricare nulla, vi basta selezionare le preferenze direttamente dalla pagina apposita online. Tutto ciÃ² di cui avete bisogno Ã¨ Flash 9. [...]

Hi Jason,
Great job. I used Badgr in two of my blogs. My first try was unsuccessful because I was using a tag name with two words and mistakenly I used double quotes. Of course generated code had double quotes for the tag name which did not work. I switch them with single quote now it works like a charm. I was just curious, if we can use same trick to display picassa web albums, since most of my pictures are hosted there. Thanks…

I LOVE the badgr! Thank you! However, I have been reading around here and I still want to know whether we are able/how to increase the zoom-in pic from 75×75 to the size of the original flickr slideshow image. Help? Thank you!!! again….

Steph

I have the same problem with the image destination when clicked. It goes to an “undefined” flickr page. Any ideas?

can you use this for local images, say locaed in mywebpage.com/images/

or somthing similar? all my flickr files are private and will not show unless public

this is awesome !
thank you so much

I love your tech demo of the larger thumbnails ( http://mentalaxis.com/words/2006/08/23/badgr-20-bigger-images-you-got-it/ ). I see what you mean about Flash 8 not resampling the image–it obviously drops the quality of the photo a bit. But that’s a trade-off I’d be willing to make to be able to actually *see* the image at a larger size.

Also, like someone posted above, the links to Flickr don’t work when embedded on a MySpace page.

Thanks again–Badgr rocks! And I hope you have/had a great wedding and honeymoon. :)

Still checking the site daily for an update… How it comes soon! Congrats once again…

[...] Just like those sticky pieces of paper slapped on the back of a car, online badges can and will allow people to express affiliations with schools, groups, locations, brands, bands, and much more. But unlike static stickers, online badges (like those created by Badgr) possess the ability to be personalized. And they’re not just for people - Brian Phipps has an interesting post about ‘widgets as brand pipelines,’ which can easily be applied to badges as well. [...]

Jason,

I noticed you have a paypal donate button on your page. I just launched a new service at http://chipin.com that you might be interested in using. We offer a flash widget that auto updates everytime someone makes a contribution to your paypal account. It is totally free and you can set all contributions to go directly to you paypal account. The flash Contribution badge has a progress bar, shows a target amount and amount raised and duration of campaign. This way your supporters know how much you are trying to raise and can easily chipin!

[...] badgr [...]

Hello, This is a great widget, thank you so much for sharing it!

One question: Is there a way to do compound tags as flickr does in it’s search? I am trying to retrieve photos that have been tagged with both “exploratorium” and “science.” When I enter these tags into constructr and select “all tags” it retrieves photos that are marked with one or the other, not both.

thanks, jenny

Still hoping there will be an update soon… :-)

How do I fix this error.

“undefined is no longer active on Flickr.”

Please let me know.

Definitely a must-have !

Updates? :-)

Please include an option to launch links in a new window. Obviously, the links are now broken when in an iframe - other than that its top notch.

Um… suddenly myspace wont take the code.

Apologies if this is the wrong place for this….

This is a fantastic application! I’ve thrown it on my naked myspace to appease ppl who thought as a photographer i should have photo’s displyed well. - Enter Badgr.

My only query is that it seems that the links back to the flickr image page are not working? That consistent with what you know? Or should i look again?

Thanks again!

Christine, Andrew … Let me know your MySpace pages and I’ll see if I can help.

Well I’ll try it again in the morning but the day I posted it.. I made a new one to adjust the colors to my new layout and it didnt take it… so I thought it might just be THAT code… so I copied the one from my blog to test it and it rejected that one too. If it doesnt work when I try it tomorrow… then I will let you know what it is. Has this not happened to anyone else?? Ive used it for a long time and I change it out all the time…

My web site uses XHTML 1.1 served as application/xhtml+xml. The tag is an illegal tag in XHTML, so I wonder if you could provide a means of embedding badgr into my page using the XHTML tag instead of the tag.

My web site uses XHTML 1.1 served as application/xhtml+xml. The “embed” tag is an illegal tag in XHTML, so I wonder if you could provide a means of embedding badgr into my page using the “object” XHTML tag instead of the “embed” tag.

Thanks for the help! MySpace address as you requested… :)
http://myspace.com/twobigpaws

It looks like the MySpace engineers have added a filter to stop flash based widgets getting new webpages (via getURL)

For more info on the MySpace linking and flash widgets in general read these links…

http://gigaom.com/2007/01/18/myspace-blocking-widgets/

and

http://mashable.com/2007/01/18/myspace-disables-flash/

Seems that MySpace (or to be accurate News Corp) thinks their users are stupid and lazy enough to be abused…

What do you think?

Just to congratulate for this amazing work, your tool is really really great, please keep on the good work !!

Any Chance of an Update? :-)

This software is awesome , thanx for sharing :)
it would be great if it would work on firefox aswell as explorer…also being demanding..if we could
choose size of the pop up image would b fantastic.

i’m no idiot but it just took me 10 minutes to figure out ‘right click’ to copy myspace code!!!!!

basic “control-c” didn’t work in this regard.

thanks so much for creating this, a great thing.

Updates?

Suggestions for the next version:

-Have the option of using collections, rather than sets.

-Allow 1 row or column.

Great job!

Thanks!

[...] arena is a crowded space with services like Slide, RockYou, Vmix, Goodwidgets, Splashcast, and Badgr. Admittedly, most of those services have their sights squared on MySpace and other social [...]

[...] show arena is a crowded space with services like Slide, RockYou, Vmix, Goodwidgets, Splashcast, and Badgr. Admittedly, most of those services have their sights on MySpace and other social networking sites. [...]

Great stuff, definitely a worthwhile alternative the flickr flash badge they host.

A few ideas:
-Multiple zoom in pics at once on larger grids
-Option to allow photos to start unfaded

Thanks for the good work, keep it up

When using your badgr in a WordPress blog and using the mode = 2, I click on the badge itself and get an ‘undefined’ error within Flickr. It is trying to go to the user undefined/usersetnumber. Is there a way around this? Help! I posted the badgr code in the Google Code Issue area. Thanks!

I found a workaround for the ‘undefined’ problem if your Photos Sets are tagged properly.

Use the Tag Search User function and put your user id in there or look it up through the idFindr app (the number and letter one, mine’s 98245498@N00). Then go to the Tag tab and enter the main tag for your set. Set it to find all the tags if you have more than one word in the tag for the set.

Now when you click on the badge, it goes to /User_ID/Set_ID instead of /undefined/Set_ID.

Thanks for a great piece of software, Jason!

MySpace took the code and tha, but won’t link to the pics on flickr. I read the links you posted but, er, they went a bit over my head. Is it just MySpace having a paddy or can it be fixed?

Hi, I’m not having any success in embeding this into a page in my wordpress blog. I get the message ‘Flash required’ I’m pressty new at this so please excuse me if this sounds like a dumb question. I believe it has something to do with the src=”swfobject.js”> Any help would be much appreciated!

It would be great if you could enable the urls to open in a new page & not the current one.

Hi - have been using (and loving) badgr in my myspace for ages - will you be developing an app to allow me to drop a badge into my facebook profile, or is the code “ready to go” as it is?

Thanks,
R.

“It would be great if you could enable the urls to open in a new page & not the current one.”

*NEED* this for LIVE SPACES

AWESOME little widget, exactly what I’ve just spent three days searching the web for. THANK YOU.

I hesitate to make any requests, but if I were to make one, the ability to customize the size of the thumbnails to some degree would be really helpful.

I have to say that this is an awesome handy tool which I’m currently using for myspace profile. I have to agree with Jason above that it need to allow link to the photo page. Hopefully the next version will allow that. Anyway, keep up the good work and thanks for what you are doing for us.

Is anyone still using this? If not, why not? Does it work on MySpace?

Steven

When I click on a pic it goes to the flikr photo page. Can it be possible to ‘define’ that link i.e a custom link…???

126: Itzme :still working with MySpace? … as far as I know, it is ..

If anyone has other info please post here.

127: Shubham :Flickr’s terms of service only allow you to link back to the flickr photopage. - You could try lobbying them to change this rule.

123: I’ll add this on the list of todo items for the next release.

Got this one working on myspace, and it looks a HECK of a lot better than the SLIDE show I was using…

http://www.myspace.com/retropixeldesigns

Fantastic! Looks great, Just the right size, and very stylish!

[...] after numerous web sites and google queries, I finally found a slideshow that works on Myspace; Badgr 2.0. I absolutely love it! Itâ€™s visual simplicity is gorgeous and I love how easy it is to set up a [...]

Not an idea, but thank you very much for writing and developing this. I’ve been looking around for ages for something like this and Badgr is a godsend. I really appreciate the flexibility it offers in terms of sources and layout. Keep up the good work!

This looks great!! THank you so much!!!!

Just one problem with myspace still… When you click on the picture.. nothing happens. It doesn’t take me to my flickr.. Is it a myspace problem? Can it be fixed?

Yes this is a MySpace problem (or feature!) …

MySpace general practice is to stop any Flash based things, you put on your page, linking out.

Is it possible to have larger pictures displayed? All I’m getting is 100 x 100.

say, man! All I have is a blank white box where my Flickr should be. Plus, I already have flash 9! what’s going on?

This is AWESOME ! Thanks SO much.

Corey.

[...] case anyone’s interested, the plugin is called Badgr 2.0. It seems to work better with Flickr than some of the other ones available through the Wordpress [...]

Thanks, I was looking for a non-standard size badge, and here I found the perfect solution!

Thanks for the nicely designed tool! I however have a problem: the re seems to be no (or inactive) link in my badges to my Flickr website. What went wrong for me? I tried to put html link codes in front of the object but that doesn’t work either…

Thanks in advance for your reply
Greets

thanks so much for this, i love it!! xx

[...] å…·ä½“çš„ã?ªã?“ã?®ãƒ?ãƒƒã‚¸ä½œæˆ?æ–¹æ³•ã?§ã?™ã?Œã€?ä»¥ä¸‹ã?®ã‚µã‚¤ãƒˆã?‹ã‚‰ä½œã‚‹ã?“ã?¨ã?Œã?§ã??ã?¾ã?™ã€‚ mentalaxis Â» Project:Badgr [...]

Great great great widget… Best by far! Thanks so much. Check mine out…

http://www.myspace.com/spictacularjon

Thank you; this is just what our group needed! (flickrRSS only used the most recent images, by definition, so it wasn’t helpful for our needs.)

[...] ??????????????????????????????????? mentalaxis » Project:Badgr [...]