Question

I have a Facebook app with which I’d like to display an image in a user’s feed. It’s just a small circle, which will be different colours depending on what the user does within my app.

Instead of creating lots of different images to display, one for each possible colour the circle could be, it would be ideal if I could put up a PNG with transparency, and then just change the colour by filling a DIV behind the image with Javascript.

However, it’s not clear to me if Facebook will allow that in the feed.

Can include some Javascript in the feed, or is that strictly forbidden?

Or is my only option to have a library of images for all the different colours and have a PHP function which selects the right one to output?

Answer 1

Facebook doesn’t allow any scriptable content within feed stories, and this isn’t possible to implement what you want this way.

You can easily create simple script that will return colored image according to passed arguments and use it as source for the image.

Something like this may provide you some points:

<?
// create a 200*200 image
$img = imagecreatetruecolor(200, 200);

// get the color from URL arguments or use default one
$rgb = isset($_REQUEST['color']) ? $_REQUEST['color'] : 'FFEEDD';

$color = array(
  base_convert(substr($rgb, 0, 2), 16, 10),
  base_convert(substr($rgb, 2, 2), 16, 10),
  base_convert(substr($rgb, 4, 2), 16, 10),
);

// allocate some colors
$white = imagecolorallocate($img, 255, 255, 255);
$red   = imagecolorallocate($img, $color[0], $color[1], $color[2]);

// draw the head
imagefilledarc($img, 100, 100, 200, 200, 0, 360, $red, IMG_ARC_PIE);

// output image in the browser
header("Content-type: image/png");
imagepng($img);

// free memory
imagedestroy($img);