WordPress.org

Make WordPress Core

Changeset 43793


Ignore:
Timestamp:
10/22/2018 10:37:18 PM (13 months ago)
Author:
davidakennedy
Message:

Twenty Ten: Add styles and support for the new block-based editor.

This update adds styles and theme support related to the new block-based editor to enhance the experience of using it with Twenty Ten.

These are the specific changes made to this theme:

  • Add blocks.css, to style blocks on the front end, to make sure they match the theme’s existing HTML element styles.
  • Add editor-blocks.css to style blocks in the editor, to make sure they match the theme’s existing HTML element styles.
  • Add theme support for editor-styles, to pull the existing editor stylesheet into the new editor.
  • Add theme support for wp-block-styles, to load the default block styles on the front end.
  • Add theme support for editor-color-palette, to load a color palette based on the theme’s color scheme into the block-based editor.

Props nielslange, crunnells, laurelfulford.
Fixes #45038.

Location:
branches/5.0/src/wp-content/themes/twentyten
Files:
2 added
1 edited

Legend:

Unmodified
Added
Removed
  • branches/5.0/src/wp-content/themes/twentyten/functions.php

    r41756 r43793  
    7575    // This theme styles the visual editor with editor-style.css to match the theme style.
    7676    add_editor_style();
     77
     78    // Load regular editor styles into the new block-based editor.
     79    add_theme_support( 'editor-styles' );
     80
     81    // Load default block styles.
     82    add_theme_support( 'wp-block-styles' );
     83
     84        // Add support for custom color scheme.
     85    add_theme_support( 'editor-color-palette', array(
     86        array(
     87            'name'  => __( 'Blue', 'twentyten' ),
     88            'slug'  => 'blue',
     89            'color' => '#0066cc',
     90        ),
     91        array(
     92            'name'  => __( 'Black', 'twentyten' ),
     93            'slug'  => 'black',
     94            'color' => '#000',
     95        ),
     96        array(
     97            'name'  => __( 'Medium Gray', 'twentyten' ),
     98            'slug'  => 'medium-gray',
     99            'color' => '#666',
     100        ),
     101        array(
     102            'name'  => __( 'Light Gray', 'twentyten' ),
     103            'slug'  => 'light-gray',
     104            'color' => '#f1f1f1',
     105        ),
     106        array(
     107            'name'  => __( 'White', 'twentyten' ),
     108            'slug'  => 'white',
     109            'color' => '#fff',
     110        ),
     111    ) );
    77112
    78113    // Post Format support. You can also use the legacy "gallery" or "asides" (note the plural) categories.
     
    613648}
    614649add_filter( 'widget_tag_cloud_args', 'twentyten_widget_tag_cloud_args' );
     650
     651/**
     652 * Enqueue scripts and styles for front end.
     653 *
     654 * @since Twenty Ten 2.6
     655 */
     656function twentyten_scripts_styles() {
     657    // Theme block stylesheet.
     658    wp_enqueue_style( 'twentyten-block-style', get_template_directory_uri() . '/blocks.css', array(), '20181018' );
     659}
     660add_action( 'wp_enqueue_scripts', 'twentyten_scripts_styles' );
     661
     662/**
     663 * Enqueue editor styles for Gutenberg
     664 *
     665 * @since Twenty Ten 2.6
     666 */
     667function twentyten_block_editor_styles() {
     668    // Block styles.
     669    wp_enqueue_style( 'twentyten-block-editor-style', get_template_directory_uri() . '/editor-blocks.css' );
     670}
     671add_action( 'enqueue_block_editor_assets', 'twentyten_block_editor_styles' );
     672
     673
Note: See TracChangeset for help on using the changeset viewer.