WordPress 5.4通过一些新的主题API允许您的主题在封面( Cover )和按钮(Buttons)块中使用渐变作为背景。这些新的API与颜色和字体API的方法类似。
配置预定义的渐变集
首先配置一组预定义的渐变集。使用theme-support
选项执行此操作editor-gradient-presets
,然后传递一个代表渐变集的数组:
add_theme_support( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'editor-gradient-presets\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', array(array( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'name\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => __( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'Vivid cyan blue to vivid purple\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'themeLangDomain\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' ), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'gradient\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'linear-gradient(135deg,rgba(6,147,227,1) 0%,rgb(155,81,224) 100%)\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'slug\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'vivid-cyan-blue-to-vivid-purple\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'),array( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'name\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => __( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'Vivid green cyan to vivid cyan blue\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'themeLangDomain\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' ), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'gradient\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'linear-gradient(135deg,rgba(0,208,132,1) 0%,rgba(6,147,227,1) 100%)\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'slug\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'vivid-green-cyan-to-vivid-cyan-blue\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',),array( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'name\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => __( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'Light green cyan to vivid green cyan\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'themeLangDomain\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' ), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'gradient\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%)\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'slug\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'light-green-cyan-to-vivid-green-cyan\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',),array( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'name\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => __( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'Luminous vivid amber to luminous vivid orange\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'themeLangDomain\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' ), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'gradient\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'linear-gradient(135deg,rgba(252,185,0,1) 0%,rgba(255,105,0,1) 100%)\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'slug\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'luminous-vivid-amber-to-luminous-vivid-orange\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',),array( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'name\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => __( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'Luminous vivid orange to vivid red\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'themeLangDomain\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' ), \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'gradient\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'linear-gradient(135deg,rgba(255,105,0,1) 0%,rgb(207,46,46) 100%)\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'slug\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' => \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'luminous-vivid-orange-to-vivid-red\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\',), ) );
有关更多信息,请参见https://developer.wordpress.org/block-editor/developers/themes/theme-support/#block-gradient-presets。
禁用自定义渐变
您还可以禁用自定义渐变:
add_theme_support( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'disable-custom-gradients\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' );
此回调将您的用户限制为您在块编辑器中定义或添加到editor-gradient-presets
主题支持设置的默认渐变集。
有关更多信息,请参见https://developer.wordpress.org/block-editor/developers/themes/theme-support/#disabling-custom-gradients。
禁用渐变功能
您还可以使用这些API完全关闭渐变功能。只需结合这两个回调:
add_theme_support( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'disable-custom-gradients\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\' ); add_theme_support( \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\'editor-gradient-presets\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\', array() );