Adding Flash and MP3 Playlist codes to Bebo’s Code Snippet

You need one of the following modules/applications

• About Me:
• Code Snippet
• Gigya’s My Stuff

Doesn’t code snippet already allow flash?

Well it does, but you may have noticed your Playlist.com code may not fully work within the code snippet. Sure the graphics pop up but the flash code itself is missing. Here’s an example of Code Snippet using the proper embed code.

As you can see in the picture above, the music player doesn’t show up even though the embed code is correct. The Code Snippet module allows flash but under a very specific code. What makes this code difficult, is that you will have to cut and paste the flash code into bebo’s special format. We’ll take you step by step on what you need to do to get Playlist.com and other flash examples working correctly.

Please pay attention to the steps carefully. Playlist.com code insertion is listed on the second page.

How does Bebo handle Flash?

Bebo uses flash through it’s own SNML protocol. SNML is pretty similar to HTML, but there are some slight differences. You may have noticed that both the About Me and Code Snippet modules say SNML. This is where you would paste Bebo’s SNML code.

Step 1: Find your src=

The first thing you must locate is your src= code. This src code begins immediately after the after the equal sign. Highlight the code your flash application  gave you. You must highlight from the first quotation mark up to the next quotation mark. After you highlight this code, right click and press copy. The example below shows a Vimeo video code.

<embed src="http://vimeo.com/moogaloop.swf?clip_id=2072369&server=vimeo.com&show_title=0&show_byline=0&show_portrait=0&color=14c963&fullscreen=1" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="400" height="225">
</embed>

The code that follows src= is highlighted in blue. This is the code you will paste into Bebo’s flash code in Step 2.  Use the scrollbars to see where the blue code begins and ends. Note there are only two quotation marks.

You should not have more than 2 quotation marks at this point. Later on we can add more quotation marks.

Step 2:  Bebo’s Flash Code

<sn:swf swfsrc="insert swf or flash src code here">

Take the blue code you copied in Step 1 and replace it over the purple text in Step 2.

Step 3: Paste your flash SRC code inside Bebo’s SWFSRC code

<sn:swf swfsrc="http://vimeo.com/moogaloop.swf?clip_id=2072369&server=vimeo.com&show_title=0&show_byline=0&show_portrait=0&color=14c963&fullscreen=1">

If you insert the code correctly you will have it show up like this. There should only be 2 quotation marks in your entire code up to this point.

Advanced abilities

Bebo’s flash code can also scale by width and height. You can do this by adding this to your code.

width="xxx" height="xxx"

Replace xxx with the number of pixels you want it to be. Your code could end up looking like this.

<sn:swf swfsrc="http://vimeo.com/moogaloop.swf?clip_id=2072369&server=vimeo.com&show_title=0&show_byline=0&show_portrait=0&color=14c963&fullscreen=1" width="199" height="160">

That about end it. If you need more help the next page will explain the exact same method with Playlist.com

AIM’s New Chat Experience; Add Chatrooms To Your Website

AOL has just exposed the new AIM Chat Experience on their front page. The new chatrooms ditches Userplane’s flash based interface and attempts to ease the migration for AOL users into a web based format. This will also be the first time AIM users can enter an AOL member created chatroom.

The Setup

On the left column lists all the users in the chatroom. Each user has their own icon which you can upload at profiles.aim.com. If you hover over the screen names, you can either view a profile, IM, ignore, or report a user. In the center is the complete chatroom, it places every text in it’s own little speech bubble. If someone types more than one line, the chat bubble expands downwards. On the right side is the media panel. Users can paste links to videos, photos, or just a plain old link.

The Implication

Yes, even after the invention of MP3s, the WAV chatrooms still exist.

From the names of the chatrooms that are appearing in the user created area, it seems AOL has finally migrated the old “FDO Chats” to the internet. FDO Chats were previously exclusive only to those with @aol.com screen names under AOL client software. Now that AIM users can also chat in AOL chatrooms, expect a clash.

The Design Flaws

The designers chose to have each line of chat appear in a speech bubble. The basic design and colors used for the chat bubbles are very distracting and clash against the main background. Some themes, as noted in the screenshot above, make the situation even worse. I also didn’t quite understand why the screen names are placed on the right side of the speech bubble.

If the designers could try to follow in iChat’s footsteps by creating smoother speech bubbles and placing names on the left side, it might make these chatrooms more visually appealing.

Chat widget

The chat widget runs under yourminis.com platform which AOL acquired recently. At least it is being put to use unlike Bebo, as we have yet to hear any news on how AIM Profiles will utilize it.

[via the daily chatter]