时间戳

首页 > 解决方案 > 从计算机上传图像文件并在 Wordpress 中设置为 div 背景图像

css - 从计算机上传图像文件并在 Wordpress 中设置为 div 背景图像

问题描述

我一直在寻找一种方法，基本上允许用户在 WordPress 后端上传图像，并将图像在前端用作 div 的背景图像，因此允许支持以下 CSS

background: url('');
background-repeat: no-repeat;
background-size: cover;

我发现了一个有我喜欢的答案的问题，但我对 PHP 不是很好，并且不知道如何使用“工具集类型”来实现它，以便它将背景 url 添加到样式表并在客户端时覆盖它想要添加新图像。如何从计算机上传图像文件并使用 jQuery 设置为 div 背景图像？

我也可以将图像放在页面本身，并允许用户这样做，但我需要使用背景属性，以便图像覆盖 div。如果有人知道任何样式可以在没有背景样式的情况下做到这一点，那就太好了。

标签： csswordpress

解决方案

我建议你看看Advanced Custom Fields。您可以添加将图像上传到帖子、页面、自定义帖子类型、术语等的功能。

上传图片后，您可以检索 url。如果它被上传到一个帖子，你可以像这样得到它。

<?php
  $image_url = get_field('image', $post_id);
?>

并将背景图片 url 设置为 div。

<div class="bg__full" style="background-image: url('<?php echo $image_url ?>')></div>

然后，您可以使用其他内联属性或类似 css 来设置 div 的样式。

.bg__full {
  background-repeat: no-repeat;
  background-size: cover;
}

推荐阅读