在汤博乐的{block:Photes}中渲染{Caption}
Render {Caption} within {block:Photos} on Tumblr
tumblr似乎有点问题,因为如果它在{block:Photos}
标记内,则无法呈现{Caption}
标记。问题是,我的主题工作方式要求以这种方式完成。
{block:Photoset}
<div class="object photo">
{block:Photos}
<a href="{PhotoURL-HighRes}" class="fancybox" rel="{PostID}" title="{Caption}"><img src="{PhotoURL-HighRes}" /></a>
{/block:Photos}
</div>
{/block:Photoset}
原因是我正在使用FancyBox为集合中的每一张照片添加标题,您必须通过在title
属性中添加标题来完成此操作。
有什么建议吗?
他们文档中的例子正是这样做的,在{block:Photos}中有一个{Caption}。在该块中,{Caption}指的是单个照片的标题。
我猜你想要的是照片集的标题,而不是一张照片的标题。在您的情况下,标题可能是空的,所以您没有看到任何内容。
我不认为这可以通过模板完成,所以这里有一个使用jQuery的快速修复:
$('.photoset[data-caption]').each(function () {//select photosets that have a caption
var caption = $(this).data('caption');//get stored caption
$(this).find('.fancybox')//find link that needs the caption
.attr( 'title', caption );//add caption to link
});
这是模板:
{block:Photoset}
<div class="object photoset" {block:Caption}data-caption="{PlaintextCaption}"{/block:Caption}> <!-- Note the > after the block caption -->
{block:Photos}
<a href="{PhotoURL-HighRes}" class="fancybox" rel="{PostID}"><img src="{PhotoURL-HighRes}" /></a>
{/block:Photos}
</div>
{/block:Photoset}
或者你可以把{block:caption}{caption}{/block:caption}放在{/block:photos}下面,而不是放在里面,也有同样的问题,这对我来说很有效。
相关文章:
- 覆盖“;X-Robots-Tag:noindex“;在汤博乐
- 使用类似汤博乐的<a>链接
- 制作汤博乐登录页
- 刷新闪烁时的随机背景(汤博乐)
- 每天更改我的汤博乐主题的颜色属性
- 突出显示汤博乐中的当前页面菜单链接
- 汤博乐共享按钮不工作
- 汤博乐风格的用户悬停卡片
- 如何用汤博乐实现Packey库
- Wookmark脚本使我的汤博乐主题也向左滚动
- 汤博乐图片取消限制
- 如何在<hr/>像HTML中的汤博乐一样标记
- 谷歌社交互动分析与汤博乐分享按钮
- 汤博乐图片集字幕无法使用放大弹出菜单
- 汤博乐:删除“阅读更多”链接
- 汤博乐上的移动设备检测
- 垂直居中汤博乐布局
- 用InoReader(RSS阅读器)中的较大版本替换汤博乐、Pinterest和Flickr图片
- 汤博乐主题javascript
- 在汤博乐的{block:Photes}中渲染{Caption}