programing

사용자 지정 텍스트 색상 추가 WordPress 3.9TinyMCE 4 Visual 에디터

muds 2023. 3. 7. 22:06
반응형

사용자 지정 텍스트 색상 추가 WordPress 3.9TinyMCE 4 Visual 에디터

Visual Editor 텍스트 색상 드롭다운에 기본 색상과 함께 사용자 지정 색상을 추가하는 데 도움이 되는 코드 조각이 있습니다.아래 토막을 붙이고 있습니다.

function change_mce_options( $init ) {
  $default_colours = '000000,993300,333300,003300,003366,000080,333399,333333,800000,FF6600,808000,008000,008080,0000FF,666699,808080,FF0000,FF9900,99CC00,339966,33CCCC,3366FF,800080,999999,FF00FF,FFCC00,FFFF00,00FF00,00FFFF,00CCFF,993366,C0C0C0,FF99CC,FFCC99,FFFF99,CCFFCC,CCFFFF,99CCFF,CC99FF,FFFFFF';
  $custom_colours = 'e14d43,d83131,ed1c24,f99b1c,50b848,00a859,00aae7,282828';
  $init['theme_advanced_text_colors'] = $default_colours . ',' . $custom_colours;
  $init['theme_advanced_more_colors'] = true;
  return $init;
}
add_filter('tiny_mce_before_init', 'change_mce_options');

Word press 3.9 업데이트 후 작동이 중단되어 수정하려고 여러 번 시도했지만 할 수 없습니다.도와주실 수 있나요?

텍스트 색상의 옵션은 다음과 같습니다.textcolor_map각 색상의 형식은"color_hex", "color_name".

이 예에서는 옵션 이름을 변경하고 색상 배열을 다음과 같이 변환합니다.

function my_mce4_options($init) {
  $default_colours = '"000000", "Black",
                      "993300", "Burnt orange",
                      "333300", "Dark olive",
                      "003300", "Dark green",
                      "003366", "Dark azure",
                      "000080", "Navy Blue",
                      "333399", "Indigo",
                      "333333", "Very dark gray",
                      "800000", "Maroon",
                      "FF6600", "Orange",
                      "808000", "Olive",
                      "008000", "Green",
                      "008080", "Teal",
                      "0000FF", "Blue",
                      "666699", "Grayish blue",
                      "808080", "Gray",
                      "FF0000", "Red",
                      "FF9900", "Amber",
                      "99CC00", "Yellow green",
                      "339966", "Sea green",
                      "33CCCC", "Turquoise",
                      "3366FF", "Royal blue",
                      "800080", "Purple",
                      "999999", "Medium gray",
                      "FF00FF", "Magenta",
                      "FFCC00", "Gold",
                      "FFFF00", "Yellow",
                      "00FF00", "Lime",
                      "00FFFF", "Aqua",
                      "00CCFF", "Sky blue",
                      "993366", "Red violet",
                      "FFFFFF", "White",
                      "FF99CC", "Pink",
                      "FFCC99", "Peach",
                      "FFFF99", "Light yellow",
                      "CCFFCC", "Pale green",
                      "CCFFFF", "Pale cyan",
                      "99CCFF", "Light sky blue",
                      "CC99FF", "Plum"';

  $custom_colours =  '"E14D43", "Color 1 Name",
                      "D83131", "Color 2 Name",
                      "ED1C24", "Color 3 Name",
                      "F99B1C", "Color 4 Name",
                      "50B848", "Color 5 Name",
                      "00A859", "Color 6 Name",
                      "00AAE7", "Color 7 Name",
                      "282828", "Color 8 Name"';

  // build colour grid default+custom colors
  $init['textcolor_map'] = '['.$default_colours.','.$custom_colours.']';

  // enable 6th row for custom colours in grid
  $init['textcolor_rows'] = 6;

  return $init;
}
add_filter('tiny_mce_before_init', 'my_mce4_options');

편집: 기본 색상 스와치 그리드는 5x8(ROWSxCOLS)입니다.기본 색상 그리드 뒤에 커스텀 색상을 추가하려면 행 수를 변경해야 합니다.위의 코드에 포함된 변경은 제 블로그 투고에서 더 잘 설명되었습니다.

편집 2: 컬러 피커 애드온 - TinyMCE 컬러 피커가 제공되어 WordPress 3.9에 관련된 모든 색상의 수정이 해결되었습니다.

EDIT 3: 위의 컬러 피커는 구식입니다.이 플러그인은 2016년 9월 현재 최신 플러그인입니다.

건배.

언급URL : https://stackoverflow.com/questions/23171247/add-custom-text-color-wordpress-3-9-tinymce-4-visual-editor

반응형