Anpassa verktygsfältsgrupper i webbplatsverktyget

För anpassade komponenter kan du anpassa kopior av färdigkonfigurerade verktygsfältsgrupper som visas i webbplatsverktygets verktygsfält.

Du kan skapa en egen version av en färdigkonfigurerad komponent som har en begränsad uppsättning och är tillgänglig i den anpassade taggen. Anpassningar som görs påverkar inte de färdigkonfigurerade komponenterna.

Du kan skapa en egen version av en färdigkonfigurerad komponent som har en begränsad uppsättning och är tillgänglig i den anpassade taggen, men den påverkar inte någon av de färdigkonfigurerade komponenterna.

Verktygsfältsgrupper definierar vad du ser i verktygsfältet när du klickar på titel- eller styckeskomponenten för att redigera den. Du kan ta bort och sortera om vad som stöds av titel- eller styckeskomponenten, men ytterligare insticksprogram tillåts inte.

För att anpassa verktygsfältsgrupper i webbplatsverktyget måste du använda samma syntax som CKEditor använder för sin toolbarGroups-konfiguration. Se https://ckeditor.com/latest/samples/toolbarconfigurator/index.html#basic.

Titel- och styckeskomponenter har stöd för följande grupper:

"basicstyles" – begränsad till fetstil/kursiv/understruken https://ckeditor.com/cke4/addon/basicstyles
"styles" – teckenformat https://docs.ckeditor.com/ckeditor4/latest/guide/dev_styles.html
"colors" – text- och bakgrundsfärger https://docs.ckeditor.com/ckeditor4/latest/guide/dev_colorbutton.html
"undo" – Ångra/Gör om för den aktuella instansen i CKEditor
"links" – anpassat insticksprogram för att länka dialogruta
"paragraph" – stöd för punktlista/numrerad lista och indrag
- "list"
- "indent"
"align" – vänster/höger/centrera
"cleanup" – ta bort format för den valda texten

Styckeskomponenten stöder även insticksprogrammen för infogande av bilder och tabeller

"insert"
- "image"
- "table"

Dessutom kan du använda radavgränsarposten:

Obs!:

Om du anger något annat värde i konfigurationen för verktygsfältsgrupp tas värdet bort innan webbplatsverktygsfältet skapas. Du kan inte ange "extraPlugins". Endast konfigurationen "name"/"groups" stöds. Alla "items"-poster ignoreras.

Om du till exempel vill hindra användarna från att definiera teckensnitt, färger, format eller storlekar kan du uppdatera verktygsfältskonfigurationen på följande sätt. För "id"-värdena måste du ange anpassade värden som skiljer sig från de färdigkonfigurerade värdena.

[{
    "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;"
        }
    }]
}]

Validering

Ersätt filen components.json med föregående kod och redigera sedan webbplatsen (förnya webbläsaren om du redan redigerar). I det här skedet visas inte längre teckenformat eller färger som kan väljas när du redigerar en titelkomponent. Styckeskomponenten fortsätter att visa dessa, och listan över tillgängliga teckenstorlekar begränsas till 16, 24 och 48.

Standardgrupper för verktygsfält

Standardgrupperna för verktygsfält för titel och stycke är följande:

Titel

[{
        "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"]
    }
]

Stycke

[{
        "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"]
    }
]