[javascript] TinyMCE에서 텍스트 에디터에서 색상 선택을 위한 팔레트 기능을 추가하는 방법은?

24 Nov 2023

javascript

먼저, TinyMCE를 초기화하는 곳에서 설정 옵션을 추가해야 합니다. 아래의 코드는 초기화 함수 내에 색상 팔레트를 생성하는 방법을 보여줍니다.

tinymce.init({
  selector: 'textarea',
  plugins: 'colorpicker',
  toolbar: 'forecolor backcolor',
  color_picker_callback: function(callback, value) {
    // 색상 팔레트 설정
    var colors = [
      '#000000', '#FFFFFF', '#FF0000', '#00FF00', '#0000FF' // 추가 색상은 이곳에 넣어주세요
    ];

    callback(colors);
  }
});

위 코드에서는 color_picker_callback을 사용하여 커스텀 색상 팔레트를 설정합니다. colors 배열에는 원하는 색상 값을 추가할 수 있습니다.

설정한 후, 텍스트 에디터 영역에서 컬러 선택을 위한 버튼이 나타나며, 클릭하면 설정한 색상 팔레트에서 원하는 색상을 선택할 수 있습니다.

이렇게 TinyMCE에 색상 선택 기능을 추가할 수 있습니다. 자세한 내용은 TinyMCE 공식 문서를 참조하세요.