tag in the document head, and expect WordPress to * provide it for us. */ add_theme_support( 'title-tag' ); /* * Enable support for Post Thumbnails on posts and pages. * * @link https://developer.wordpress.org/themes/functionality/featured-images-post-thumbnails/ */ add_theme_support( 'post-thumbnails' ); // Custom logo $defaults = array( 'flex-height' => true, 'flex-width' => true, ); add_theme_support( 'custom-logo', $defaults ); // This theme uses wp_nav_menu() in two locations. register_nav_menus( array( 'primary' => esc_html__( 'Primary', 'the-m-x' ), 'social' => esc_html__( 'Social Profiles', 'the-m-x' ), ) ); /* * Switch default core markup for search form, comment form, and comments * to output valid HTML5. */ add_theme_support( 'html5', array( 'search-form', 'comment-form', 'comment-list', 'gallery', 'caption', ) ); /* * Enable support for Post Formats. * See https://developer.wordpress.org/themes/functionality/post-formats/ */ add_theme_support( 'post-formats', array( 'aside', 'audio', 'gallery', 'image', 'link', 'quote', 'video', ) ); // Set up the WordPress core custom background feature. add_theme_support( 'custom-background', apply_filters( 'the_mx_custom_background_args', array( 'default-color' => 'efebe9', 'default-image' => '', ) ) ); // Custom image sizes add_image_size( 'the-mx-gallery-thumb', 300, 300, array( 'center', 'center' ) ); // Selective Refresh on widgets add_theme_support( 'customize-selective-refresh-widgets' ); // Support for Gutenberg $primary_color_bg_1 = the_mx_hex_to_rgb( get_theme_mod( 'the_mx_primary_1', '#795548' ) ); $primary_color_bg_1_rgb = vsprintf( 'rgb( %1$s, %2$s, %3$s )', $primary_color_bg_1 ); $primary_color_bg_1_rgba_0pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.0 )', $primary_color_bg_1 ); $primary_color_bg_2 = the_mx_hex_to_rgb( get_theme_mod( 'the_mx_primary_2', '#5d4037' ) ); $primary_color_bg_2_rgb = vsprintf( 'rgb( %1$s, %2$s, %3$s )', $primary_color_bg_2 ); $primary_color_bg_2_rgba_0pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.0 )', $primary_color_bg_2 ); $accent_color_bg_1 = the_mx_hex_to_rgb( get_theme_mod( 'the_mx_accent_1', '#ffc107' ) ); $accent_color_bg_1_rgb = vsprintf( 'rgb( %1$s, %2$s, %3$s )', $accent_color_bg_1 ); $accent_color_bg_1_rgba_0pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.0 )', $accent_color_bg_1 ); $accent_color_bg_2 = the_mx_hex_to_rgb( get_theme_mod( 'the_mx_accent_2', '#ffa000' ) ); $accent_color_bg_2_rgb = vsprintf( 'rgb( %1$s, %2$s, %3$s )', $accent_color_bg_2 ); $accent_color_bg_2_rgba_0pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.0 )', $accent_color_bg_2 ); add_theme_support( 'align-wide' ); add_theme_support( 'editor-color-palette', array( array( 'name' => esc_html__( 'White', 'the-m-x' ), 'slug' => 'white', 'color' => '#ffffff', ), array( 'name' => esc_html__( 'Black', 'the-m-x' ), 'slug' => 'black', 'color' => '#000000', ), array( 'name' => esc_html__( 'Primary Color', 'the-m-x' ), 'slug' => 'primary-1', 'color' => esc_html( get_theme_mod( 'the_mx_primary_1' ) ), ), array( 'name' => esc_html__( 'Primary Color Dark Variant', 'the-m-x' ), 'slug' => 'primary-2', 'color' => esc_html( get_theme_mod( 'the_mx_primary_2' ) ), ), array( 'name' => esc_html__( 'Primary Color Darker Variant', 'the-m-x' ), 'slug' => 'primary-3', 'color' => esc_html( get_theme_mod( 'the_mx_primary_3' ) ), ), array( 'name' => esc_html__( 'Primary Color Light Variant', 'the-m-x' ), 'slug' => 'primary-4', 'color' => esc_html( get_theme_mod( 'the_mx_primary_4' ) ), ), array( 'name' => esc_html__( 'Accent Color', 'the-m-x' ), 'slug' => 'accent-1', 'color' => esc_html( get_theme_mod( 'the_mx_accent_1' ) ), ), array( 'name' => esc_html__( 'Accent Color Dark Variant', 'the-m-x' ), 'slug' => 'accent-2', 'color' => esc_html( get_theme_mod( 'the_mx_accent_2' ) ), ), array( 'name' => esc_html__( 'Accent Color Darker Variant', 'the-m-x' ), 'slug' => 'accent-3', 'color' => esc_html( get_theme_mod( 'the_mx_accent_3' ) ), ), ) ); add_theme_support( 'editor-gradient-presets', array( array( 'name' => esc_html__( 'Primary Color gradient', 'the-m-x' ), 'gradient' => 'linear-gradient(180deg, ' . esc_attr( $primary_color_bg_1_rgb ) . ' 0%, ' . esc_attr( $primary_color_bg_2_rgb ) . ' 100%)', 'slug' => 'primary-1', ), array( 'name' => esc_html__( 'Secondary Color gradient', 'the-m-x' ), 'gradient' => 'linear-gradient(180deg, ' . esc_attr( $accent_color_bg_1_rgb ) . ' 0%, ' . esc_attr( $accent_color_bg_2_rgb ) . ' 100%)', 'slug' => 'accent-1', ), array( 'name' => esc_html__( 'Primary Color translucent gradient', 'the-m-x' ), 'gradient' => 'linear-gradient(180deg, ' . esc_attr( $primary_color_bg_1_rgba_0pcnt ) . ' 0%, ' . esc_attr( $primary_color_bg_2_rgba_0pcnt ) . ' 100%)', 'slug' => 'primary-1-translucent', ), array( 'name' => esc_html__( 'Accent Color translucent gradient', 'the-m-x' ), 'gradient' => 'linear-gradient(180deg, ' . esc_attr( $accent_color_bg_1_rgba_0pcnt ) . ' 0%, ' . esc_attr( $accent_color_bg_2_rgba_0pcnt ) . ' 100%)', 'slug' => 'accent-1-translucent', ) ) ); add_theme_support( 'editor-styles' ); add_editor_style( array( 'css/source/gutenberg-editor-styles.css', the_mx_editor_override_filepaths() ) ); } endif; add_action( 'after_setup_theme', 'the_mx_setup' ); /* Function that adds custom colors to front end from Gutenberg colors */ function the_mx_gutenberg_colors() { $primary_1 = get_theme_mod( 'the_mx_primary_1', '#795548' ); $primary_2 = get_theme_mod( 'the_mx_primary_2', '#5d4037' ); $primary_3 = get_theme_mod( 'the_mx_primary_3', '#3e2723' ); $primary_4 = get_theme_mod( 'the_mx_primary_4', '#bcaaa4' ); $accent_1 = get_theme_mod( 'the_mx_accent_1', '#ffc107' ); $accent_2 = get_theme_mod( 'the_mx_accent_2', '#ffa000' ); $accent_3 = get_theme_mod( 'the_mx_accent_3', '#ff6f00' ); $primary_color_bg_1 = the_mx_hex_to_rgb( $primary_1 ); $primary_color_bg_1_rgb = vsprintf( 'rgb( %1$s, %2$s, %3$s )', $primary_color_bg_1 ); $primary_color_bg_1_rgba_0pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.0 )', $primary_color_bg_1 ); $accent_color_bg_1 = the_mx_hex_to_rgb( $accent_1 ); $accent_color_bg_1_rgb = vsprintf( 'rgb( %1$s, %2$s, %3$s )', $accent_color_bg_1 ); $accent_color_bg_1_rgba_0pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.0 )', $accent_color_bg_1 ); $primary_color_bg_2 = the_mx_hex_to_rgb( $primary_2 ); $primary_color_bg_2_rgb = vsprintf( 'rgb( %1$s, %2$s, %3$s )', $primary_color_bg_2 ); $primary_color_bg_2_rgba_04pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.04 )', $primary_color_bg_2 ); $primary_color_bg_2_rgba_12pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.12 )', $primary_color_bg_2 ); $accent_color_bg_2 = the_mx_hex_to_rgb( $accent_2 ); $accent_color_bg_2_rgb = vsprintf( 'rgb( %1$s, %2$s, %3$s )', $accent_color_bg_2 ); $accent_color_bg_2_rgba_04pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.04 )', $accent_color_bg_2 ); $accent_color_bg_2_rgba_12pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.12 )', $accent_color_bg_2 ); $css = ''; $css = ' /* Block Editor colors / Solid backgrounds */ .has-white-color, .has-white-color:hover, .has-white-color:focus, .is-style-outline .wp-block-button__link.has-white-color { color: rgba(255, 255, 255, 0.87); } .has-white-background-color, .is-style-outline .wp-block-button__link.has-white-background-color { background-color: #ffffff; } .has-black-color, .has-black-color:hover, .has-black-color:focus, .is-style-outline .wp-block-button__link.has-black-color { color: rgba(0, 0, 0, 0.87); } .has-black-background-color, .is-style-outline .wp-block-button__link.has-black-background-color { background-color: #000000; } .has-primary-1-color, .has-primary-1-color:hover, .has-primary-1-color:focus, .is-style-outline .wp-block-button__link.has-primary-1-color { color: ' . esc_attr( $primary_1 ) . '; } .has-primary-1-background-color, .is-style-outline .wp-block-button__link.has-primary-1-background-color { background-color: ' . esc_attr( $primary_1 ) . '; } .has-primary-2-color, .has-primary-2-color:hover, .has-primary-2-color:focus, .is-style-outline .wp-block-button__link.has-primary-2-color { color: ' . esc_attr( $primary_2 ) . '; } .has-primary-2-background-color, .is-style-outline .wp-block-button__link.has-primary-2-background-color { background-color: ' . esc_attr( $primary_2 ) . '; } .has-primary-3-color, .has-primary-3-color:hover, .has-primary-3-color:focus, .is-style-outline .wp-block-button__link.has-primary-3-color { color: ' . esc_attr( $primary_3 ) . '; } .has-primary-3-background-color, .is-style-outline .wp-block-button__link.has-primary-3-background-color { background-color: ' . esc_attr( $primary_3 ) . '; } .has-primary-4-color, .has-primary-4-color:hover, .has-primary-3-color:focus, .is-style-outline .wp-block-button__link.has-primary-4-color { color: ' . esc_attr( $primary_4 ) . '; } .has-primary-4-background-color, .is-style-outline .wp-block-button__link.has-primary-4-background-color { background-color: ' . esc_attr( $primary_4 ) . '; } .has-accent-1-color, .has-accent-1-color:hover, .has-accent-1-color:focus, .is-style-outline .wp-block-button__link.has-accent-1-color { color: ' . esc_attr( $accent_1 ) . '; } .has-accent-1-background-color, .is-style-outline .wp-block-button__link.has-accent-1-background-color { background-color: ' . esc_attr( $accent_1 ) . '; } .has-accent-2-color, .has-accent-2-color:hover, .has-accent-2-color:focus, .is-style-outline .wp-block-button__link.has-accent-2-color { color: ' . esc_attr( $accent_2 ) . '; } .has-accent-2-background-color, .is-style-outline .wp-block-button__link.has-accent-2-background-color { background-color: ' . esc_attr( $accent_2 ) . '; } .has-accent-3-color, .has-accent-3-color:hover, .has-accent-3-color:focus, .is-style-outline .wp-block-button__link.has-accent-3-color { color: ' . esc_attr( $accent_3 ) . '; } .has-accent-3-background-color, .is-style-outline .wp-block-button__link.has-accent-3-background-color { background-color: ' . esc_attr( $accent_3 ) . '; } /* Gradient backgrounds */ .has-primary-1-gradient-background, .has-primary-1-gradient-background:active, .has-primary-1-gradient-background:hover { background: linear-gradient(180deg, ' . esc_attr( $primary_color_bg_1_rgb ) . ' 0%, ' . esc_attr( $primary_color_bg_2_rgb ) . ' 100%); } .wp-block-button__link.has-primary-1-translucent-gradient-background:hover { background: linear-gradient(180deg, ' . esc_attr( $primary_color_bg_1_rgba_0pcnt ) . ' 0%, ' . esc_attr( $primary_color_bg_2_rgba_04pcnt ) . ' 100%); } .wp-block-button__link.has-primary-1-translucent-gradient-background:active, .wp-block-button__link.has-primary-1-translucent-gradient-background:focus { background: linear-gradient(180deg, ' . esc_attr( $primary_color_bg_1_rgba_0pcnt ) . ' 0%, ' . esc_attr( $primary_color_bg_2_rgba_12pcnt ) . ' 100%); } .has-accent-1-gradient-background, .has-accent-1-gradient-background:active, .has-accent-1-gradient-background:hover { background: linear-gradient(180deg, ' . esc_attr( $accent_color_bg_1_rgb ) . ' 0%, ' . esc_attr( $accent_color_bg_2_rgb ) . ' 100%); } .wp-block-button__link.has-accent-1-translucent-gradient-background:hover { background: linear-gradient(180deg, ' . esc_attr( $accent_color_bg_1_rgba_0pcnt ) . ' 0%, ' . esc_attr( $accent_color_bg_2_rgba_04pcnt ) . ' 100%); } .wp-block-button__link.has-accent-1-translucent-gradient-background:active, .wp-block-button__link.has-accent-1-translucent-gradient-background:focus { background: linear-gradient(180deg, ' . esc_attr( $accent_color_bg_1_rgba_0pcnt ) . ' 0%, ' . esc_attr( $accent_color_bg_2_rgba_12pcnt ) . ' 100%); } .is-style-outline .wp-block-button__link.has-primary-1-translucent-gradient-background:hover, .is-style-outline .wp-block-button__link.has-primary-1-translucent-gradient-background:active, .is-style-outline .wp-block-button__link.has-primary-1-translucent-gradient-background:focus, .is-style-outline .wp-block-button__link.has-accent-1-translucent-gradient-background:hover, .is-style-outline .wp-block-button__link.has-accent-1-translucent-gradient-background:active, .is-style-outline .wp-block-button__link.has-accent-1-translucent-gradient-background:focus { background-color: transparent; }'; return wp_strip_all_tags( $css ); } function the_mx_gutenberg_editor_color_overrides() { $color_choices = get_theme_mod( 'the_mx_color_scheme', 'default' ); wp_enqueue_style( 'the-mx-gutenberg-styles', get_theme_file_uri( '/css/source/gutenberg-editor-styles.css' ), false ); switch ( $color_choices ) { case 'blue_gray': wp_enqueue_style( 'the-mx-gutenberg-override-deep-purple', get_theme_file_uri( '/css/source/editor-style-blue-gray.css' ), array( 'the-mx-gutenberg-styles' ), '', false ); break; case 'deep_purple': wp_enqueue_style( 'the-mx-gutenberg-override-deep-purple', get_theme_file_uri( '/css/source/editor-style-deep-purple.css' ), array( 'the-mx-gutenberg-styles' ), '', false ); break; case 'pale_orange': wp_enqueue_style( 'the-mx-gutenberg-override-pale-orange', get_theme_file_uri( '/css/source/editor-style-pale-orange.css' ), array( 'the-mx-gutenberg-styles' ), '', false ); break; case 'black': wp_enqueue_style( 'the-mx-gutenberg-override-black', get_theme_file_uri( '/css/source/editor-style-black.css' ), array( 'the-mx-gutenberg-styles' ), '', false ); break; case 'white': wp_enqueue_style( 'the-mx-gutenberg-override-white', get_theme_file_uri( '/css/source/editor-style-white.css' ), array( 'the-mx-gutenberg-styles' ), '', false ); break; case 'custom': wp_add_inline_style( 'the-mx-gutenberg-styles', the_mx_editor_custom_override() ); break; default: // do nothing break; } } add_action( 'enqueue_block_editor_assets', 'the_mx_gutenberg_editor_color_overrides' ); function the_mx_editor_override_filepaths() { $color_choices = get_theme_mod( 'the_mx_color_scheme', 'default' ); switch ( $color_choices ) { case 'blue_gray': return '/css/source/editor-style-blue-gray.css'; break; case 'deep_purple': return '/css/source/editor-style-deep-purple.css'; break; case 'pale_orange': return '/css/source/editor-style-pale-orange.css'; break; case 'black': return '/css/source/editor-style-black.css'; break; case 'white': return '/css/source/editor-style-white.css'; break; default: // do nothing break; } } function the_mx_editor_custom_override() { $background_color = get_background_color(); $primary_color_1 = get_theme_mod( 'the_mx_primary_1' ); $primary_color_2 = get_theme_mod( 'the_mx_primary_2' ); $primary_color_3 = get_theme_mod( 'the_mx_primary_3' ); $primary_color_4 = get_theme_mod( 'the_mx_primary_4' ); $accent_color_1 = get_theme_mod( 'the_mx_accent_1' ); $accent_color_2 = get_theme_mod( 'the_mx_accent_2' ); $accent_color_3 = get_theme_mod( 'the_mx_accent_3' ); $color_outline_button = the_mx_hex_to_rgb( get_theme_mod( 'the_mx_primary_1' ) ); $color_outline_button_bg_hover = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.04 )', $color_outline_button ); $color_outline_button_bg_focus = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.12 )', $color_outline_button ); $primary_color_bg_1 = $color_outline_button; $primary_color_bg_2 = the_mx_hex_to_rgb( $primary_color_2 ); $accent_color_bg_1 = the_mx_hex_to_rgb( $accent_color_1 ); $accent_color_bg_2 = the_mx_hex_to_rgb( $accent_color_2 ); $primary_color_bg_1_rgba_0pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.0 )', $primary_color_bg_1 ); $primary_color_bg_2_rgba_04pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.04 )', $primary_color_bg_2 ); $primary_color_bg_2_rgba_12pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.12 )', $primary_color_bg_2 ); $accent_color_bg_1_rgba_0pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.0 )', $accent_color_bg_1 ); $accent_color_bg_2_rgba_04pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.04 )', $accent_color_bg_2 ); $accent_color_bg_2_rgba_12pcnt = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.12 )', $accent_color_bg_2 ); $css = ' .editor-styles-wrapper a { color: ' . esc_attr( $primary_color_1 ) . ' !important; } .editor-styles-wrapper a:focus { color: ' . esc_attr( $primary_color_2 ) . ' !important; } .editor-styles-wrapper blockquote.wp-block-quote.is-style-default, .editor-styles-wrapper blockquote.wp-block-quote.is-style-large, .editor-styles-wrapper .wp-block-freeform.block-library-rich-text__tinymce blockquote, .editor-styles-wrapper figure.wp-block-pullquote { border-color: ' . esc_attr( $primary_color_1 ) . '; } .editor-styles-wrapper div.wp-block-button__link { background-color: ' . esc_attr( $accent_color_1 ) . '; } .editor-styles-wrapper div.wp-block-button__link:hover { background-color: ' . esc_attr( $accent_color_2 ) . '; } .editor-styles-wrapper .is-style-outline div.wp-block-button__link { color: ' . esc_attr( $primary_color_2 ) . '; } .editor-styles-wrapper .is-style-outline div.wp-block-button__link:hover { background-color: ' . esc_attr( $color_outline_button_bg_hover ) . '; } .editor-styles-wrapper .is-style-outline div.wp-block-button__link:active, .editor-styles-wrapper .is-style-outline div.wp-block-button__link:focus { background-color: ' . esc_attr( $color_outline_button_bg_focus ) . '; } .editor-styles-wrapper div.wp-block-button__link.has-primary-1-translucent-gradient-background:hover { background: linear-gradient(180deg, ' . esc_attr( $primary_color_bg_1_rgba_0pcnt ) . ' 0%, ' . esc_attr( $primary_color_bg_2_rgba_04pcnt ) . ' 100%) !important; } .editor-styles-wrapper div.wp-block-button__link.has-primary-1-translucent-gradient-background:active, .editor-styles-wrapper div.wp-block-button__link.has-primary-1-translucent-gradient-background:focus { background: linear-gradient(180deg, ' . esc_attr( $primary_color_bg_1_rgba_0pcnt ) . ' 0%, ' . esc_attr( $primary_color_bg_2_rgba_12pcnt ) . ' 100%) !important; } .editor-styles-wrapper div.wp-block-button__link.has-accent-1-translucent-gradient-background:hover { background: linear-gradient(180deg, ' . esc_attr( $accent_color_bg_1_rgba_0pcnt ) . ' 0%, ' . esc_attr( $accent_color_bg_2_rgba_04pcnt ) . ' 100%) !important; } .editor-styles-wrapper div.wp-block-button__link.has-accent-1-translucent-gradient-background:active, .editor-styles-wrapper div.wp-block-button__link.has-accent-1-translucent-gradient-background:focus { background: linear-gradient(180deg, ' . esc_attr( $accent_color_bg_1_rgba_0pcnt ) . ' 0%, ' . esc_attr( $accent_color_bg_2_rgba_12pcnt ) . ' 100%) !important; } .wp-block-calendar table caption { background-color: ' . esc_attr( $primary_color_1 ) . ' !important; } .wp-block-calendar table th { background-color: #' . esc_attr( $background_color ) . ' !important; }'; return $css; } function the_mx_image_sizes( $sizes ) { $addsizes = array( 'the-mx-gallery-thumb' => esc_html__( 'Gallery Thumbnail (300 x 300, hard cropped)', 'the-m-x' ), ); $newsizes = array_merge( $sizes, $addsizes ); return $newsizes; } add_filter( 'image_size_names_choose', 'the_mx_image_sizes' ); /** * Set the content width in pixels, based on the theme's design and stylesheet. * * Priority 0 to make it available to lower priority callbacks. * * @global int $content_width */ function the_mx_content_width() { $GLOBALS['content_width'] = apply_filters( 'the_mx_content_width', 960 ); } add_action( 'after_setup_theme', 'the_mx_content_width', 0 ); /** * Register widget area. * * @link https://developer.wordpress.org/themes/functionality/sidebars/#registering-a-sidebar */ function the_mx_widgets_init() { register_sidebar( array( 'name' => esc_html__( 'Sidebar', 'the-m-x' ), 'id' => 'sidebar-1', 'description' => esc_html__( 'Add widgets to the Sidebar.', 'the-m-x' ), 'before_widget' => '
', 'before_title' => '