Add header image and Add inline logo and title

This commit is contained in:
te2dy 2021-04-07 08:58:37 +02:00
parent 034787a7b3
commit 19740ca949
7 changed files with 199 additions and 40 deletions

View file

@ -15,12 +15,12 @@ if ( ! function_exists( 'marianne_setup' ) ) {
* @return void
*/
function marianne_setup() {
// Load translation files.
// Loads translation files.
load_theme_textdomain( 'marianne', get_template_directory() . '/languages' );
$marianne_page_width = marianne_get_theme_mod( 'marianne_global_page_width' );
// Set content-width.
// Sets content-width.
if ( ! isset( $content_width ) ) {
$content_width = absint( $marianne_page_width );
}
@ -28,11 +28,11 @@ if ( ! function_exists( 'marianne_setup' ) ) {
// Add default posts and comments RSS feed links to head.
add_theme_support( 'automatic-feed-links' );
// Let WordPress use default document title.
// Lets WordPress use default document title.
add_theme_support( 'title-tag' );
/**
* Add support for custom logo.
* Adds support for custom logo.
*
* @link https://codex.wordpress.org/Theme_Logo
*/
@ -51,7 +51,7 @@ if ( ! function_exists( 'marianne_setup' ) ) {
)
);
// Register the main menu.
// Registers the menus.
register_nav_menus(
array(
'primary' => __( 'Primary Menu', 'marianne' ),
@ -60,7 +60,7 @@ if ( ! function_exists( 'marianne_setup' ) ) {
);
/*
* Enable support for Post Thumbnails on posts and pages
* Enables support for Post Thumbnails on posts and pages
*
* @link https://developer.wordpress.org/themes/functionality/featured-images-post-thumbnails/
*
@ -70,7 +70,7 @@ if ( ! function_exists( 'marianne_setup' ) ) {
add_image_size( 'marianne-thumbnails', absint( $marianne_page_width ) );
add_image_size( 'marianne-thumbnails-retina', ( absint( $marianne_page_width ) * 2 ) );
// Add support for responsive oEmbed content.
// Adds support for responsive oEmbed content.
add_theme_support( 'responsive-embeds' );
// HTML5 support.
@ -87,6 +87,22 @@ if ( ! function_exists( 'marianne_setup' ) ) {
'style',
)
);
/**
* Adds support for header image.
*
* @since Marianne 1.4
*/
add_theme_support(
'custom-header',
array(
'width' => absint( $marianne_page_width ),
'height' => 200,
'flex-height' => true,
'flex-width' => true,
'header-text' => true,
)
);
}
add_action( 'after_setup_theme', 'marianne_setup' );

View file

@ -47,29 +47,12 @@
$marianne_page_class .= ' page-width-' . esc_attr( marianne_get_theme_mod( 'marianne_global_page_width' ) );
?>
<div id="page" <?php marianne_add_class( $marianne_page_class, false ); ?>>
<?php
$marianne_header_class = 'site-header';
$marianne_header_class .= ' site-header-align-' . esc_attr( marianne_get_theme_mod( 'marianne_header_align' ) );
if ( false === marianne_get_theme_mod( 'marianne_header_logo_title_inline' ) ) {
$marianne_header_template = 'default';
} else {
$marianne_header_template = 'inline-logo-title';
}
get_template_part( 'template-parts/header', $marianne_header_template );
?>
<header id="header" <?php marianne_add_class( $marianne_header_class, false ); ?> role="banner">
<?php
$marianne_logo_class = 'site-logo';
if ( true === marianne_get_theme_mod( 'marianne_header_logo_round' ) ) {
$marianne_logo_class .= ' image-circular';
}
marianne_logo( $marianne_logo_class );
marianne_site_title();
marianne_site_description();
if ( 'header' === marianne_get_theme_mod( 'marianne_social_location' ) ) {
marianne_social_link( 'header' );
}
marianne_menu_primary();
?>
</header>

View file

@ -295,6 +295,14 @@ if ( ! function_exists( 'marianne_customize_register' ) ) {
'live' => true,
);
$marianne_customizer_options[] = array(
'section' => 'marianne_header',
'id' => 'logo_title_inline',
'title' => __( 'Put the logo and the title on the same line.', 'marianne' ),
'description' => __( 'Default: unchecked', 'marianne' ),
'type' => 'checkbox',
);
$marianne_customizer_options[] = array(
'section' => 'marianne_header',
'id' => 'logo_round',
@ -779,13 +787,14 @@ if ( ! function_exists( 'marianne_options_default' ) ) {
'marianne_global_text_shadow' => false,
// Header Settings.
'marianne_header_align' => 'left',
'marianne_header_title_weight' => 'bolder',
'marianne_header_desc_weight' => 'normal',
'marianne_header_desc_style' => 'normal',
'marianne_header_logo_round' => false,
'marianne_header_menu_search' => false,
'marianne_header_menu_search_text' => '',
'marianne_header_align' => 'left',
'marianne_header_logo_title_inline' => false,
'marianne_header_title_weight' => 'bolder',
'marianne_header_desc_weight' => 'normal',
'marianne_header_desc_style' => 'normal',
'marianne_header_logo_round' => false,
'marianne_header_menu_search' => false,
'marianne_header_menu_search_text' => '',
// Content Formatting.
'marianne_content_text_align' => 'left',

View file

@ -21,10 +21,21 @@ if ( ! function_exists( 'marianne_logo' ) ) {
*/
function marianne_logo( $class = 'site-logo' ) {
if ( has_custom_logo() ) {
if ( true === display_header_text() ) {
$container = 'div';
} else {
if ( is_front_page() && ! is_paged() ) {
$container = 'h1';
} elseif ( is_front_page() || is_home() ) {
$container = 'h1';
} else {
$container = 'div';
}
}
?>
<div<?php marianne_add_class( $class ); ?>>
<<?php echo esc_html( $container ); ?> <?php marianne_add_class( $class, false ); ?>>
<?php the_custom_logo(); ?>
</div>
</<?php echo esc_html( $container ); ?>>
<?php
}
}
@ -622,3 +633,58 @@ if ( ! function_exists( 'marianne_post_links' ) ) {
}
}
}
if ( ! function_exists( 'marianne_header_image' ) ) {
/**
* The header image of the site.
*
* @return void
*
* @since Marianne 1.3
*/
function marianne_header_image() {
if ( has_header_image() ) {
$header_img_src = get_header_image();
$header_img_id = attachment_url_to_postid( get_header_image() );
$header_img_data = wp_get_attachment_metadata( $header_img_id );
$header_img_width = absint( $header_img_data['width'] );
$header_img_height = absint( $header_img_data['height'] );
$header_img_responsive_attr = '';
if ( $header_img_width && $header_img_height ) {
$header_img_size_array = array( $header_img_width, $header_img_height );
$header_img_srcset_value = wp_calculate_image_srcset( $header_img_size_array, $header_img_src, $header_img_data );
$header_img_sizes_value = wp_calculate_image_sizes( $header_img_size_array, $header_img_src, $header_img_data );
if ( $header_img_srcset_value && $header_img_sizes_value ) {
$header_img_responsive_attr = 'srcset="' . esc_attr( $header_img_srcset_value ) . '" sizes="' . esc_attr( $header_img_sizes_value ) . '"';
}
}
if ( true === display_header_text() || has_custom_logo() ) {
$container = 'div';
$header_img_alt = get_post_meta( $header_img_id, '_wp_attachment_image_alt', true );
} else {
if ( is_front_page() && ! is_paged() ) {
$container = 'h1';
} elseif ( is_front_page() || is_home() ) {
$container = 'h1';
} else {
$container = 'div';
}
$header_img_alt = get_bloginfo( 'name' );
}
?>
<<?php echo esc_html( $container ); ?> class="site-header-image-container">
<img class="site-header-image" src="<?php header_image(); ?>" alt="<?php echo esc_attr( $header_img_alt ); ?>" aria-label="<?php esc_attr_e( 'Header Image', 'marianne' ); ?>" loading="lazy" <?php echo $header_img_responsive_attr; ?>>
</<?php echo esc_html( $container ); ?>>
<?php
}
}
}

View file

@ -755,6 +755,19 @@ iframe {
font-weight: var(--site-desc-weight);
margin: .5em 0 0;
}
.site-identity-inline {
display: flex;
align-items: center;
}
.site-identity-inline .site-logo {
margin: 0 1em 0 0;
}
.site-identity-inline-content {
width: 100%;
}
.site-header-image-container {
margin: 2em 0;
}
/* Primary menu */
#menu-primary-container {

View file

@ -0,0 +1,32 @@
<?php
/**
*
*/
$marianne_header_class = 'site-header';
$marianne_header_class .= ' site-header-align-' . esc_attr( marianne_get_theme_mod( 'marianne_header_align' ) );
?>
<header id="header" <?php marianne_add_class( $marianne_header_class, false ); ?> role="banner">
<?php
$marianne_logo_class = 'site-logo';
if ( true === marianne_get_theme_mod( 'marianne_header_logo_round' ) ) {
$marianne_logo_class .= ' image-circular';
}
marianne_logo( $marianne_logo_class );
marianne_site_title();
marianne_site_description();
if ( 'header' === marianne_get_theme_mod( 'marianne_social_location' ) ) {
marianne_social_link( 'header' );
}
marianne_header_image();
marianne_menu_primary();
?>
</header>

View file

@ -0,0 +1,40 @@
<?php
/**
*
*/
$marianne_header_class = 'site-header';
$marianne_header_class .= ' site-header-align-' . esc_attr( marianne_get_theme_mod( 'marianne_header_align' ) );
?>
<header id="header" <?php marianne_add_class( $marianne_header_class, false ); ?> role="banner">
<?php
$marianne_logo_class = 'site-logo';
if ( true === marianne_get_theme_mod( 'marianne_header_logo_round' ) ) {
$marianne_logo_class .= ' image-circular';
}
?>
<div class="site-identity-inline">
<?php marianne_logo( $marianne_logo_class ); ?>
<div class="site-identity-inline-content">
<?php
marianne_site_title();
marianne_site_description();
?>
</div>
</div>
<?php
if ( 'header' === marianne_get_theme_mod( 'marianne_social_location' ) ) {
marianne_social_link( 'header' );
}
marianne_header_image();
marianne_menu_primary();
?>
</header>