Jump to:

5453 Posts in 1674 Topics by 1198 members

Customising the CMS

SilverStripe Forums » Customising the CMS » Trying to add flickr badge and getting this error.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1 2
Go to End
Author Topic: 1943 Views
  • Daimz
    Avatar
    Community Member
    36 Posts

    Trying to add flickr badge and getting this error. Link to this post

    Firefox is giving me this error:

    XML Parsing Error: not well-formed
    Location: http://www.arctosdesign.com/silverstripe/
    Line Number 158, Column 106://]]></script><script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=3&display=latest&size=s&layout=x&source=user&user=28322286%40N08"></script>
    ---------------------------------------------------------------------------------------------------------^

    And this is what Safari says:

    This page contains the following errors:
    error on line 140 at column 1837: EntityRef: expecting ';'
    Below is a rendering of the page up to the first error.

    I am trying to add a flickr badge from Flickr but I am getting this error. I am no coder but I think it means that there is a problem with the = symbol in the link. Does any one know how to solve it.
    would really appreciate any help.

  • banal
    Avatar
    Community Member
    901 Posts

    Re: Trying to add flickr badge and getting this error. Link to this post

    No, it's not the =. It's the ampersand. In XML (or XHTML for that matter), you have to encode it like this: &amp;
    So, replace all the & in your link url with &amp; that should fix the problem

  • Daimz
    Avatar
    Community Member
    36 Posts

    Re: Trying to add flickr badge and getting this error. Link to this post

    I fixed the &amp; but it still doesn't work.

    this is how I currently have it.

    <div id="flickr_badge_uber_wrapper">
    <div id="flickr_badge_wrapper">
    <script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=4&amp;display=latest&amp;size=s&amp;layout=x&amp;source=user&amp;user=28322286%40N08"></script>
    </div></div>

  • banal
    Avatar
    Community Member
    901 Posts

    Re: Trying to add flickr badge and getting this error. Link to this post

    Are you sure that URL is correct? If I open that in the browser, the returned JavaScript won't generate any visible elements... it does however add some invisible elements to the page (you can verify that using firebug

  • Daimz
    Avatar
    Community Member
    36 Posts

    Re: Trying to add flickr badge and getting this error. Link to this post

    well if I go into the DOM section of firebug(I don't really know how to use firebug I have very little coding knowledge and I am trying to learn) I can see this:

    "<div class="flickr_badge_image" id="flickr_badge_image1"><a href="http://www.flickr.com/photos/retrocity/3612043955/"><img src="http://farm3.static.flickr.com/2422/3612043955_d6a46f10da_s.jpg" alt="A photo on Flickr" title="rarotonga_dinner-4" height="75" width="75"></a></div><div class="flickr_badge_image" id="flickr_badge_image2"><a href="http://www.flickr.com/photos/retrocity/3612858126/"><img src="http://farm4.static.flickr.com/3316/3612858126_0afcb7fd2e_s.jpg" alt="A photo on Flickr" title="rarotonga_dinner-3" height="75" width="75"></a></div><div class="flickr_badge_image" id="flickr_badge_image3"><a href="http://www.flickr.com/photos/retrocity/3612043447/"><img src="http://farm4.static.flickr.com/3620/3612043447_cc082cf7f5_s.jpg" alt="A photo on Flickr" title="rarotonga_dinner-2" height="75" width="75"></a></div><div class="flickr_badge_image" id="flickr_badge_image4"><a href="http://www.flickr.com/photos/retrocity/3612857528/"><img src="http://farm4.static.flickr.com/3320/3612857528_5619567dd5_s.jpg" alt="A photo on Flickr" title="rarotonga_dinner-1" height="75" width="75"></a></div><span style="position:absolute;left:-999em;top:-999em;visibility:hidden" class="flickr_badge_beacon"><img src="http://geo.yahoo.com/p?s=792600102&t=d4a03345bad290dbe3993cde2947ab2f&r=http%3A%2F%2Fwww.arctosdesign.com%2Fsilverstripe%2F&fl_ev=0&lang=en&intl=uk" width="0" height="0" alt="" /></span>"

    which shows that it is getting hold of my images because those are linking to the right place there just not showing on my page?

  • Daimz
    Avatar
    Community Member
    36 Posts

    Re: Trying to add flickr badge and getting this error. Link to this post

    I have a feeling the problem is here:

    <span style="position:absolute;left:-999em;top:-999em;visibility:hidden" class="flickr_badge_beacon"><img src="http://geo.yahoo.com/p?s=792600102&t=d4a03345bad290dbe3993cde2947ab2f&r=http%3A%2F%2Fwww.arctosdesign.com%2Fsilverstripe%2F&fl_ev=0&lang=en&intl=uk" width="0" height="0" alt="" /></span>

    I checked all the liked thumbnails and they are correct the only thing not producing anything is this link.
    Potentially I am way off.

  • banal
    Avatar
    Community Member
    901 Posts

    Re: Trying to add flickr badge and getting this error. Link to this post

    Hm the content you get there looks ok to me. Do you get any errors in the Firebug console? And how did you style the surrounding divs? Are you sure none of them has "visibility: hidden" or "display: none" ?

  • Daimz
    Avatar
    Community Member
    36 Posts

    Re: Trying to add flickr badge and getting this error. Link to this post

    The surrounding Divs have the following styles:

    #flickr {
       height: 308px;
       width: 311px;
       float: right;
       margin-right: 7px;
       padding-top: 13px;
       padding-bottom: 12px;
       padding-left: 0px;
    }
    #flickr_header {
       background-image: url(../images/flickr.jpg);
       background-repeat: no-repeat;
       height: 23px;
       width: 193px;
       background-position: left top;
       margin-left: 10px;
    }
    #flickr_container {
       background-image: url(../images/flicker_bg.jpg);
       background-repeat: no-repeat;
       background-position: left top;
       height: 267px;
       width: 258px;
       margin-left: 26px;
       margin-top: 10px;
    }
    .flickr_img{
       width: 252px;
       margin-left: 1px;
       position: relative;
       padding-top: 3px;
    }
    #flickr_r {
       width:214px;
       height: 168px;
       padding:0 0 0 50px;
       margin-top:0px;
       }
    div#flickr_r a img {
       float:left;
       background: #ffffff;
       margin:0 4px 4px 0px;
       padding:4px;
       width:75px;
       height:75px;
       }
       div#flick_r a img {
       background: #555555;
       }
    div#flickr_r img[src*="http://geo.yahoo.com"] { display:none }

    I found these links explaining a similar problem.
    http://www.teddy-o-ted.com/design/fix-for-buggy-flickr-badge-js/
    http://veerle.duoh.com/blog/comments/fickr_badge_w3c_valid/
    and I followed as they said but still no images.

    it seems as though my problem might lie in the creation of a <span> also the links above suggested chaning the standard flickr badge CSS which I did but I notice bellow it is still using <div id="flickr_badge_image"> which I have no css for?

    var b_txt = '';
    2
    3// write the badge
    4
    5
    6
    7 b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image1"><a href="http://www.flickr.com/photos/retrocity/3612043955/"><img src="http://farm3.static.flickr.com/2422/3612043955_d6a46f10da_s.jpg" alt="A photo on Flickr" title="rarotonga_dinner-4" height="75" width="75"></a></div>';
    8
    9
    10 b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image2"><a href="http://www.flickr.com/photos/retrocity/3612858126/"><img src="http://farm4.static.flickr.com/3316/3612858126_0afcb7fd2e_s.jpg" alt="A photo on Flickr" title="rarotonga_dinner-3" height="75" width="75"></a></div>';
    11
    12
    13 b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image3"><a href="http://www.flickr.com/photos/retrocity/3612043447/"><img src="http://farm4.static.flickr.com/3620/3612043447_cc082cf7f5_s.jpg" alt="A photo on Flickr" title="rarotonga_dinner-2" height="75" width="75"></a></div>';
    14
    15
    16 b_txt+= '<div class="flickr_badge_image" id="flickr_badge_image4"><a href="http://www.flickr.com/photos/retrocity/3612857528/"><img src="http://farm4.static.flickr.com/3320/3612857528_5619567dd5_s.jpg" alt="A photo on Flickr" title="rarotonga_dinner-1" height="75" width="75"></a></div>';
    17
    18
    19b_txt += '<span style="position:absolute;left:-999em;top:-999em;visibility:hidden" class="flickr_badge_beacon"><img src="http://geo.yahoo.com/p?s=792600102&t=88be7833b0bb72e29c60df2eeac20052&r=http%3A%2F%2Fwww.arctosdesign.com%2Fsilverstripe%2F&fl_ev=0&lang=en&intl=uk" width="0" height="0" alt="" /></span>';
    20
    21document.write(b_txt);

    1943 Views
Page: 1 2
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.