VIRB° BLOG

It's like watching your favorite movie. At the director's house. A month before it premieres. And you get to help choose the ending.

Help us to help you to help us make Virb better. Talk to us about new features, learn how to customize your profile, and more...

Read an entry

New image sizes, now CSS-free

Are you tired of changing your profile's image sizes (e.g. video thumbnails, friends, etc) by way of the CSS? Do you lie in bed at night - turning, churning and wishing that there was an easier way? For so long, I had assumed that Ambien and/or whiskey was the only fix for me. Yet I've discovered that my answer was nothing more than a tiny, yet powerful new feature tucked away in the HTML LAYOUT of my ADVANCED profile customization.

Small, medium or large*. These are the 3 variables, that used in the proper place, will set you free from wading through your CSS. Implementing it will also take less time than what it takes you to read his post...

To get you started, I'll include an image with my examples highlighted. Now, go forth and enjoy your day of CSS-free image hacks.

*NOTE: Small, medium and large only. All options are still Trans fat free, but no Super Size at this time. My apologies.

posted by Brad under New Features, Profile Customization

9 MAY 2007

33 Comments

33 Comments

I will play with my profile design later and see how this works out. Very cool. Thanks! This makes it so much easier for most people.

posted by Floris Fiedeldij Dop on May 9, 2007 at 2:21pm

I have a feature request, and its still kinda on topic… How about letting us put banners at the top of our page without editing the CSS file, so we can still use the easy editor for the modules and stuff. I think thats the biggest change you see to VIRB profiles.And a possible second feature being background images, with the option to align it to different corners… I'm can do all of this in CSS, but I'd much rather just be able to do it in one of the other two tabs that get disabled when you edit stuff with the advanced editor.

Thanks

Oh, and let me know if you have specific area/form to submit feature requests.

posted by Robert on May 9, 2007 at 2:34pm

Awesome implementation though I don't mind using values in CSS, but I'm sure for those that don't know what CSS is, or even where to look, this will definitely help them out.

posted by Jordan on May 9, 2007 at 2:37pm

I couldn't get it to work (unless small, medium and large are extremely similar in size)…

posted by d on May 9, 2007 at 2:38pm

@d:

What's your profile? I'll take a look.

-Matt

posted by Matt on May 9, 2007 at 2:43pm

For the Flickr module, does this to make square thumbnails?

posted by Matt on May 9, 2007 at 3:28pm

The little things always make the biggest changes. I love this :)

posted by Ruth on May 9, 2007 at 3:29pm

matt: /dean

still no worky. thanks!

posted by d on May 9, 2007 at 3:39pm

You mind readers! This is exactly what I've been missing.

Unfortunately it doesn't seem to work with the Flickr module at the moment. Could we possibly have the choice of the default Flickr options as well as the three new sizes? Square, thumbnail and small ( image_s, image_t and image_m respectively) would be great.

posted by Sam on May 9, 2007 at 3:43pm

YOUR KIDDING ME!! You guys think of EVERYTHING!!!

posted by Vincent on May 9, 2007 at 3:53pm

I'm just being lazy, but what do the keywords translate to in pixels?

posted by paulgiacherio on May 9, 2007 at 4:54pm

dagggittt. yesterday looked up how to change that stuff. it took me forever. if only i had waited…

posted by CJ on May 9, 2007 at 4:56pm

Sam is right that the sizes don't work with the Flickr Module right now. It's not out of the question, though, that we'll offer some size variations for the Flickr module in the future.

-Matt

posted by Matt on May 9, 2007 at 6:32pm

Small, Medium, and Large all work with the Flickr Photos now.

-Matt

posted by Matt on May 9, 2007 at 6:59pm

This seems to be only working correctly for the Flickr module. For the regular virb photos, I can't get large, it's just normal (medium?) and the small and medium values both appear small.

posted by Reese on May 9, 2007 at 7:10pm

I run a group virb. There are 12 artists in the group, but only 3 have their own virb. In the artists module, it shows 5 artists and its in a random order, often times it shows 5 artists that arent even on virb and you only see the black & grey silhouette icon. I would love to be able to see the most current 3 confirmed artists as the first three all the time. But I can't figure out how.

How do I do this?

The page is here

posted by tk on May 9, 2007 at 7:17pm

my God, you guys are good. Great idea. Big time saver.

posted by Ben on May 9, 2007 at 8:43pm

Now I don't have to bother using CSS in the future. Great idea!

posted by itsmattadams on May 10, 2007 at 2:51am

Any way to make this work with photos of Groups?

posted by Amin on May 10, 2007 at 11:38am

That's great, thanks a lot Matt.

Amin, just use the same 3 variables on the group modules.

E.g. $VIRB_groupsRecent(8, small) $VIRB_groupsRandom(3, large)

posted by Sam on May 10, 2007 at 11:54am

Thanks Sam. Don't know why it didn't seem to work the first time, but after reading your reply I tried again – worked perfectly =).

posted by Amin on May 10, 2007 at 3:34pm

No problem Amin, glad I could help. :)

posted by Sam on May 10, 2007 at 4:00pm

anyone get this working with OrgMemberships?

posted by Tim on May 10, 2007 at 9:34pm

This is a cool idea. Like Tim I can't it to work for OrgMembership.

posted by Matthew on May 11, 2007 at 5:14pm

This is a great new feature; kudos to the dev. team!

One caveat, though, not entirely related to the new feature: If an album name has a comma ( , ) in it, such as "Concerts, Bands & Musicians" you can't display it using the module because it interprets everything after that first comma s the next parameter of the module. Is there any way to escape the character? A backslash didn't work, and I don't think using the HTML or UNICODE entity would solve it either.

LMK, thanks! Mike

posted by Mike on May 12, 2007 at 11:38pm

The creepy thing about this is that I discovered it while cringing about the fact I have to resize flickr photos through CSS. This certainly fixes a lot. Thanks. :)

posted by BoMEpsilon on May 14, 2007 at 10:43am

So this is a cool feature and all, but what would make it even cooler is if we could actually define pixel dimensions. With CSS I can do this, but it distorts the pics to the point where the only thing left for me is an Ambien/scotch cocktail and a Zanex to get through the day.

posted by Adam Duro on May 14, 2007 at 8:21pm

erm, the flickr medium seems not to be working :\

posted by Joel on June 3, 2007 at 11:41pm

is there a complete list with all module possibilities

posted by 3typen on June 7, 2007 at 2:40pm

and how to add the personal player?

posted by 3typen on June 7, 2007 at 2:42pm

for flickr only medium and large are working, i can't get the flickr pictures as small as the virb pictures. (or is this something where there is no workaround?)

also; is it possible to change the size of the albumcovers in the discography section?

posted by wim on July 5, 2007 at 7:40pm

I wanted to get the thumbnails to be 90px, in order for it to be proportional to the friends thumbnails, but it seems that I can't find the right css attribute to match it upon, anyone got any idea?

posted by dirtylipbalm on July 11, 2007 at 3:35am

Hello smart People° ! I'd love to know how to have my Flickr photos in 2 colums on the roght side of my page… Any idea?

posted by Crêpe Suzette on September 14, 2007 at 6:28am

Browse Topics
Are you new to Virb?

Hello and welcome. Maybe you don't exactly know what Virb is? Then, we'd suggest you go and get yourself a new account. Give it a spin. Make some friends. Listen to music. We think you'll like it here.

VirbTunes

Watcha listenin’ to? Download VirbTunes to display recently played iTunes songs on your profile.

Flickr Integration

Put your Flickr photostream on VIRB faster than you can say hello! (or Bonjour! Hola! Kia Ora! Moya!)

Widescreen Videos

Clear, high-quality widescreen video, meet VIRB. Say, you two look really good together.