Langsung ke konten utama

Xbox Live Gamercard Gadget For Blogger

Example Xbox Gamercar
For a recent design project I was asked if it was possible to display an Xbox Live Gamercard in a Blogger site.

Thanks to this useful guidance from Jamie Huskisson I discovered it was surprisingly easy to achieve and have now created a simple Blogger gadget for gamers to easily add their own Xbox Gamertag to Blogger blogs.


Manually add an Xbox Gamercard Gadget to your Blogger site

If you would prefer to control how your Gamercard appears, you can use the code below to add an Xbox Gamercard to your site. Be sure to replace "your_gamertag" with your Xbox Live Gamertag:

<iframe src='http://gamercard.xbox.com/your_gamertag.card' class='gamercard' width='204' height='141' scrolling='no' frameborder='0'></iframe>


Notes about the Xbox Gamercard

The Gamercard will only display to users who are logged into Xbox live.

The gadget I have developed displays a notifying background image when visitors are not logged into Xbox Live.

If you are installing the gadget manually, I would advise you to add some styling code to display a similar notification if the Gamercard is unable to load:

<div style="text-align: center">
<iframe src='http://gamercard.xbox.com/sniperfired.card' class='gamercard' width='204' height='141' scrolling='no' frameborder='0' style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1u5rK-temp9X7eNQ8XBDT9k54i3lr1ZhkKRRd6Kwi_haZ119P6_J_CYztVtK97qmZQubhxrnSNutXR7SXoQ2U3ndQVllXJJhv6yFIUEvfDOsshIjcLmJRComx_iD2y6K3KHhtinNxmHNg/s800/gamercard-bg.png) center no-repeat;"></iframe>
</div>


What do you think?

I realise that many Gaming bloggers choose to use Blogger for their publishing platform and hope this gadget will be useful for many of you.

Please feel free to leave your comments and opinions below.
Label:

Komentar

Posting Komentar

Postingan populer dari blog ini

Free Blogger Backgrounds And Textures To Spice Up Your Site

Background images can instantly transform the appearance of our Blogger sites. Using the Blogger template designer, we can easily upload and configure a new background image in just a few clicks, while those using older templates need only add a few lines of code to achieve a dramatic effect. In this post, you'll find resources for hundreds of different free backgrounds, patterns and textures you can use to spice up your Blogger site, along with instructions for applying this simple but extensive effect. Large background images Large background images enable us to display a single large image behind the main content of our site, such as a photograph or complementary texture. Here is a selection of excellent resources for large background images and textures: HOT Bliggity Blog Provides a huge selection of large background images with a contrasting central panel to offer contrast for the main site content. Shabby Blogs A beautiful col...
Posting Komentar
Baca selengkapnya

How To Add A Music Player In Blogspot

Since this archived post was written in 2007, web design and Blogger templates have changed immensely. The development of HTML5 and <audio> tags enable us to add music to our Blogspot websites and posts far more simply, and with improved control. In preparation for explaining how to podcast with Blogger, this tutorial explains how to easily add an HTML5 mp3/audio player to your blog posts or layout. No JavaScript, Flash or plugins are required, and with a fallback for older browsers which don't support the player. I've even created a simple form to generate basic tags for you! Adding music to your Blogspot site has never been so easy! Basic HTML5 Audio Tags Explained The <audio> tag is a new feature of HTML5 which we can use to natively embed audio playback in our sites. It is supported in Internet Explorer 9, Firefox, Opera, Chrome, and Safari, and can be set to play the linked audio file automatically (autoplay) or loop if required. Here...
Posting Komentar
Baca selengkapnya

How To Add Google+ Updates Gadget To Blogger

As yet, there is no official "widget" or RSS feed which we can embed in Blogger to display a stream of our recent posts on Google Plus. Luckily, Google+ to RSS offers a free service enabling us to generate an RSS feed for our personal profiles and pages which we can add to a simple Feed gadget in Blogger. Take a look at the sidebar to see this technique in action and read on to find out how to add a Google+ updates gadget in your own Blogger site. To get started, head over to Google+ to RSS and create a feed for your Google+ profile . You'll need to log in using your Google+ account to allow the app to access your profile stream: As soon as you've done this, you'll be able to "manage your entries" and locate the URL for your Google+ profile  RSS feed: Right-click the RSS icon beside your profile and choose to copy the link location. This is the URL to the RSS feed of your personal profile stream. To publish a feed for a Google+ Page...
Posting Komentar
Baca selengkapnya