Set post background using custom field

OK, I tried it and I needed to add a couple of parameters. Please see update to version 0.6.0.

This is what I did to set a background image according to a custom field:

<div style="background:url('[content name="post-name" image="image_field" return="url"]') no-repeat;height:400px;width:300px;">

Looks a bit wild, but it works. Here are the parameters:

image – name of image field
return – set to url

Depending on how you set up the image field, you might need to add this parameter:

in – set to id, url or object; the image field content is ID, URL or image object; default is ID

It should work in a loop also.

Hmmm…. I feel like I’m close but I can’t quite get it to work. What am I doing wrong?

Here is where I’m at so far:
<div style=”background:url(<?php echo do_shortcode(‘[loop type=”what_is_this”][content field=”background-image” return=”url”][/loop]’); ?>) no-repeat; height:400px;width:300px; border:5px solid #fff;”>content goes here with the custom field background image as div background</div>

I have the background-image custom field set with https://charleybiggs.com.s64567.gridserver.com/wp-content/uploads/2014/01/featured_product_03.jpg as the background image (just for the purposes of testing this)

If you take a look at my dev site below, scroll down to the bottom and you will see the div that I’m testing this out on. Thanks for your help, you rock!

https://charleybiggs.com.s64567.gridserver.com

Nevermind, it started working. Thanks so much for your help!

Ah great! I’m glad it worked – I never thought of doing something like this, but that’s cool that it’s possible. ??

Looking over your code, here’s how I might do it:

<?php echo do_shortcode('
    [loop type="what_is_this"]
        <div style="background:url([content field="background-image" return="url"]) no-repeat; height:400px;width:300px; border:5px solid #fff;">
            content goes here with the custom field background image as div background
        </div>
    [/loop]
    ');
?>

This will create as many boxes with different backgrounds as there are posts found.

Hello. I just noticed that for some reason, the backgrounds won’t show up on iphone/ipad. Any idea why this is happening? Everything else seems to work fine, but on those devices the background disappears in the div.

If you look at the block that says “Can you guess what this is?” then you will see that the background for that div doesn’t show up on iphone/ipad. Thanks for any help you can give me.

https://charleybiggs.com.s64567.gridserver.com/