Set Default Background Image in Module

[nmoore]

How do I set a default background image in a module? The below doesn't seem to work

[
  {
    "name" : "bg_img",
    "label" : "Background Image",
    "required" : true,
    "type" : "image",
    "default" : {
      "src" : "../images/heros/hero-purple.jpg"
    }
  }
]

[SandyG1]

Hi @nmoore ,

Just to add to the other answer. When you define a background image on a module, this variable needs to be added inline and not in the CSS file as that will not work.

for example instead of using a class. Use the variable in the module.html

<img src="{{ module.bg_img.src }}" alt="{{ module.bg_img.alt }}" />

Sandy

[Chris-M]

Hello @nmoore,

your code is fine. I guess the probleme is the URL, you need the absolute URL, you can't use ".." at this point, this will just be added to the url, for example "https://XXX.com/../images/heros/hero-putple.jpg". To get to the root path you just "/".

could you please try the full image path:

for example

"default" : {
      "src" : "https://cdn2.hubspot.net/hubfs/xxxxxxx/images/heros/hero-purple.jpg",
    }

You can get the full image path in your file manager -> select file -> File URL by Domain

- Chris

Edit: your path without the full url could be (best way to see it, get the full image path): 

    "default" : {
      "src" : "/hubfs/images/heros/hero-purple.jpg"
    }