Personalización de grupos de la barra de herramientas en el creador de sitios

Para los componentes personalizados, puede personalizar copias de los grupos de la barra de herramientas listos para usar que se muestran en la barra de herramientas Creador de sitios.

Puede crear su propia versión de un componente listo para usar que tenga un juego restringido y esté disponible en la etiqueta personalizada. Ninguna de las personalizaciones afecta a los componentes listos para usar.

Puede crear su propia versión de un componente listo para usar que tenga un juego restringido y esté disponible en la etiqueta personalizada, pero esta no afectará a ninguno de los componentes listos para usar.

Los grupos de la barra de herramientas definen lo que se muestra en la barra de herramientas cuando se hace clic en el componente Título o Párrafo para editarlo. Puede eliminar y volver a ordenar lo que esté admitido en el componente Título o Párrafo, pero no se permiten plugins adicionales.

Para personalizar los grupos de la barra de herramientas en el creador de sitios, debe utilizar la misma sintaxis que utiliza CKEditor para la configuración de su toolbarGroups. Consulte https://ckeditor.com/latest/samples/toolbarconfigurator/index.html#basic.

Los componentes Título y Párrafo admiten los siguientes grupos:

El componente Párrafo también admite plugins de inserción de imagen y tabla:

  • "insert"

    • "image"

    • "table"

Además, puede utilizar la entrada de separador de fila:

  • "/"

Nota:

Si define cualquier otro valor en la configuración del grupo de barras de herramientas, el valor se eliminará antes de crear la barra de herramientas del creador de sitios. No puede proporcionar "extraPlugins". Solo se admite la configuración "name"/"groups". Todas las entradas de "items" se ignorarán. 

Por ejemplo, si desea evitar que los usuarios definan fuentes, colores, estilos o tamaños, puede actualizar la configuración de la barra de herramientas como se muestra a continuación. Para los valores "id", debe especificar valores personalizados que sean diferentes de los valores listos para usar.

[{
    "name": "<category name>",
    "list": [{
        "type": "scs-title",
        "id": "<custom-value>",
        "config": {
            "toolbarGroups": [{
                    "name": "basicstyles",
                    "groups": ["basicstyles"]
                }, {
                    "name": "undo",
                    "groups": ["undo"]
                },
                "/", {
                    "name": "links",
                    "groups": ["links"]
                }, {
                    "name": "paragraph",
                    "groups": ["list", "indent"]
                },
                "/", {
                    "name": "align",
                    "groups": ["align"]
                },
                {
                    "name": "insert",
                    "groups": ["image", "table"]
                }, {
                    "name": "cleanup",
                    "groups": ["cleanup"]
                }
            ]
        }
    }, {
        "type": "scs-paragraph",
        "id": "<custom-value>",
        "config": {
            "fontSize_sizes": "16/16px;24/24px;48/48px;"
        }
    }]
}]

Validación

Sustituya el archivo components.json por el código anterior y, a continuación, edite el sitio (refresque el explorador si ya está editando).  En este momento, si se edita un componente Título, este dejará de mostrar estilos o colores de fuente para la selección.  El componente Párrafo los seguirá mostrando, y la lista de tamaños de fuente disponibles se limitará a 16, 24 y 48.

Grupos de la barra de herramientas por defecto

Los grupos de la barra de herramientas por defecto para Título y Párrafo son los siguientes:

  • Título

    [{
            "name": "basicstyles",
            "groups": ["basicstyles"]
        }, {
            "name": "styles",
            "groups": ["styles"]
        }, {
            "name": "colors",
            "groups": ["colors"]
        }, {
            "name": "undo",
            "groups": ["undo"]
        },
        "/", {
            "name": "links",
            "groups": ["links"]
        }, {
            "name": "paragraph",
            "groups": ["list", "indent"]
        }, {
            "name": "align",
            "groups": ["align"]
        }, {
            "name": "cleanup",
            "groups": ["cleanup"]
        }
    ]
  • Párrafo

    [{
            "name": "basicstyles",
            "groups": ["basicstyles"]
        }, {
            "name": "styles",
            "groups": ["styles"]
        }, {
            "name": "colors",
            "groups": ["colors"]
        }, {
            "name": "undo",
            "groups": ["undo"]
        },
        "/", {
            "name": "links",
            "groups": ["links"]
        }, {
            "name": "paragraph",
            "groups": ["list", "indent"]
        }, {
            "name": "align",
            "groups": ["align"]
        }, {
            "name": "insert",
            "groups": ["image", "table"]
        }, {
            "name": "cleanup",
            "groups": ["cleanup"]
        }
    ]