web-dev-qa-db-fra.com

Comment ajouter des nuances de couleurs personnalisées à tous les éditeurs WYSIWYG?

J'aimerais pouvoir ajouter les mêmes couleurs personnalisées aux nuanciers au bas des panneaux de sélecteur de couleurs qui apparaissent dans les éditeurs WYSIWYG du site, afin de permettre aux clients de conserver un style uniforme.

Les échantillons auxquels je me réfère sont la dernière ligne de la capture d'écran.

J'aimerais faire cela sans installer de plug-in, idéalement.

 Colour chooser 

3
Clayton Jones

Cliquez sur le texte Custom... et le sélecteur de couleur apparaîtra. Choisissez la couleur de votre choix et appuyez sur OK. La couleur choisie apparaîtra comme un échantillon personnalisé pour une utilisation ultérieure.

Remarque! La solution ci-dessus n'est pas une solution. Voir les commentaires et modifier ci-dessous.

Modifier:

Voici une fonction qui remplace toute la palette par défaut par des nuances personnalisées.

Remarque, il y a 7 couleurs dans la liste au lieu de 8. C'est parce qu'il devrait également y avoir le multiplication X (✕) à la fin de la liste de couleurs qui supprime toute couleur appliquée au texte. Ainsi, lors de l'ajout d'une ligne supplémentaire, il doit y avoir 15 couleurs et non 16.

function my_mce4_options($init) {

    $custom_colours = '
        "3366FF", "Color 1 name",
        "CCFFCC", "Color 2 name",
        "FFFF00", "Color 3 name",
        "99CC00", "Color 4 name",
        "FF0000", "Color 5 name",
        "FF99CC", "Color 6 name",
        "CCFFFF", "Color 7 name"
    ';

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

    // change the number of rows in the grid if the number of colors changes
    // 8 swatches per row
    $init['textcolor_rows'] = 1;

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

En outre, vous pouvez créer votre propre grille de nuances en fonction du nombre de couleurs et des exigences de l'interface utilisateur:

$init['textcolor_rows'] = 4;
$init['textcolor_cols'] = 2;

Largement basé sur cette réponse WPSE .

Pour plus d'informations et de personnalisation, voir cet article de blog .

8
Max Yudin