Xbox 360 Avatars in a Content Editor Web Part (using Microsoft Popfly)!

  • Article

I recently made a nice looking Web Part (shown below) which shows a picture of my Xbox 360 avatar and those of my friends. I used Microsoft Popfly to make it look so great and I thought I’d explain how you could make your own. This is aimed at all those gamers out there!

 

Stage 1 – Rip My Popfly control

  1. Go to my Popfly project here.
  2. Select Rip This
  3. With a copy of the Popfly project open, click the Configuration icon (a spanner) next to the List box.
  5.  
  6.  
  7.  
  8.  
  9.  

    5. In the Value text box, simply type in your Xbox Live Gamertag and that of your friends (separate names using commas; e.g. JIMMY KEMP, friend1, friend2)

    6. Click OK

    7. Click Run to see your Popfly project in action

    8. Click Save and enter a name for your Popfly project

    9. Click Share

    10. Click Embed and then copy the html source, which will look something like the following:

<iframe style='width:500px; height:375px;' src='https://www.popfly.com/users/355387/Xbox%20360%20Avatars.small' frameborder='no' allowtransparency='true'></iframe>

Stage 2 – Create a Web Part

  1. On your SharePoint site, from the Site Actions menu, click Edit Page
  2. Click Add a Web Part
  3. Select Content Editor Web Part and click Add
  4. On the Content Editor Web Part click Open the Tool Pane
  5.  
  6.  

    5. In the properties pane for the Web Part, click Source Editor...

    6. Paste the html source you copied at the end of stage 1

    7. Click Save

Enjoy!

Comments

  • Anonymous
    January 01, 2003
    It's an artists impression I guess :). James

  • Anonymous
    January 01, 2003
    Hi Gav, I get the same problem. It would appear that calls to the xboxlive.com website are no longer retrieving results. I will try and investigate the issue further when I get more time. Apologies for this (it was working!!) James

  • Anonymous
    December 08, 2008
    Is that what you look like? Good work. Thanks for this post. J

  • Anonymous
    March 11, 2009
    Hi mate, I have copied this and am getting a Javascript error, not quite sure how its occuring have tried on a number of PCs and failing each time. Any idea what could be wrong? cheers