カラーパレットを設定する

【関数】add_theme_support( ‘editor-color-palette’ )
カラーパレットの色を自由に指定することができる。該当のパレットの色を選択するとslug名の後に「has-」、後に「-background-color」(背景色の場合)または「-color」(文字色の場合)というクラス名が自動生成され、そのブロックに付与される。そのため、生成されるクラス名に対応した記述がCSS側に必要になる。

add_theme_support(
  'editor-color-palette',
  array(
    'name' => 'アクセントカラー',  //色の名前
    'slug' => 'accent-color',  //自動生成されるCSSのクラス名で使用される文字列
    'color' => '#3D8CB8'  //色の指定
  ),
);
.has-accent-color-background-color{
  background-color: #3D8CB8;
}
.has-accent-color-color{
  color: #3D8CB8;
}
inserted by FC2 system