Oct 30, 2014 in Social & RSS 4017 views
Dribbble - Grab Dribbble feed with jQuery and Handlebars
Source: github.com
1. INCLUDE JS FILES
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.rc.1/handlebars.min.js"></script> <script type="text/javascript" src="src/dribbble.js"></script>
2. HTML
<script id="shots-template" type="text/x-handlebars-template">
{{#each this}}
<div class="shots">
<a title="{{title}}" href="{{link}}" target="_blank"><img alt="{{title}}" src="{{image}}" /></a>
<h3><a title="{{title}}" href="{{link}}" target="_blank">{{title}}</a></h3>
</div>
{{/each}}
</script>
Change the HTML as it deems necessary.
3. JAVASCRIPT
Dribbble.init({
template: $('#shots-template').html(), // The ID of your template
container: $('#container'), // domNode to attach to
username: 'rogie', // Dribbble username
count: 32 // Number of shots to display. Maximum 50
});
Tagged with:
dribbble
dribbble feed
grab dribbble
grab feed
handlebars
grab dribbble feed
jquery plugin
Related Articles
JS Tutorial