WP_Theme_JSON_Data::update_with( array $new_data ): WP_Theme_JSON_Data

User Contributed Notes

1. Skip to note 2 content

   Deepak Rajpal 11 months ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 0You must log in to vote on the helpfulness of this note

   This is a sample code to filter default theme.json file with PHP. This will merge additional settings (such as color, typography and layout etc) into the default theme.json file and you will see these options in Editor. [Appearances > Editor > Sytles icon].

   function wpdocs_filter_theme_json_data_callback( $theme_json ) {
       $new_data = array(
           'version' => 2,
           'settings' => array(
               'color' => array(
                   'palette' => array(
                       array(
                           'slug' => 'ti-bg',
                           'color' => '#00FF34',
                           'name' => 'Background'
                       ),
                       array(
                           'slug' => 'ti-fg',
                           'color' => '#006855',
                           'name' => 'Foreground'
                       ),
                       array(
                           'slug' => 'ti-bg-alt',
                           'color' => '#37EA75',
                           'name' => 'Background Alt'
                       ),
                       array(
                           'slug' => 'ti-bg-inv',
                           'color' => '#1A1934',
                           'name' => 'Background Dark'
                       ),
                       array(
                           'slug' => 'ti-fg-alt',
                           'color' => '#FBFB66',
                           'name' => 'Foreground Alt'
                       ),
                       array(
                           'slug' => 'ti-accent',
                           'color' => '#235D66',
                           'name' => 'Accent'
                       )
                   ),
               ),
               'typography' => array(
                   'lineHeight' => true,
                   'customFontSize' => true,
                   'fontFamilies' => array(
                       array(
                           'fontFace' => array(
                               array(
                                   'fontDisplay' => 'swap',
                                   'fontFamily' => 'Open Sans',
                                   'fontStretch' => 'normal',
                                   'fontStyle' => 'normal',
                                   'fontWeight' => '160 700',
                                   'src' => array(
                                       'file: https://fonts-static.cdn-one.com/fonts/google/open-sans/open-sans-300.woff'
                                   )
                               )
                           ),
                           'fontFamily' => 'Open Sans', 'sans-serif',
                           'name' => 'Open Sans',
                           'slug' => 'open-sans'
                       )
                   ),
                   'fontSizes' => array(
                       array(
                           'slug' => 'small',
                           'size' => '14px',
                           'name' => 'Small'
                       ),
                       array(
                           'slug' => 'normal',
                           'size' => '18px',
                           'name' => 'Normal'
                       )
                   )
               ),
               'layout' => array(
                   'contentSize' => '740px',
                   'wideSize' => '1040px'
               )
           ),
       );
   
       return $theme_json->update_with( $new_data );
   }
   
   add_filter( 'wp_theme_json_data_theme', 'wpdocs_filter_theme_json_data_callback' );