I am trying to embed the Flickr Flash badge into the footer on my site by directly adding the code to a block, then displaying it in the footer. However, all it displays is the beginning and ending comments and the word flickr. I'm assuming this is a javascript issue and the input format? I am NOT using an HTML filter. The input format is set to "Full HTML".

Related:
http://drupal.org/node/234859
http://drupal.org/node/222926
http://www.flickr.com/badge.gne

This is the Flickr code:

<!-- Start of Flickr Badge -->
<style type="text/css">
.zg_div {margin:0px 5px 5px 0px; width:117px;}
.zg_div_inner {border: solid 1px #5A9A98; background-color:#FFFFFF;  color:#666666; text-align:center; font-family:arial, helvetica; font-size:11px;}
.zg_div a, .zg_div a:hover, .zg_div a:visited {color:#993333; background:inherit !important; text-decoration:none !important;}
</style>
<script type="text/javascript">
zg_insert_badge = function() {
var zg_bg_color = 'FFFFFF';
var zgi_url = 'http://www.flickr.com/apps/badge/badge_iframe.gne?zg_bg_color='+zg_bg_color+'&zg_person_id=32340984%40N07';
document.write('<iframe style="background-color:#'+zg_bg_color+'; border-color:#'+zg_bg_color+'; border:none;" width="113" height="151" frameborder="0" scrolling="no" src="'+zgi_url+'" title="Flickr Badge"><\/iframe>');
if (document.getElementById) document.write('<div id="zg_whatlink"><a href="http://www.flickr.com/badge.gne"	style="color:#993333;" onclick="zg_toggleWhat(); return false;">What is this?<\/a><\/div>');
}
zg_toggleWhat = function() {
document.getElementById('zg_whatdiv').style.display = (document.getElementById('zg_whatdiv').style.display != 'none') ? 'none' : 'block';
document.getElementById('zg_whatlink').style.display = (document.getElementById('zg_whatdiv').style.display != 'none') ? 'none' : 'block';
return false;
}
</script>
<div class="zg_div"><div class="zg_div_inner"><a href="http://www.flickr.com">www.<strong style="color:#3993ff">flick<span style="color:#ff1c92">r</span></strong>.com</a><br>
<script type="text/javascript">zg_insert_badge();</script>
<div id="zg_whatdiv">This is a Flickr badge showing public photos and videos from <a href="http://www.flickr.com/photos/32340984@N07">السلام</a>. Make your own badge <a href="http://www.flickr.com/badge.gne">here</a>.</div>
<script type="text/javascript">if (document.getElementById) document.getElementById('zg_whatdiv').style.display = 'none';</script>
</div>
</div>
<!-- End of Flickr Badge -->

and the code that is generated by Drupal:

<div class="content"><p><!-- Start of Flickr Badge --></p>
<style type="text/css">
.zg_div {margin:0px 5px 5px 0px; width:117px;}
.zg_div_inner {border: solid 1px #5A9A98; background-color:#FFFFFF;  color:#666666; text-align:center; font-family:arial, helvetica; font-size:11px;}
.zg_div a, .zg_div a:hover, .zg_div a:visited {color:#993333; background:inherit !important; text-decoration:none !important;}
</style><script type="text/javascript">
zg_insert_badge = function() {
var zg_bg_color = 'FFFFFF';
var zgi_url = 'http://www.flickr.com/apps/badge/badge_iframe.gne?zg_bg_color='+zg_bg_color+'&zg_person_id=32340984%40N07';
document.write('<iframe style="background-color:#'+zg_bg_color+'; border-color:#'+zg_bg_color+'; border:none;" width="113" height="151" frameborder="0" scrolling="no" src="'+zgi_url+'" title="Flickr Badge">&lt;\/iframe>');
if (document.getElementById) document.write('<div id="zg_whatlink"><a href="http://www.flickr.com/badge.gne"	style="color:#993333;" onclick="zg_toggleWhat(); return false;">What is this?&lt;\/a>&lt;\/div>');
}
zg_toggleWhat = function() {
document.getElementById('zg_whatdiv').style.display = (document.getElementById('zg_whatdiv').style.display != 'none') ? 'none' : 'block';
document.getElementById('zg_whatlink').style.display = (document.getElementById('zg_whatdiv').style.display != 'none') ? 'none' : 'block';
return false;
}
</a></div></iframe></script><div class="zg_div">
<div class="zg_div_inner"><a href="http://www.flickr.com">www.<strong style="color: rgb(57, 147, 255);">flick<span style="color: rgb(255, 28, 146);">r</span></strong>.com</a><br/>
<script type="text/javascript">zg_insert_badge();</script><div id="zg_whatdiv" style="display: none;">This is a Flickr badge showing public photos and videos from <a href="http://www.flickr.com/photos/32340984@N07">السلام</a>. Make your own badge <a href="http://www.flickr.com/badge.gne">here</a>.</div>
<script type="text/javascript">if (document.getElementById) document.getElementById('zg_whatdiv').style.display = 'none';</script></div>
</div>
<p><!-- End of Flickr Badge --></p>
</div>

Comments

allanmayberry’s picture

have you tried setting it to PHP instead of Full HTML?

finedesign’s picture

Thanks! I actually hadn't enabled the PHP module and so I didn't have that option. Works great now.

allanmayberry’s picture

No problem, I found quite alot that if you are including any scripting or anything like that then you are usually better to use full PHP, I think it has something to do with HTML filters in place for Drupal...

idesign’s picture

Had the same problem and after several hours of research, I found the solution to several issues I have been experiencing in this post regarding "PHP code" in the Text Format rather than "Full HTML."