Categories: FacebookSearch Engine Optimization

How To Add An Image To FBML App For Facebook Fan Pages

Facebook Fan Page FBML App – How To Add an Image

The FBML app for Facebook Fan Pages can be challenging, especially if you are just getting started with figuring our its capacities, and its limitations regarding HTML.  One of the easiest HTML elements to add to the FBML app are images. And adding custom images to your Facebook Fan Page is a great way to brand your own business on your page.

Add images to the FBML app:

The first thing you need to do to add an image to your FBML app is to upload your image to a server.  If you have a WordPress blog, then you can click “Add New” underneath your “Media” section on your WP dashboard.

Otherwise, you can use a free hosting service like Google Sites to upload your image.

Ultimately, you need a URL for whatever image you are wanting to add to your FBML app.

Once you have a URL for your image, then adding it to your FBML app is as simple as adding standard HTML code for an image.

Here’s the image I have added to my default landing tab for my Facebook Fan Page:

You can also see my entire custom FBML tab here.

And for the image you see above, here’s the HTML code that I’m using:

<img src=”http://seoscale.googlepages.com/facebookfanbutton2.gif”>

Now if you wanted to link your image to an external website, then you’d add the following HTML element to your image HTML:

<a href=”http://yourwebsite.com” target=”_blank”><img src=”http://seoscale.googlepages.com/facebookfanbutton2.gif”></a>

Notice how the linking HTML is now wrapped around the image HTML.

I also added the element target=”_blank” since that allows your link to open in a new window.  Of course, all you’d have to do is remove the target=”_blank” element to have the image open in the same window.

View Comments

  • Great post here, Robert. First, I assume you're talking about the Static FBML app for Facebook fan pages, correct? It's really quite flexible and we've used it to customize a number of fan pages. I've posted both a Static FBML FAQ and a Static FBML tutorial on the HyperArts blog, which your readers should find useful. There are also a number of other resources on our blog regarding Facebook programming, social media and WordPress (which we LOVE for site development).

    Anyway, keep up the good work!

    • Hi Tim - I'm always open to writing up a review of your site, services, and business which is a great way to get your business and content in front of the readers of this blog. Each article is also syndicated to our Facebook Fan Page and Twitter profile.

      If you'd be interested in having us do that, feel free to contact me (contact link on the right hand side bar) anytime!

      Thanks again...

      P.S. careful with your links, there is a fine line between comment spamming and contributing.

      Cheers!

  • Facebook Fan pages seem to be broken as of a couple days ago our Fan Pages posts no longer show up in Fan's news streams. Anyone have any ideas? Thanks!

  • Hi! For some reason, my image is linking itself back to facebook and I don't know why. I'd like it to link to the external site I provided in the code. Could you please tell me what I am doing wrong? Here is the code I'm using:

    <img src=". width="350" height="330" border="0" target="_blank" />

  • I don't know what I am doing wrong I have copied your code exactly for a facebook image in the fanpage but I get that little nugget that says its not there

  • Hi, thanks for a brilliant tutorial.

    I am having a lot of trouble though. I have copied your code to input an image under my new Welcome Tab, but for some reason the image is not showing up, it is just a tiny box with a cross in it. My image is 520 x 703 pixels and is an RGB image. The code I am trying to input is:

    Do you have any idea what my problem could be? When I try to input the image and link directly to the site, it doesn't show anything at all - not even the tiny box.

    This is the code I have been putting in for that:

    Any information you can give me would be most appreciated. :)

  • Got a question for you: I've added a picture to my new FBML tab and need to put a text below the picture. Unfortunately, it doesn't work. The text is always behind the pic. Can you help me? I struggle!

  • if you send me your code to email "seoscale@gmail.com" I will check it out and reply - I can't reply in comments because the comment box doesn't allow html closing tags.

Leave a Comment
Published by
SMSEO
Tags: Facebook Fan Pagefacebook pageGoogleSEO
14 years ago