Työkalurivin ryhmien räätälöinti sivustonluontiohjelmassa

Voit räätälöidä valmiita sivustonluontiohjelman työkalurivin ryhmiä räätälöidyille komponenteille.

Voit luoda valmiista komponentista oman version, jonka joukkoa on rajoitettu ja joka on käytettävissä räätälöidyn tunnisteen kanssa. Räätälöinnit eivät vaikuta valmiisiin komponentteihin.

Voit luoda valmiista komponentista oman version, jonka joukkoa on rajoitettu ja joka on käytettävissä räätälöidyn tunnisteen kanssa. Räätälöinti ei vaikuta valmiisiin komponentteihin.

Työkalurivin ryhmät määräävät, mitä työkalurivillä näytetään, kun napsautat Otsikko- tai -Kappale-komponenttia, jotta voisit muokata sitä. Voit poistaa ja järjestellä uudelleen Otsikko- tai Kappale-komponentin tukemia toimintoja, mutta laajennukset eivät ole sallittuja.

Jos haluat räätälöidä työkalurivin ryhmiä sivustonluontiohjelmassa, käytä samaa syntaksia, jota käytetään CKEditorin toolbarGroups-kokoonpanossa. Katso kohta https://ckeditor.com/latest/samples/toolbarconfigurator/index.html#basic.

Otsikko- ja Kappale-komponentit tukevat seuraavia ryhmiä:

Kappale-komponentti tukee myös kuvan ja taulukon lisäyksen laajennuksia”

  • "insert"

    • "image"

    • "table"

Lisäksi voit käyttää rivin erotinta:

  • "/"

Huomautus::

Jos määrität minkä tahansa muun arvon työkaluriviryhmän määrityksessä, arvo poistetaan ennen Sivustonluontiohjelma-työkalurivin luontia. Et voi määrittää kokoonpanoa "extraPlugins". Vain kokoonpanoa "name"/"groups" tuetaan. Kaikki "items"-merkinnät ohitetaan. 

Jos haluat esimerkiksi estää fonttien, värien, tyylien tai kokojen määrityksen käyttäjiltä, voit päivittää työkalurivin kokoonpanon seuraavalla tavalla. "id"-arvoiksi on määritettävä räätälöityjä arvoja, jotka eroavat valmiista arvoista.

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

Tarkistus

Korvaa components.json-tiedosto edellä olevalla koodilla ja muokkaa sitten sivustoa (päivitä selain, jos muokkaat jo sivustoa).  Jos muokkaat tämän jälkeen Otsikko-komponenttia, fontin tyylien tai värien valintaa ei enää näytetä.  Valinnat näytetään edelleen Kappale-komponentissa, ja fonttikokojen listassa ovat vain arvot 16, 24 ja 48.

Työkalurivin oletusryhmät

Otsikko- ja Kappale-komponenttien työkalurivin oletusryhmät ovat seuraavat:

  • Otsikko

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

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