如何将图像添加为自己的背景图像属性？

Question

In Wordpress, I wanted to duplicate the images of the posts, so I can set one of them as background, and then blur it, creating a nice effect, without having to change all my html structure.

How can I do that, if possible, with PHP? I tried long time ago to achieve with JQuery, but at that time I didn't manage to make it:

$(".post-cover").each(function(){
  var img = $(this).find("img");
  $(this).css({
    "background-image": "url('"+img.prop("src")+"')",
    //Any other CSS background propriety
    //If your div don't have a fixed width and height
    width: img.width(),
    height: img.height()
  });
  img.remove();
});

If I used Jquery, where should I implement it?

My structure is

<div class="post-cover">
  <img src="#"/>
</div>

and the final result should be something like:

Answer 1

Could be like this:

$( document ).ready(function() {
  $('.post-cover img').each(function() {
    $(this).before('<img src="'+ $(this).attr('src')+'" class="blur">');
  });
});

.post-cover {
    position: relative;
}
.post-cover img {
    width: 250px;
    height: auto;
    display: block;
    position: relative;
    padding: 50px;
}

.post-cover img.blur {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-filter: blur(25px);
    filter: blur(25px);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="post-cover">
  <img src="https://placeimg.com/640/480/arch">
</div>

</div>