CODEWITHSUNDEEP
tumblr
Damian
Damian

Reputation: 5561

In tumblr, show only posts with a certain tag in the home page

In tumblr, is it possible to show only posts with a certain tag in the home page?
If so, how is it done?

Upvotes: 5

Views: 42450

Answers (8)

nathfy
nathfy

Reputation: 717

I realise this is old, but I've just had to do it, so here is my solution. At the end of the theme, in the script tags add:

{block:IndexPage}
        $( ".the-posts" ).load( "tagged/home .the-posts article" );
{/block:IndexPage}

Where home is the tag you have given the posts you wish to see on the index page. This will basically load the correct articles into the posts div, replacing what it there. See the jquery man page: http://api.jquery.com/load/ for more info.

Upvotes: 0

user3518948
user3518948

Reputation: 41

Using mircealungu's suggestion worked perfectly for me! Here's how I did it:

1. Find the article tag, and add the classname:

class="notfeatured {TagsAsClasses}"

If it already has a classname, add the part in bold above inside the classname quotes. Mine ended up looking like this:

<article id="{PostID}" class="post notfeatured {TagsAsClasses} {PostType}{block:PermalinkPage} {block:Date}not-{/block:Date}page{/block:PermalinkPage}">

2. Find the div tag that precedes the article tag, and add the classname:

class="{block:TagPage} tag_page {/block:TagPage}{block:PermalinkPage}perma_page{/block:PermalinkPage}"

Again, if a class already exists, just add the part in bold above inside the classname quotes. Mine ended up like this:

<div id="posts" class="{block:TagPage} tag_page {/block:TagPage}{block:PermalinkPage}perma_page{/block:PermalinkPage}" >

3. Finally, add this to your CSS:

article.notfeatured {display: none;}
article.featured, .tag_page article.notfeatured, .perma_page article.notfeatured {display: block;}

Now any post tagged as "featured" will display on your home page, but nothing else. So far no issues for me, it works great! You can see it here.

You can also use javascript to reorder the display so you can make the featured posts appear first in a list. The script is very simple:

$('article.featured').prependTo('#posts');

And here is a demo. Just place that inside javascript tags and put it right before the /body tag in your theme. In this case don't use the CSS above, because you don't want to hide the posts. I implemented a .top class for the script and kept the .featured class for the CSS, and I use both the CSS and the script.

Upvotes: 4

Preston159
Preston159

Reputation: 302

I know that this topic is quite old, but I figured I'd share what I did for anyone who is still looking for an answer to this problem.

First, paste the following code after the "</title>" in your theme HTML.

<meta name="text:Default Tag" content="" />

Next, right after the "<body>" in your theme's HTML, paste the following:

{block:IndexPage}<script type="text/javascript">
    var url = location.href;
    if (url == "{BlogURL}") {
        window.location = "{BlogURL}tagged/{text:Default Tag}";
    }
</script>{/block:IndexPage}

In your theme settings, you should see a box labeled "Default Tag". Put the tag you'd like posts to appear for in that box (without a hashtag) and click save.

Now, if someone visits your blog, it will forward them to the page that shows posts with your specified tag. Of course, this probably isn't the best way of doing it, but it's the best way I could come up with that wouldn't mess up themes.

Another thing I like about this way of doing this, is that you can send someone your blog URL with a "/?" appended to it (e.g. "myblog.tumblr.com/?") and it will show all of your posts.

Upvotes: 7

Tomer Almog
Tomer Almog

Reputation: 3868

I have tried many ways to do this, using tumblr php api and other, This worked for me: I am using a page outside tumblr and loading the tagged posts via curl php calls. It can be done via ajax but for SEO reasons I wanted to use php. Here is the code:

$oath = 'xxx';
$blogName = 'yyy.tumblr.com';
$tag='tagname';
$apiLink = "http://api.tumblr.com/v2/blog/$blogName/posts/?api_key=$oath&tag=$tag";




// Initializing curl
$ch = curl_init( $apiLink );

// Configuring curl options
$options = array(
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_HTTPHEADER => array('Content-type: application/json') ,
);

// Setting curl options
curl_setopt_array( $ch, $options );

// Getting results
$result =  curl_exec($ch); // Getting JSON result string

$data = json_decode($result);


$posts = $data->response->posts;

Upvotes: 0

Ricky Boyce
Ricky Boyce

Reputation: 1806

Im sorry to say, with their existing theme options as of today, you cannot achieve this without horribly ruining your seo reputation.

Upvotes: 0

mircealungu
mircealungu

Reputation: 6981

I just wrote up the solution to the opposite problem here:

You can take inspiration from there and implement the opposite. Alternatively, you can simply add a "hidden" tag to each one of the things that you don't want displayed on the homepage.

Upvotes: 7

dsherv
dsherv

Reputation: 81

Actually, it is possible, but it might not work how you want.

1st. Identify the id of your individual posts (usually something like #post or #entry, lets call yours #entry)

2nd. Replace your opening post div with this: 2nd. Add this bit of css

{block:IndexPage}
#entry (or whatever name it is) {display:none}
.featured {display:inline !important}
{/block:IndexPAge}

3rd. Tag all the posts you want to show on your homepage without quotes as "featured"

This should work, but it will most likely hide all the non "featured" posts on your search page and tag page as well, which you may not want.

If you want your users to be directed to a specific 'splashpage' when they visit your blog, you could always use a jquery redirect script. Hope some of this helped!

Upvotes: 0

unor
unor

Reputation: 96567

Tumblr’s Custom Themes don’t provide such a functionality.

You could use JS or CSS to (visually) hide all posts without a specific tag on the index page, but that way you won’t have the full 10 (or whatever you configured) posts per page anymore.

You could probably use Tumblr’s API to create a list of matching posts (with Javascript) and display that content instead of the default posts (so your custom theme would only contain the script for the index page content). You would have to make sure that the pager still works, though.

Upvotes: 1

Related Questions