Html 增加tumblr照片大小
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9967111/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Increase tumblr photo size
提问by Philip
How do I edit this html so I can customize the width of a photo, tumblr doesn't seem to like changing the photo set size to anything bigger. I have looked up, but don't understand where a maxwidth:600px
would fit in or if this is even the best way to do it.
如何编辑此 html 以便我可以自定义照片的宽度,tumblr 似乎不喜欢将照片集大小更改为更大的大小。我查了一下,但不明白 amaxwidth:600px
适合在哪里,或者这是否是最好的方法。
Massive thanks to anyone who can help me out
非常感谢任何可以帮助我的人
{block:Photo}
<div class="permalink">
{block:IfNotDisqusShortname}<a href="{Permalink}">→</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> {/block:Date}<a href="{Permalink}" style="text-transform:lowercase;">{lang:Notes} ({NoteCount})</a></div>
</div>
{block:PostNotes}
<div>{PostNotes}</div>
{/block:PostNotes}
{/block:Photo}
回答by user1593984
Enlarging from 500px
makes it blurrier. Tumblr does actually store a copy of your image wider than 500px
. It's called HighRes
, and it's (up to) 1280px
.
放大500px
使其更模糊。Tumblr 实际上存储的图像副本宽度大于500px
. 它被称为HighRes
,它是(最多)1280px
。
In your theme HTML, Replace photoURL-500
with photo-HighRes
, for example, and resize from that.
在您的主题HTML,替换photoURL-500
用photo-HighRes
,例如,并从调整。
In my theme, I use it like so:
在我的主题中,我像这样使用它:
{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}/>
It shrinks the 1280px down to 435px for the index and shrinks it to 900px for the permalink page, as seen here: http://phillypraxis.tumblr.com/tagged/images
它将索引的 1280 像素缩小到 435 像素,并将永久链接页面的缩小到 900 像素,如下所示:http://phillypraxis.tumblr.com/tagged/images
回答by user1301428
If I understand your question, you could simply add width="600" before the alt attribute of the image tag:
如果我理解你的问题,你可以简单地在图像标签的 alt 属性之前添加 width="600" :
<img src="{PhotoURL-500}" width="600" alt="{PhotoAlt}"/>
回答by kant
Check on the slidestheme.tumblr.com, on the source code for this line:
在 slidestheme.tumblr.com 上查看此行的源代码:
enter code herereplaceRawPhotoLinks: function() {
$("article.photo div.media a[href*='/photo/1280']").each(function() {`enter code here`