增加 tumblr 照片大小答案

【问题标题】：Increase tumblr photo size增加 tumblr 照片大小
【发布时间】：2012-04-01 18:37:42
【问题描述】：

如何编辑此 html 以便自定义照片的宽度，tumblr 似乎不喜欢将照片集大小更改为更大的尺寸。我已经查过了，但不明白 maxwidth:600px 适合放在哪里，或者这是否是最好的方法。

非常感谢任何可以帮助我的人

{block:Photo}

  <div class="permalink">
    {block:IfNotDisqusShortname}<a href="{Permalink}">&rarr;</a>{block:IfNotDisqusShortname}
    {block:Date}{block:IfDisqusShortname}<a href="{Permalink}#disqus_thread"></a>{block:IfDisqusShortname}{/block:Date}
  </div>

  <div class="photo post">

    {LinkOpenTag}
      <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
    {LinkCloseTag}

    {block:Caption}
      <p>{Caption}</p>
    {/block:Caption}

    <div class="postmeta">{block:Date}<a href="{Permalink}">{TimeAgo}</a>&nbsp; {/block:Date}<a href="{Permalink}" style="text-transform:lowercase;">{lang:Notes} ({NoteCount})</a></div>

  </div>

  {block:PostNotes}
    <div>{PostNotes}</div>
  {/block:PostNotes}

{/block:Photo}

【问题讨论】：

您能否澄清您是否尝试更改照片（一张图片）或照片集（多张图片）帖子的外观。 Tumblr 处理两者不同，因此答案会有所不同。

标签： html image photo tumblr css

【解决方案1】：

从500px 放大使其更加模糊。 Tumblr 确实存储了比500px 更宽的图像副本。它被称为HighRes，它（最多）是1280px。

例如，在您的主题 HTML 中，将 photoURL-500 替换为 photo-HighRes，然后调整大小。

在我的主题中，我是这样使用它的：

{block:PermalinkPage}<a href="{PhotoURL-HighRes}">{/block:PermalinkPage}
<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" {block:IndexPage}width="435px"
{/block:IndexPage}{block:PermalinkPage}width="900px"{/block:PermalinkPage}/>

它将索引的 1280 像素缩小到 435 像素，将永久链接页面缩小到 900 像素，如下所示：http://phillypraxis.tumblr.com/tagged/images

【讨论】：

虽然这会给你想要的效果，但你发送一个 1280 像素宽的图像来完成 500 像素图像的工作。

【解决方案2】：

如果我理解你的问题，你可以简单地在图像标签的 alt 属性之前添加 width="600"：

<img src="{PhotoURL-500}" width="600" alt="{PhotoAlt}"/>

【讨论】：

@Philip 我已经添加了代码。我以前没有这样做，因为我使用的是移动设备。

【解决方案3】：

在 slidestheme.tumblr.com 上查看这一行的源代码：

enter code herereplaceRawPhotoLinks: function() {
      $("article.photo div.media a[href*='/photo/1280']").each(function() {`enter code here`

【讨论】：

代码是不完整的，对这个实际的作用的解释为零。