Cannot bind background image via dynamic data from Contentful Integration

Hello,

Steps to reproduce:

1.) Add Contentful integration
2.) Add image to Contentful
3.) Try to apply to the dynamic, bound background of a box

There will not be a background image

Actually, we have tested with builder data and still doesn’t display.

Hi @jayshay thank you for the question! Yes, setting the background image like that wont necessarily work, because style.backgroundImage sets the backgroundImage CSS property, which requires the syntax url("whateverUrl.com")

The way you have it set is just setting backgroundImage: whateverUrl.com, which is why it is not working.

In order to fix this, you simply need to set the from value to be custom code by selecting the <> button and entering in custom code in the syntax of the CSS property, something like

return `url(${state.article.image})`

Or whatever your case may be. See the image attached
Screen Shot 2022-05-06 at 11.00.13 AM

Hope that helps!

Hi Tim,

We tried your suggestion and it worked perfectly. Thanks for your prompt support with this!

1 Like