CODEWITHSUNDEEP
htmlpostlimittumblr
Aram Mkrtchyan
Aram Mkrtchyan

Reputation: 2700

Tumblr template showed posts limit

i'm new in Tumblr and I need help.

{block:Posts}
   {block:HasTags}
      {block:Tags}
           <li><a class="meta-item tag-link" href="{TagURL}">#{Tag}</a></li>
      {/block:Tags}
   {/block:HasTags}
{/block:Posts}

This part show all hash tags but i need to show 10 tags only. how can I add some limit on {block:Posts}

Upvotes: 1

Views: 285

Answers (2)

lharby
lharby

Reputation: 3265

As the others have mentioned Tumblr does not appear to have a solution for this.

You can use a jquery solution below. Most tumblr themes include jquery, if yours doesn't it is relatively easy to install.

Here is a very straightforward jquery solution:

1: JSFIDDLE

 $('.tag-link:gt(9)').hide();

It simply says, find every href which has a class of tag-link and hide anything above 10. This will probably only show the first 10 tag-links on the whole page, so you may need to modify this, at a guess it would look something like this:

 $('.post .tag-links:gt(9)').hide();

And here is a pure css solution (although it won't work in IE7 or less)

2: JSFIDDLE

The css looks like this: 

 li:nth-child(n+11) {
    display: none;   
 }

And that should work for every post on the page I believe.

Hopefully one of these solutions can help. If you need more info maybe we need to see your theme, or some of your code, but you can also play around with the jsfiddles.

Addendum: Have a look at this, this talks about the full tag list. https://webapps.stackexchange.com/questions/20616/is-there-a-limit-to-the-number-of-tags-tumblr-can-remember

Upvotes: 1

mikedidthis
mikedidthis

Reputation: 4897

@Ally is correct. The {block:Posts} is used to render posts, in a loop. You can't use it to limit tags.

One way with CSS:

.tags li {
    display: none;
}
.tags li:nth-child( -n+10 ) {
    display: inline
}

Upvotes: 2

Related Questions