spacer

ShowYourself Updated to v1.1 [updated]

March 18th, 2007 | Posted in: Programming, Tech, Web | Save to del.icio.us

spacer

Today, I’m happy to announce this first major upgrade to the ShowYourself Widget. The first version was released a few days ago to lots of good reviews (Paul, Mashable, Digg). If you aren’t familiar with ShowYourself, it’s an easy to use widget to put on your blog or MySpace to display all the websites and social networks you belong to. Before I get to the new features of version 1.1, I want to talk a little about the goals of ShowYourself. If you want to skip my banter and get to the new version details, click here. I developed the widget mainly to accomplish two desires.

1st – No suitable solutions

I searched around the web a lot for a tool like this. I found Wink thanks to Chris Messina. Wink was great in that it did solve my problem. I wanted some way to aggregate all my “Web 2.0″ identities into one easy place, so I could show my friends. Also, to help me from forgetting ones I’m a member of. There were a few problems with Wink. Paul puts it nicely:

Show Yourself is similar to the widget offered by Wink, but Wink requires that you have an account and their widget is a blatant Wink advertisement.

I agree with both of these. I didn’t want to have to register on a new social website just to create a widget to display all my social websites. I also, like Paul, think the advertisement is a bit overkill. There also was the fact that Wink is mainly hosted on Wink’s servers, so you are dependent upon them. I wanted something that was absolutely dead simple to create (no signups). Something that was completely free of bloated advertisements (ShowYourself contains a small link at the bottom that points back to itself, but as stated in the help document, this can even be removed by users if they wish). I also wanted something that was completely decentralized if the user wished. ShowYourself does not host any javascript or any things like that. You get all the CSS, all the HTML code, which means you have full control over its display. All the images are also available for download, so you can be totally independent of ShowYourself. I wanted something stripped, bare and super simple. I think that’s what I made.

2nd – Learning Experience

Most of what I design and program is more for the learning experience than for the actual output. Take, Todos. Todos was designed to be simply a fun experiment in UI design and coding. I had a mild need too show all my applications, but the main reason for its development was so I could practice Cocoa and work on UI. In the end, Todos has become relatively popular. Much more than I had expected from something I just did to learn. The same is true with ShowYourself. I mainly did it to have fun with designing something, and now I want to move it forward into a better, functioning, usable tool.

I hope those are reasonable explanation for my desires in creating ShowYourself. I read here about another widget developer’s opinions on the newer widgets like ShowYouself. I just wanted to explain why I did it.


The New Features

So, enough about me and my reasons, let’s get to the new version. The new version includes a huge load of improvements (and I’m just getting started). The #1 complaint about ShowYourself has been its use of tables. Yes, tables, tables, tables. The html orphan if you will. Everyone now seems to hate tables. They get such a bad rep. All the hype is for CSS, and I was forced to change with the times (these kids and they’re next-generation languages). ShowYourself is now 100% non table. Even the site around the creation of the widget has been table-less-ified. I’m not saying it’s easy. And I’m not acknowledging that it’s better. But it’s better. The code is so much shorter. So much cleaner. It’s just plain better. What’s really cools is that it’s now all list oriented, so there aren’t any nasty divs or spans to deal with. It’s just 100% CSS and html. Not even a tiny bit of javascript in the widget. No onMouseOvers or anything. I have to throw a shout out to Luke Dorny and Jake Dahn (RandomShapes member). They were the two fellas responsible in the CSS transition of ShowYourself. They were really amazing. For any MySpace users out there, the move to CSS/HTML now means much better functionality of the widget on your profile pages.

Next, what else do we got? Fear not, we got a whole bunch of super cool new features. We’ve got support for a ton of new web 2.0 sites. Here’s the list:

  • Friendster – Social Networking like MySpace (special request from the guys at Friendster. I was more than willing to add it.)
  • Virb – Social Networking as well
  • Linkedin – Social Business Networking and Resumes
  • YouTube – Need I explain? (I can’t believe this one was missing before, sorry)
  • PureVolume – Music Website
  • Upcoming – Social Calendaring
  • Zaadz – Better your social self
  • MyBlogLog – Social Blog Networking

Don’t see your favorite web 2.0 site on their? Don’t worry! We’ve solved that problem too. This is very similar to how Wink does it. They had this down, perfectly (I’m going to give props when props are due). Simply scroll down and you can fill in the service name, your username, and a link to your profile. We’ll even fetch the favicon for the website (big thanks to Paul James for that). This is no way the first time this has been done, but I think this is a really fast solution. Faster than Wink’s, which takes a lot of time and a lot of steps. Plus, we already have a bunch of sites built in, which speeds up the process.

spacer

Another update, you ask? You can now change even more CSS colors easily. Text color changing is now built in. Also, we now support Skype and AIM awareness. The logos beside your AIM and skype profiles will show whether you are online or not. Click them, and a chat will instantly be started, or a call will be made. I’ve also cleaned up the javascript creation function so generation will be faster. Technorati integration is also cleaner, allowing you to simply put in your username instead of having to put in the full direct URL.

[update] After getting some help from Chris Messina, I’ve also added Microformats support. Microformats provides a way to include address book or vCard data right into HTML. With this update, ShowYourself will now include valid XFN data. This is great in progressing standards an adopting the state of the art in relational data. Look forward to more extensive XFN integration in the future.

spacer

That looks like it’s all the new features for now. Pretty good, right? Here’s a recap in short form for any one interested:

  • All code is now CSS and HTML
  • Plenty of new sites added
  • Can add any site you want
  • More CSS color configuration options
  • Skype and AIM awareness integration
  • Javascript generation time reduced
  • Technorati integration improved
  • [Updated] Also added XFN support
  • Plus: super cool ajax goodness (see it in action when you add any of your sites not listed in our default list)

Well, that looks like one “helluva” update. Please feel free to take it for a spin and try out all the new features. I would appreciate if you leave a comment here or email me if you find any bugs. Please, as always, feel free to comment any of your thoughts. If you have any feature suggestions, I would also love to hear them. Please post them in the comments.

  • myspacerip.com/2007/03/18/showyourself-updated-to-v11/ » ShowYourself Updated to v1.1 – myspacerip.com

    [...] post by Dustin Bachrach Blog and software by Elliott [...]

  • sociali.zers.net/2007/03/showyourself-updated-to-v11/ Social Networking Bulletin – » ShowYourself Updated to v1.1

    [...] More: Dustin Bachrach [...]

  • www.notsorelevant.com/2007-03-16/show-yourself-widget/ Show Yourself Widget at Not So Relevant

    [...] March 18: It’s update time once again. Dustin Bachrach has updated the Show Yourself widget. New services, Skype and AIM integration (however you have seen this in [...]

  • blog.indodx.com IndoDX

    That great Dustin…. really usefully tool…

  • lukedorny.com luke dorny

    [ā€¦]dustin rocks[ā€¦]
    That is all.

  • Tom

    So how come you don’t use showyourself on this blog?

  • www.dbachrach.com Dustin Bachrach

    I moved to a different theme not that long ago, and I’m still deciding where I want to put ShowYourself and also whether I want to do some custom styling for it. I’ll post here when I do.

  • blog.xuite.net/emisjerry/tech emisjerry

    Hi Dustin,

    Based on your idea, i’ve developed a version for Taiwanese. Here’s this page: emisjerry.googlepages.com/showyourself_gen.html

  • www.mynameiskate.com Kate

    Hi Dustin, just wanted to say THANKS for such an elegant widget. The widget creator is just as elegant, too. Here are a few notes on things I had to change to get it to work for me in both IE and Firefox:

    – Your WordPress installation directions are a bit brief. It took me a couple tries to figure it out. You may want to say something like, “if you’re using sidebar widgets, make a text widget and paste the code into it.”

    – I placed the icons in the folder you directed (I think) but couldn’t get it to work. Eventually, I concluded that relative URLs didn’t work for the icons because when I went to page 2 of my blog entries, all the icons were broken. It might just be my theme, not sure. Anyway, I ended up just putting a static URL in the widget for all the icons and it worked fine.

    – I struggled to get the header background to fill up the entire width of the widget. Eventually I figured out that you need to add “display: block;” to the “#showyourself h2″ style. Then, it worked.

    – The link style for my theme took over the link style for your widget. I couldn’t figure out a nice way around this, so I did the ugly hack of manually putting the font color into the widget code. I’m not sure if this is something you can fix, since the styles all seemed good… again, it could be my theme.

    – Finally, it all looked OK in Firefox. In IE, however, the entire widget was indented. I fixed this by changing the first line of the code (after the style section) from this: “” to this: “”. And, I changed the at the end to . That leaves the list without UL tags, but the LI items still work OK.

    Again, thanks for this excellent widget. Your simple code makes it extra easy to make modifications like this.

  • www.seoul-man.blogspot.com Jon Allen

    Hi Dustin.
    Excellent little widget you’ve created.
    I’ve created one for my blog, but for some reason all the images in the list don’t quite line up in the box. I’ll have a play around.

  • www.dbachrach.com Dustin Bachrach

    Jon Allen: It looks like you might have some issues with your theme applying its own css to the widgets. You’ll probably need to just mess around a lot until it’s working. Glad that you like it.

  • andypiper.co.uk/ andyp

    Looks really nice.

    I already use onXiam for storing my identities, though. Also I can’t embed this in WP.com… spacer

    Still, a neat solution.

  • free-adult-sex-movie.blogspot.com/ John Svid

    Wow great site! Some really helpful information there.
    Iā€™m sorry for little off-topic, but I want to ask you about design of this site.
    Did you make this template yourself or got from any templates website?
    Looks pretty cool for me. Wonderful well this reading.

  • widgetbeat.net Al Merkrebs

    Thanks for a great widget Dustin. I reviewed it today on my site.
    -Al

  • seo1services

    I absolutely LOVE all your post !! I'm new on this website, but rest assured that I will read every post you publish ! It's so informative ! And it really helps with what we need to do!

  • www.clickresponse.net/search-engine-optimization-service.htm seo services

    All the new features are great specially Skype and AIM awareness integration. Thanks for sharing.

  • georgcdc

    I also exite about the web 2.0 so thanks to giving me information.

    Website developers india

  • Exploretalent

    Explore Talent -Valuable information you got here! I would like to thank you for sharing your thoughts and time into the stuff you post!!

  • virtschool.wordpress.com/2010/09/24/showyourself-super-neat-tool-your-own-widget/ ShowYourself — super neat tool — your own widget « Virtschool's Blog

    [...] ShowYourself — super neat tool — your own widget dbachrach.com/blog/2007/03/showyourself-updated-to-v11/ [...]

  • profiles.google.com/mariaanne123 mariaanne castro

    I will loved to shoff my self. sole e95

  • Shelby Wise

    Wow thank you for sharing us such a wonderful article. Looking forward for more of your post.

    royale hair straightener
    super solano hair straightener
    super solano hair straightener

  • Shelby Wise

    Wow thank you for sharing us such a wonderful article. Looking forward for more of your post.

    royale hair straightener
    super solano hair straightener
    super solano hair straightener

  • Shelby Wise

    Thank you for taking the time to publish this information very useful!Looking forward for more of your post.

    paul mitchell flat iron

    maxiglide hair straightener

    elchim hair dryer

« Joining RandomShapes | Finishing and Packaging Your Program »
spacer spacer
gipoco.com is neither affiliated with the authors of this page nor responsible for its contents. This is a safe-cache copy of the original web site.