2018-01-17

Drupal8エディタで文字色機能を追加

結論、インストール出来たが、機能しなかった。
有効になりました。(下部に追加記事あり)
どこかが間違っている可能性がある。

一応、インストール手順だけを記すことにした。

Drupal8 に装備されているエディタでは文字色を変更することは出来ない。
文字色を変更するには、タグを直接編集するか、他のエディタで作成しコピーする方法しかないようだ。
CKEditorは、フルで使用する例を下記のサイトで体験できる。
https://kcfinder.sunhater.com/demos/ckeditor
 

CKEditorは有料のため、商用として有料とサイトではうたわれているが、未確認。

【 Drupal バージョン 】
8.4.4
 
 【 インストール手順 】
文字色機能を使用するために4つの圧縮ファイルを解凍して、指定フォルダーに置く。
A)、C) の順に新しいモジュールとしてインストール作業をする。
 
 
【 必要ファイル 】
A) panelbutton-8.x-1.1.zip
B) panelbutton_4.8.0.zip
C) colorbutton-8.x-1.1.zip
D) colorbutton_4.8.0.zip


補足
C) をインストールするためには 予めA) をインストールしておかなければならない。
A)、C) をインストールするとエラー表示される。このとき、「それぞれB)、D)をインストールしなければプラグインとして認識されません」という趣旨のエラー内容である。
 
 
【 ダウンロード元 】
A) https://www.drupal.org/project/panelbutton
B) https://ckeditor.com/cke4/addon/panelbutton
C) https://www.drupal.org/project/colorbutton
D) https://ckeditor.com/cke4/addon/colorbutton
 
 
【 解凍後にファイルを置く場所 】
A) サイト名/modules/
B) サイト名/libraries/
C) サイト名/modules/
D) サイト名/libraries/
 
※ B)、D) の libraries フォルダーは新規作成した。
サイト名/sites/all/libraries/ フォルダーを新規作成した。
※ モジュールインストール作業後、 サイト名/libraries/ に置いたモジュールと同じファイルが、 サイト名/sites/all/libraries/ 以下に同じものが自動でコピーされていた。
  
 
【 機能を追加する 】
「拡張機能」項目でモジュールを新規追加する。
最初に A) を解凍した panelbutton をインストールする。
次に C) を解凍した colorbutton をインストールする。
panelbutton、colorbutton 共にインストールできたが・・・

補足 うまくいかない時
エラーが出るときは、もう一度ファイルを置く場所やフォルダー名のスペル、パーミッションを確認。
 
 
【 エディタの追加機能を使う準備 】
「環境設定」 >> 「テキストフォーマットとエディター」から ”文字色”、”背景色”アイコンを操作して使用できるように設定。
通常アイコン2つが表示されるはずが、アイコンの外枠のみの表示であった。ポップアップ文字には、”文字色”、”背景色”と表示はされていた。
いわゆる正常にアイコンが表示されていない。

また、背景色が赤い部分にエラーが表示されることがある。
このとき、「全てのキャッシュをクリアー」ボタンをクリックするか、一度ブラウザーのキャッシュをクリアーし再起動する。
記事を編集するときも同様なことが起きたが、前述の方法で解決できた。
 
 
【 追加した機能を試す 】
記事を編集しようとしたが、エディタ自体が表示されなかった。
 

作業記録は以上。
 
国内サイトではDrupalの情報が少ないため、海外のサイトを参考にここまでできたが後一歩のところで挫折。

以下追記 2019.09.06

CKEditorの文字色の機能が有効になった


プラグインのフォルダーを置く場所を以下のようにすると、文字色のアイコンが表示され、機能が有効になった。

カラーアイコン





移動対象のフォルダー名 colorbuttonpanelbutton

サイト名と同じフォルダーに  libraries フォルダーを作成する。
libraries内に colorbutton、panelbutton フォルダーを移動させる。


以上

× http://サイト名/libraries/colorbutton
× http://サイト名/libraries/panelbutton

http://libraries/colorbutton
http://libraries/panelbutton

理由はわからない。テンプレートは自作なため、ベースアドレスに問題がある可能性がある。



panelbutton と colorbuttontd を同時にインストールすると、エラーが出ることがあるため、1つづつインストールする。

 


#ckeditor, #drupal, #libraries, #colorbutton, #panelbutton