tumblr - 在 Tumblr 中选择一个 'featured' 帖子？

Question

我希望我的 Tumblr 主页显示一个由“精选”标签选择的问题/答案帖子，或者更确切地说是标记为“精选”的最新问题/答案帖子。我没有看到任何内置的 Tumblr 标签可以做到这一点。

Answer 1

默认情况下，我正在使用 jQuery 从“精选”类别中获取精选帖子(其中 n 个)。我已经为我的主题实现了这个解决方案 - Purely

这是一个屏幕截图(显示三个特色帖子)

添加这一行的元部分

<meta name='text:Featured Tag' content='featured' />

在中添加 jQuery 库

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>

在要显示特色帖子的位置添加这些行

{block:IndexPage}
 {block:IfFeaturedTag}
   <h1 class="featured-subhead">
     Featured Posts <a href="/tagged/{text:Featured Tag}"> + </a>
   </h1>
 {/block:IfFeaturedTag}
{/block:IndexPage}

在结束标记之前添加这些行

{block:IndexPage}{block:IfFeaturedTag}
<script>
    var rssurl = '/tagged/{text:Featured Tag}/rss';
    $.get(rssurl, function(data) {
    $('.featured-subhead').append('<div class="featured-posts">');
    var $xml = $(data);
    var vari = 0;
    $xml.find("item").each(function() {
        var $this = $(this),
            item = {
                title: $this.find("title").text(),
                link: $this.find("link").text(),
                description: $this.find("description").text(),
                pubDate: $this.find("pubDate").text(),
                author: $this.find("author").text()
        }
        vari = vari +1;
        if(vari <4){
        $('.featured-subhead').append('<div class="featured-post" style="overflow:hidden;"><h2 class="featured-title"><a href="' + item.link + '">' + item.title + '</a></h2><div class="featured-post-description' + vari + '">' + item.description + '</div><div class="featured-post-link"><a href="' + item.link + '">Read More</a></div></div>');
        //Do something with item here...
        }
    });
    $('.featured-subhead').append('</div>');
});
{/block:IndexPage}{/block:IfFeaturedTag}

您可以根据要显示为特色的帖子数量更改 if(vari <4){ 行。例如，要显示单个帖子，它将是 if(vari <2){ 。

我还添加了一些 CSS 类来设计输出。这可以在段中声明

h1.featured-subhead
{
/* Heading of featured post */
}
.featured-posts
{
/* Outer box of all featured posts */
}
.featured-post
{
/* Inner box of each featured post */
}
h2.featured-title
{
/* Heading of each featured post */
}
.featured-post-description
{
/* Description or body of each featured post */
}
.featured-post-link
{
/* Link to Permalink page of each featured post */
}

这里只需要特色副标题类。这必须添加到特色帖子的标题中。 jQuery 将在此之后添加特色帖子。

它是如何工作的？
这里没有惊喜。 Tumblr 为每个页面生成一个标签 RSS 页面。通过使用 javascript，我正在获取该特定标记页面并从 XML 元素中显示“n”个元素。有时，Tumblr 需要多一点时间(我不知道为什么)来生成新添加标签的 RSS 页面。请耐心并尝试浏览 your-blog.tumblr.com/tagged/featured/rss 页面以检查它是否生成。