如何在帖子中获取博主第一张图片网址 [英] How to get the blogger first image URL in the post

问题描述

我想要帖子中的第一张图片的网址，然后将其用作DIV的背景图片

I want the URL of the FIrst image in the post and then use it as background image of a DIV

推荐答案

获取帖子中第一张图片的网址，您可以在Blogger模板中使用以下数据标记

To get the URL of the first image in the post you can use the following data tag inside the Blogger template

<data:blog.postImageUrl/>

如果将其设置为背景，您可以执行以下操作：

For setting it as the background , you would do something like

<div class="newphoto" ></div>
<script>
document.getElementsByClassName('newphoto')[0].style.backgroundImage = "url('<data:blog.postImageUrl/>')" ;
</script>

或通过jQuery

$('.newphoto').css("background-image", "url('<data:blog.postImageUrl/>')"); 

如果您希望它在主页，标签页等页面上工作（上述数据标签可用于博客的所有页面都将在主页和标签页面上返回为空，因为这些页面没有任何与它们相关的特定图像，但可以正确地在帖子页面上工作）然后使用标签< data： post.firstImageUrl /> 并将其包含在以下代码块中

In case you want it work on pages like Homepage , Label page (The above data tag is available on all pages of the blog and will return empty on homepage and label pages as these don't have any particular images related to them but will work on the post pages correctly) then instead use the tag <data:post.firstImageUrl/> and include it inside the following block of code

<b:includable id='post' var='post'>

</b:includable>

另外只是提醒一下，如果将这些标签包含在HTML / Javascript小部件中，这些标签将无效布局选项卡或直接在帖子内容中。仅将它们包含在Blogger模板中

Also just a reminder , these tags won't work if you include them in HTML/Javascript widgets from the Layout tab or inside the post content directly. Include them in the Blogger Template only

这篇关于如何在帖子中获取博主第一张图片网址的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！