【Wordpress】文章の文字色に、指定のカラーコードをクリック操作でできるように出来ませんか？

Question

###前提・実現したいこと

今、Wordpressを使って記事を投稿しているのですが、

この右上の所をクリックした後に出てくる、
文字色装飾の所に、

既にある赤色とか、青色ではなく、
自分が指定したカラーコードの色を常駐させたいです。

↑ここのカスタム欄の所です。

今までは、
ずっと

<span style="color: #ff5192;"><strong>色を変えたい文章</strong></span>

こんな感じで編集をしていたのですが、
なかなか手間で・・・。

赤色とか黒色とかのように、ボタン一つで、色を変えたいです。

可能でしょうか・・・？

関係があるかわかりませんが、
現在使用しているWorpressテーマは「AN (TCD014)」です。

質問するのは初めてで
よくわかっていないのですが、
何か質問があれば回答させて頂きます。

よろしくお願い致します。

Answer 1

自分でカスタムするのが難しければTinyMCE Color Pickerというプラグインを入れるという方法もあります。
これなら簡単に色の追加ができますよ。

Comments

[amamiya_yaf]

簡単に出来ました！

ありがとうございました＾＾

これから、もっとphpの勉強もしていこうと思います！

ありがとうございました！

Answer 2

こんな感じで規定値を編集することが出来ます。

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", "Brown",
		"C0C0C0", "Silver",
		"FF99CC", "Pink",
		"FFCC99", "Peach",
		"FFFF99", "Light yellow",
		"CCFFCC", "Pale green",
		"CCFFFF", "Pale cyan",
		"99CCFF", "Light sky blue",
		"CC99FF", "Plum",
		"FFFFFF", "White"
		';
	$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"
		';
	$init['textcolor_map'] = '['.$default_colours.','.$custom_colours.']';
	$init['textcolor_rows'] = 6; // expand colour grid to 6 rows
	return $init;
}
add_filter( 'tiny_mce_before_init', 'my_mce4_options' );

【Custom Colours for TinyMCE 4 in WordPress 3.9】
https://urosevic.net/wordpress/tips/custom-colours-tinymce-4-wordpress-39/

【Custom colour palettes in TinyMCE with WordPress - Digital My Way】
http://digitalmyway.co.uk/2013/05/custom-colour-palettes-in-tinymce-with-wordpress/

【Add custom text color WordPress 3.9 TinyMCE 4 Visual editor - Stack Overflow】
http://stackoverflow.com/questions/23171247/add-custom-text-color-wordpress-3-9-tinymce-4-visual-editor

Comments

[amamiya_yaf]

kei344様

ご回答ありがとうございます！

すみませんど素人がゆえに、質問させて頂きたいのですが、
これはコピペ（functionの部分から最後までですか？）でどっかに貼れば解決しますか・・・？

その場合、function.phpの一番最後に貼ればいいのか（これを試したのですが、サイト全体の上部分に出ちゃいました。）

それとも、プラグイン編集の画面で、TinyMCE Advancedのプラグインを選択し、その画面右の項目のどれかを編集するんでしょうか・・・？

はたまた、もしかしてサーバーに入って何かしらフォルダをつくって　入れるものでしょうか・・・？

すみません本当にど初心者で。
ご教授頂けるとかなり助かります・・・。＞＜

[kei344]

> コピペ（functionの部分から最後までですか？）でどっかに貼れば解決しますか・・・？
カスタムカラーを自分で追加する必要が有ります。どっかに貼れば、とはいきませんね。

> サイト全体の上部分に出ちゃいました。
コピーを適切にしていないか、貼り付け位置の問題でしょう。WordPress はPHPの知識無しではカスタマイズは難しいと思います。書籍などを購入し、地道に初心者を脱するのが良いと思います。

Answer 3

赤で囲まれた箇所の「カスタム...」と書かれている箇所をクリックしてみてください。
それではダメですか？

Comments

[amamiya_yaf]

munyagu様

ご回答いただき、ありがとうございます！
すみません。
カスタムの所をクリックすると確かに自分がほしいカラーをカスタムできるのですが、

今回相談したいのは、
カスタムの所をクリックして→カラーコードを入れて、いちいち設定しなくても、
あらかじめ規定されていた赤・黒・・・とかの色と同じように、
自分のカスタマイズした色を規定されているものと同じように入っててほしい。という事です。

伝達力なく、申し訳ございません。
気にかけて頂き、ありがとうございます。