Colorbutton installs fine and no errors are generated. I am able to add the colorbuttons in the toolbar configuration, but if I do so, the entire CKEditor disappears when in content edit mode. Am I missing something or is this a bug and it's not compatible with Drupal 8.2.x yet?

CommentFileSizeAuthor
#22 ckeditor-step-2-basichtml.png86.69 KBchrlvclaudiu
#22 ckeditor-step-1-basichtml.png85.7 KBchrlvclaudiu
#18 捕获.JPG52.06 KBJames Wang
#14 4.JPG14.28 KBJames Wang
#14 3.JPG86.82 KBJames Wang
#14 2.JPG53.42 KBJames Wang
#14 1.JPG24.74 KBJames Wang
#12 libraries.png21.56 KBkevinquillen

Issue fork colorbutton-2822068

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

CountPacMan created an issue. See original summary.

CountPacMan’s picture

CountPacMan CreditAttribution: CountPacMan commented
Priority: Major » Normal
Status: Active » Closed (works as designed)

Found the problem. Colorbutton needs PanelButton and UIButton libraries as dependencies. Works fine now.

Buntstich’s picture

Buntstich CreditAttribution: Buntstich commented

Where can I find the UIButton library and where it's to place.

joaomachado’s picture

joaomachado CreditAttribution: joaomachado commented

I installed PanelButton, installed the panelbutton libraries, then installed colorbutton.
No errors on install, but when I go to add the buttons to the toolbar, there are no icons on the buttons and if I add them to the toolbar, ckeditor fails to load.

What dependency is UIButton?

Irix’s picture

Irix CreditAttribution: Irix commented

Same problem here

CountPacMan’s picture

CountPacMan CreditAttribution: CountPacMan at ThinkShout commented

Here are the libraries required in addition to the module:
http://download.ckeditor.com/colorbutton/releases/colorbutton_4.5.11.zip
http://download.ckeditor.com/panelbutton/releases/panelbutton_4.5.11.zip
http://download.ckeditor.com/button/releases/button_4.5.11.zip
http://download.ckeditor.com/floatpanel/releases/floatpanel_4.5.11.zip

Install them in your libraries folder. UIButton is called just button in the file itself.

lukasss’s picture

lukasss CreditAttribution: lukasss commented

#6 working for me.
Important: path for thoese library: ...libraries/button/plugin.js etc

James Wang’s picture

James Wang CreditAttribution: James Wang commented

I have same problem too.I don't know how to install UIButton because my drupal's version is 8.2.7!
It have no libraries folder.
How can I do ?

kevinquillen’s picture

kevinquillen CreditAttribution: kevinquillen at Velir commented

You have to create the 'libraries' folder.

Has there been a change where button and floatpanel are now required?

James Wang’s picture

James Wang CreditAttribution: James Wang commented

Creating ‘libraries’ folder is useful？
I think the module ‘CKEditor color button’ have problems.
Is there other way to add color button to CKEditor?

James Wang’s picture

James Wang CreditAttribution: James Wang commented

Has someone installed 'CKEditor Color Button' successfully?

kevinquillen’s picture

kevinquillen CreditAttribution: kevinquillen at Velir commented
FileSize
libraries.png21.56 KB

Yes, you have to create a 'libraries' folder in the application root as this is where it looks for the javascript plugins. It does not exist by default in a vanilla Drupal download.

libraries

Aside from that, I am running a Drupal 8.2.7 site with this module (and Panelbutton) - I did not have to add UIButton or Floatpanel. Can someone show me where that dependency exists besides the Panelbutton plugin? I am able to install and use this on multiple sites.

Has someone installed 'CKEditor Color Button' successfully?

Yes, this module has a reported install count of 1,608 sites.

kevinquillen’s picture

kevinquillen CreditAttribution: kevinquillen at Velir commented
Status: Closed (works as designed) » Postponed (maintainer needs more info)
James Wang’s picture

James Wang CreditAttribution: James Wang commented
FileSize
1.JPG24.74 KB
2.JPG53.42 KB
3.JPG86.82 KB
4.JPG14.28 KB

I have done it as you said,but it don't work still.

kevinquillen’s picture

kevinquillen CreditAttribution: kevinquillen at Velir commented

I don't understand what "doesn't work" means. What about it does not work? I can see the color button (both foreground and background) buttons there on your filter format configuration. Are there browser console errors? Is the cache cleared? Is Drupal running multisite or are you installed in a sub directory?

James Wang’s picture

James Wang CreditAttribution: James Wang commented

Sorry!
I didn't install the panel button correctly,I will try again.

kevinquillen’s picture

kevinquillen CreditAttribution: kevinquillen at Velir commented

Yes, you will need that js plugin too, just like color button.

James Wang’s picture

James Wang CreditAttribution: James Wang commented
FileSize
捕获.JPG52.06 KB

Thank you very much!It works!Thank you for your help!
img

kevinquillen’s picture

kevinquillen CreditAttribution: kevinquillen at Velir commented
Status: Postponed (maintainer needs more info) » Fixed
James Wang’s picture

James Wang CreditAttribution: James Wang commented
Status: Fixed » Active

I suggest that you could optimize the installation：

Installation：
1 Download the plugin from http://ckeditor.com/addon/colorbutton at least version 4.5.6.
2 Place the plugin in the root libraries folder (/libraries).(creating libraries first，as well as Panel button module.)
3 Enable Color Button module in the Drupal admin.
4 Configure your CKEditor toolbar to include the button (either text or background color, or both).

Thank you！

Matt B’s picture

Matt B
Primary language English
CreditAttribution: Matt B commented

The libraries are not loaded via composer. If you could update the module to include these dependencies then the libraries would be installed on execution of composer require drupal/colorbutton would they not?

chrlvclaudiu’s picture

chrlvclaudiu CreditAttribution: chrlvclaudiu as a volunteer commented
FileSize
ckeditor-step-1-basichtml.png85.7 KB
ckeditor-step-2-basichtml.png86.69 KB

Hi,

Follow these steps to make sure the plugin works for Basic HTML text format:

  1. Drag the button from the toolbar to the active items
  2. Make sure you add the style attribute to span tag from the list of allowed html tags

For Full HTML there's no need to apply changes in step 2. For detailed information, check my screens.

Hope this helps.

chrlvclaudiu’s picture

chrlvclaudiu CreditAttribution: chrlvclaudiu as a volunteer commented
Status: Active » Needs review
ddrozdik’s picture

ddrozdik CreditAttribution: ddrozdik as a volunteer and at FFW, Drupal Ukraine Community for Open Y commented
Status: Needs review » Fixed

Module readme has been updated and pushed.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.

mazerrati’s picture

mazerrati CreditAttribution: mazerrati commented

Been trying the above suggestions for my Drupal project (8.4.2), but none works.

The solution that works for me is actually to install the Libraries API module:
https://www.drupal.org/project/libraries/releases/8.x-3.x-dev

Hope that helps.

soumyapsadanandan’s picture

soumyapsadanandan CreditAttribution: soumyapsadanandan as a volunteer commented

Let me explain how I resolved this issue thanks to this patch. I am using D 8.0.1 and adding text colorbutton resulted in entire editor getting grayed out (not gray, but white color).

From this forum, I am listing summary of steps I implemented to resolve the issue.

  1. Install the prerequisites - Panel Button library and its module, UI button library and floatpanel.
  2. Goto /modules/panelbutton/src/Plugin/CKEditorPlugin/PanelButton.php and /modules/panelbutton/src/Plugin/CKEditorPlugin/ PanelButton.php and update the path from
    $path = '/libraries/panelbutton/plugin.js';

    to 

    $path = 'libraries/panelbutton/plugin.js';

    Basically removing the slash.

  3. Download color button library and install the module.
  4. Goto configuration->text file & editors and add the color text and color background icons
  5. Run cron once and clear cache.

arisen made their first commit to this issue’s fork.