WordPress.org

Make WordPress Core


Ignore:
Timestamp:
10/27/2016 09:50:56 PM (5 years ago)
Author:
joemcgill
Message:

Themes: Enable video in custom headers.

This adds the ability for themes to add support for videos in custom headers
by passing 'video' => true as an argument when adding theme support for
custom headers.

Custom video headers are managed through the “Header Visuals” (i.e. “Header Image”)
panel in the Customizer where you can select a video from the media library or set a
URL to an external video (YouTube for now) for use in custom headers.

This introduces several new functions:

has_header_video() – Check whether a header video is set or not.
get_header_video_url() – Retrieve header video URL for custom header.
the_header_video_url() – Display header video URL.
get_header_video_settings() – Retrieve header video settings.
has_custom_header() – Check whether a custom header is set or not.
get_custom_header_markup() – Retrieve the markup for a custom header.
the_custom_header_markup() – Print the markup for a custom header.

And a new file, wp-includes/js/wp-custom-header.js that handles loading videos
in custom headers.

This also enables video headers in the Twenty Seventeen and Twenty Fourteen themes.

Props davidakennedy, celloexpressions, bradyvercher, laurelfulford, joemcgill.
Fixes #38172.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-content/themes/twentyseventeen/template-parts/header/header-image.php

    r38875 r38985  
    1515
    1616    // Check if Custom Header image has been added.
    17     if ( ! empty( $header_image ) ) : ?>
     17    if ( has_custom_header() ) :
     18    ?>
    1819
    19         <div class="custom-header-image" style="background-image: url(<?php echo esc_url( $header_image ); ?>)"></div>
     20        <?php // Output the full custom header - video and/or image fallback. ?>
     21        <div class="custom-header-image">
     22            <?php the_custom_header_markup(); ?>
     23        </div>
    2024        <?php get_template_part( 'template-parts/header/site', 'branding' ); ?>
    2125
    2226    <?php else : ?>
     27
    2328        <?php // Otherwise, show a blank header. ?>
    2429        <div class="custom-header-simple">
Note: See TracChangeset for help on using the changeset viewer.