3

你好- 我一直在玩 tumblr 照片集，目前我正在使用基于砖石的主题。对于照片集，我希望只在索引页面上显示照片集的第一张图像，但在永久链接页面上，我希望显示照片集的所有图像。谢谢

4

4 回答 4

8

我发现的最简单和最有效的方法是在第一张照片后打开评论标签，并在添加所有照片后关闭它。

{block:Photoset}
    {block:Photos}
        <img src="{PhotoURL-HighRes}" class="highres">
        <!--
    {/block:Photos}
    -->
{/block:Photoset}

这将注释掉所有后续照片。这样做的好处是它不需要任何 CSS 或 JS，而且它不会因为加载照片集中的所有图像而浪费带宽。

于 2015-01-22T01:09:52.110 回答
7

可悲的是，由于 Tumblr 缺乏模板逻辑，无论如何不可能在索引页面上显示照片集的第一张图像，无论如何。

但是有两种可能的解决方案：

  1. 使用 CSS 隐藏索引页面上照片集的第一张图片以外的所有内容。（请注意，无论如何都会下载所有图像）。
  2. 不要在索引页面上包含任何照片集的图像，而是使用 Tumblr API ( http://www.tumblr.com/docs/en/api/v2 ) 请求第一张图像。

AFAIK 没有其他方法可以实现这一目标。

于 2013-04-30T12:40:37.637 回答
3

您只需要根据您是在索引还是永久链接上来调整显示方式。在索引上，您将遍历所有照片并通过 CSS 隐藏除第一张以外的所有照片。

首先，您将添加一个 CSS 挂钩，以便您知道您在索引页面上（无论如何都应该这样做）：

<body class="{block:IndexPage}index-page{/block:IndexPage}">

照片集块：

{block:Photoset}
    {block:IndexPage}
        <div class="photos">
        {block:Photos}
            <img alt="" src="{PhotoURL-500}">
        {/block:Photos}
        </div>
    {/block:IndexPage}

    {block:PermalinkPage}
        {Photoset-500}
    {/block:PermalinkPage}
{/block:Photoset}

CSS：

.index-page .photos img {
    display: none;
}

.index-page .photos img:first-child {
    display: block;
}
于 2013-04-30T18:08:31.767 回答
0

I came here googeling for an answer and found an answer myself. What I did was upload the images to imgur. I then added a picturepost in Tumblr and in the HTML of the description I put the rest of the images.

Hope it helps the next one looking for an answer.

于 2014-09-23T11:13:01.373 回答