In CKEditor, how can I add a “text” label to a button?

Question

editor.ui.addButton( \'ImageUpload\',{
                label: \'Upload Image\',
                command: \'popup_image_uploader\',
                icon: this.path + \'im         


        

Answer 1

The label for CKeditor toolbar buttons have a class .cke_label which has by default display:none so the buttons are icon-only:

.cke_skin_kama .cke_button .cke_label {
    ...
    display: none;
    ...
}

Like for the Source button, you have to use CSS to show your label.

Normally when creating the button CKeditor add a class like .cke_button_CMDNAMEHERE where CMDNAMEHERE being the name of your command. So you'll have:

.cke_skin_kama .cke_button_CMDNAMEHERE .cke_label {
   display: inline;
}

Check the html source to see the exact name of the added class and make your CSS rule accordingly.