ContentBlocks ContentBlocks 2.x Plugins Color

The Color plugin sets the text color on visual inputs in the block it is applied to. The color to use comes from an input you define (typically, a color or select input).

The Background plugin is very similar but affects the background instead of text color.

This plugin applies to a specific block by adding it to its configuration.

Table of Contents

Accepted options

  • inputKey: the key of the input that holds the color to apply. This defaults to color.
  • inputValueKey: the key of the value in the input that holds the color to apply. This defaults to value.

Example block

{
    "title": "Textarea",
    "inputs": {
        "text": {
            "type": "textarea",
            "properties": {}
        }
    },
    "drawer": {
        "colorLabel": {
            "type": "label",
            "width": 20,
            "properties": {
                "for": "color",
                "text": "Color"
            }
        },
        "color": {
            "type": "text",
            "width": 30
        },
        "color2Label": {
            "type": "label",
            "width": 20,
            "properties": {
                "for": "color2",
                "text": "Background"
            }
        },
        "color2": {
            "type": "text",
            "width": 30
        }
    },
    "plugins": {
        "Color": {},
        "Background": {
            "inputKey": "color2"
        }
    }
}