本文介绍了你能根据标签自定义 Tumblr 帖子的格式吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
做一个自定义的 Tumblr 主题,将混合常见的 Tumblr 帖子类型(文本、图片、链接等).
我还想偶尔做一个特殊的帖子类型,以展示我的摄影作品,但我不想调整它的大小,而是希望以高分辨率完整展示照片主题的宽度(大约 1140px 宽).
我读过 {block:HighRes} {/block:HighRes},但似乎这是为了让 500 像素的图像点击进入原始图像.
有没有办法为这些特定的精选摄影帖子禁用这种自动调整大小?也许是一种基于帖子标签改变行为的方法?(例如,如果它有#photography"标签,则以全分辨率显示 - 如果没有,请继续将其大小调整为 500 像素宽).
这是我正在尝试做的可视化示例:http://i.imgur.com/23p09.jpg
解决方案
您可以使用 {TagsAsClasses}
例如对于这个 tumblr 标记:
{block:Posts}<div class="entry {TagsAsClasses}">发布内容
{/block:帖子}
和 3 个带有此标签的帖子:
- 照片、照片高分辨率
- 照片,低分辨率照片
- 照片、摄影
Tumblr 输出这样的 html 标记:
发布内容
<div class="entry photo photo-low-res">发布内容
<div class="入门照片摄影">发布内容
这个标记可以用小的css处理:
/* 常见的照片帖子 */.entry.photo {}/* `hi-res`-tag 照片帖子 */.entry.photo-hi-res {}/* `low-res`-tag 照片帖子 */.entry.photo-low-res { 宽度:500px;}/* `photography`-tag 照片帖子 *//* 你需要的规则 */.entry.photography { 宽度:900px;}.entry.photography img { 宽度:100%;}
Doing a custom Tumblr theme that will have a mix of the usual Tumblr post-types (text, pics, links, etc).
I'd also like to do a special post type once in awhile that'll feature my photography, but I don't want it to be resized, rather I'd like to feature the photo in high res at the full width of the theme (about 1140px wide).
I've read about {block:HighRes} {/block:HighRes} but it seems this is for having the 500px image click-through to the original.
Is there a way to disable this automatic re-sizing for these specific featured photography posts? Maybe a way to alter the behavior based on post tags? (e.g. if it has a "#photography" tag, display at full resolution - if not, go ahead and resize to 500px wide).
Here's a visual example of what I'm trying to do: http://i.imgur.com/23p09.jpg
解决方案
You can use {TagsAsClasses}
For example for this tumblr markup:
{block:Posts}
<div class="entry {TagsAsClasses}">
Post Content
</div>
{/block:Posts}
and 3 posts which have this tags:
- photo, photo-hi-res
- photo, photo-low-res
- photo, photography
Tumblr outputs such html markup:
<div class="entry photo photo-hi-res">
Post Content
</div>
<div class="entry photo photo-low-res">
Post Content
</div>
<div class="entry photo photography">
Post Content
</div>
and this markup can be handled with small css:
/* common for photo posts */
.entry.photo {}
/* `hi-res`-tag photo posts */
.entry.photo-hi-res {}
/* `low-res`-tag photo posts */
.entry.photo-low-res { width: 500px; }
/* `photography`-tag photo posts */
/* the rule you need */
.entry.photography { width: 900px; }
.entry.photography img { width: 100%; }
这篇关于你能根据标签自定义 Tumblr 帖子的格式吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!