Question

如果我的帖子在分享时包含特定的class/es，我的目标是预览特定的图片。

我正在使用博客平台及其默认代码。

<b:if cond='data:post.labels any (l  =&gt; l.name in {"video", "youtube"})'>
    <meta content='post-with-video-class.jpg' property='og:image'/>

<b:elseif cond='data:post.labels any (l  =&gt; l.name in {"gallery"})'/>
    <meta content='post-with-gallery-class.jpg' property='og:image'/>

<b:else/>
    <meta content='default-class-url.jpg' property='og:image'/>
</b:if>

...和我的内容

<div id='posts'>
    <div class='video and youtube'>
        post 1
    </div>
    <div class='gallery'>
        post 2
    </div>
    <div class='default'>
        post 3
    </div>
</div>

此代码仅在body内有效且为了预览图片，meta标记应位于head内。

我尝试用jquery附加它但仍然没有预览图像。

$("[property*='og:image']").appendTo ("head");

是否有任何jQuery代码可以替换博客代码？我正在阅读有关classList和hasClass的内容，但执行它们仍然远非我所知。请帮忙。

Answer 1

可能有一个更好的解决方案，但这是一个可行的解决方法，这是有效的 在此假设下：

对于列表视图，应显示博客的一个默认图像。
对于详细视图，将显示视频或图库图像。
帖子后可以有一个关键字来过滤，而不是标签。

可以将此代码输入head - 代码，并创建指定的meta - 代码。在本例中，我使用关键字 （视频） 作为post-with-video-class.jpg图片，关键字 （图片） 对于图像post-with-gallery-class.jpg，在任何其他情况下都会显示默认图像
可以使用任何其他关键字，但会限制标题选项

<b:with value='data:widgets.Blog.first.posts.first' var='post'>
    <b:if cond='data:view.isSingleItem and data:post.title contains &quot;(video)&quot;'>
        <meta content='post-with-video-class.jpg' property='og:image'/>
    <b:elseif cond="data:view.isSingleItem and data:post.title contains &quot;(pics)&quot;"/>
        <meta content='post-with-gallery-class.jpg' property='og:image'/>
    <b:else/>
        <meta content='default-class-url.jpg' property='og:image'/>
    </b:if>
</b:with>

这不是优雅，而是一种可能的或多或少简单的解决方法。

提示：要使其正常工作，它应该基于新主题（例如 Contempo ），因为某些功能，标签和< em> data 元素在旧主题中不可用
  这里有一些很好的文档，可能有助于http://template-data.blogspot.co.at

由于文档不多，我无法说明labels帖子对象上是否可以访问data:widgets.Blog.first.posts.first属性。

如何根据div类分配元标记图像内容网址值？

1 个答案: