Dynamic filter bar using tag links in tumblr -


i have 10 links 10 tagpages, when clicked take page posts tag.

that’s easy enough.

i’d know if possible stack more 1 tagged post in page. example when “red” tagged posts showing can click , load in “blue” tagged posts without leaving page.

the 10 links behave filtering system. can show combination of tagged posts in 1 page… click once , load them in, click again hide posts.

i hope makes sense.

any great. thanks.

you can load in posts tag tumblr's api: http://www.tumblr.com/docs/en/api/v2#posts

the call each of tags (square brackets marking areas you'll need change):

url = http://api.tumblr.com/v2/blog/[base-hostname]/posts?api_key=[key]&tag=[tagname]&jsonp=?  $.ajax(url, {   type: 'get',   datatype: 'json',   success: function(data) {     // data   } }); 

updated more specific example:

you'd need create function each click of tag navigation. let's built out navigation in simple html, you'd want create function each of clicks.

hmtl:

<nav class="tag-nav>     <ul>         <li><a href="/tagged/portrait" class="portrait">portrait</a></li>         <li><a href="/tagged/landscape" class="landscape">landscape</a></li>     </ul> </nav> 

js:

$('.tag-nav a').on('click', function (e) {     e.preventdefault();      // grab classname link clicked     var tagname = $(this).attr('class');      // go our tagged posts     gettaggedposts(tagname); });  var gettaggedposts = function (tag) {     // ajax call go      // bonus points if check see if you've made ajax call     // , stored posts somewhere else on page }; 

Comments

Popular posts from this blog

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -

node.js - Bad Request - node js ajax post -