Personify Image Position

[whitemedia]

Hi,

I am using parameters amended from Personify’s The Magnate. The below parameters produce the results in the screenshot:

{
  "cwSectionBackground" : {
    "type"   : "group",
    "label"  : "Background",
    "params" : {
      "base" : {
        "type"       : "color",
        "label"      : "Base",
        "initial"    : "global-color:cwiBackground1",
        "isVar"      : true,
        "responsive" : false
      },
      "image" : {
        "type"     : "bg-image-simple",
        "noPicker" : true,
        "params"   : {
          "src" : {
            "type"    : "image",
            "label"   : "Source",
            "initial" : "318:full"
          }
        }
      }
    }
  }
}

Please note that this is an abbreviated version of the full parameters, so if there are incorrect curly brackets, that is my error in placing this post! All is correct in the Component itself.

My question is: how is the Position field created? I would like to have more control over this setting, so that I can input percentage options - 50% 50% for center. Is it possible to achieve this?

Thanks,
Christopher

[ruenel]

Hey Christopher,

Thanks for the very detailed post information.

You will have to change the "type" : "bg-image-simple", into "type" : "bg-image", so that you will have something like this:

Best Regards.

[whitemedia]

Hi @ruenel,

Thank you for the answer. It has worked perfectly. Out of interest, are there any other "type" for images apart from "bg-image-simple", "bg-image" and "image". I cannot see anything in the documentation?

For my own reference, if nothing else, this is the amended JSON I have used:

"image" : {
        "type"   : "group",
        "label"  : "BG Image",
        "noPicker" : true,
        "params" : {
          "src" : {
            "label"   : "Source",
            "type"    : "image",
            "initial" : "318:full"
          },
          "size" : {
            "label"   : "Size",
            "type"    : "text",
            "initial" : "cover"
          },
          "position" : {
            "label"   : "Position",
            "type"    : "text",
            "initial" : "50% 50%"
          }
        }
      }

Thank you for your help,
Christopher

[ruenel]

Hey Christopher,

These are the current Image types that we have. We apologize for not having been able to update the documentation yet.

Please bear with us.