Skip navigation
Currently Being Moderated

jQuery Flicker Feed Plugin Help

Jan 27, 2013 2:44 AM

Tags: #html #css #flickr_publishing #jquizme_plugin

Hi

 

Im trying to use this plugin from http://www.gethifi.com/blog/a-jquery-flickr-feed-plugin on my website at http://danielwaddon.com/ but cant seam to get it working.

 

Its in the bottom of the website. any information as to what im doing wrong and what I need to do?

 

Thanks

Daniel

 
Replies
  • Currently Being Moderated
    Jan 27, 2013 1:16 PM   in reply to Daniel Waddon

    You might want to fix your code errors before you add any more stuff to your page. 

    http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fdanielwaddon. com%2F

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 27, 2013 1:30 PM   in reply to Daniel Waddon

    Vendor specific CSS properties are not the problem and you can safely skip those warnings.

     

    However you have other more serious errors such as closing tags that don't match your document type, re-using IDs, <script> tags without type, etc...  Until you sort out all the code errors, it's very hard to trouble shoot new problems.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 27, 2013 1:41 PM   in reply to Daniel Waddon

    Simply ignore warnings about vender-specific pre-fixes (-moz, -webkit, -ms, -o). 

    Concentrate on your other 37 code errors.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 27, 2013 2:07 PM   in reply to Daniel Waddon

    You're getting there...

     

    On line 99, replace this:

    <div class="contentinformation" id="Webdesign">^

     

    with this:

    <div class="contentinformation">

     

    On line 106, replace this:

    <div class="contentinformation" id="Ecommercedesign">^

     

    with this:

    <div class="contentinformation">

     

    On line 120, replace this:

    <div class="contentinformation" id="logodesign">^

     

    with this:

    <div class="contentinformation">

     

    Also, go to Commands > Spell check in DW.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 27, 2013 2:35 PM   in reply to Daniel Waddon

    First, I see conflicting jQuery libraries in your<head> tags. 

     

    Your Flicker Feed plugin requires 1.4.2.  I don't know if it will work with other versions of jQuery.  So try changing your jQuery library to this one.

     

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

     

    Secondly,  your FlickerFeed code needs to be wrapped inside <ul> and <script> tags like this:

     

    <p>Flicker Feed</p>

    <ul>

    <script type="text/javascript">

    $(document).ready(function(){

    $('#basicuse').jflickrfeed({

        limit: 14,

        qstrings: {

            id: '41616368@N03'

        },

        itemTemplate:

        '<li>' +

            '<a href="{{image_b}}"><img src="{{image_s}}" alt="{{title}}"></a>' +

        '</li>'

         });

    });

      </script>

    </ul>

     

     

    Hope it works for you!

     

    Nancy O.

     


     
    |
    Mark as:
  • Currently Being Moderated
    Jan 27, 2013 3:07 PM   in reply to Daniel Waddon
     
    |
    Mark as:
  • Currently Being Moderated
    Jan 27, 2013 3:21 PM   in reply to Daniel Waddon

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 27, 2013 3:28 PM   in reply to Daniel Waddon

    Yes.

     

    N

     
    |
    Mark as:
  • Currently Being Moderated
    Jan 30, 2013 11:27 AM   in reply to Daniel Waddon

    Use CSS to style the .odd and .even flickrRow classes.

     

    .odd {

    list-style: none;

    clear: left;

    float: left;

    width: auto;

    }

     

    .even {

    list-style: none;

    float: left;

    margin-left: 25px;

    width: auto;

    }

     

    Sample HTML:

     

    <div id="test" class="flickrFeed">

    <ul>

    <li class="flickrRow odd"><img src="image1.jpg"/></li>

    <li class="flickrRow even"><img src="image2.jpg"/></li>

    <li class="flickrRow odd"><img src="image3.jpg"/></li>

    <li class="flickrRow even"><img src="image4.jpg"/></li>

    </ul>

    </div>

     

     

    Nancy O.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points