custom-header.php 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. <?php
  2. /**
  3. * Sample implementation of the Custom Header feature
  4. * http://codex.wordpress.org/Custom_Headers
  5. *
  6. * You can add an optional custom header image to header.php like so ...
  7. *
  8. <?php if ( get_header_image() ) : ?>
  9. <a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">
  10. <img src="<?php header_image(); ?>" width="<?php echo esc_attr( get_custom_header()->width ); ?>" height="<?php echo esc_attr( get_custom_header()->height ); ?>" alt="">
  11. </a>
  12. <?php endif; // End header image check. ?>
  13. *
  14. * @package Affinity
  15. */
  16. /**
  17. * Set up the WordPress core custom header feature.
  18. *
  19. * @uses affinity_header_style()
  20. */
  21. function affinity_custom_header_setup() {
  22. add_theme_support( 'custom-header', apply_filters( 'affinity_custom_header_args', array(
  23. 'random-default' => true,
  24. 'default-text-color' => 'e8e9ea',
  25. 'width' => 2000,
  26. 'height' => 1200,
  27. 'flex-height' => true,
  28. 'wp-head-callback' => 'affinity_header_style',
  29. ) ) );
  30. register_default_headers( array(
  31. 'header-image-1' => array(
  32. 'url' => '%s/assets/img/autumn.jpg',
  33. 'thumbnail_url' => '%s/assets/img/thumbs/autumn.jpg',
  34. 'description' => esc_html__( 'Autumn Path', 'affinity' ),
  35. ),
  36. 'header-image-2' => array(
  37. 'url' => '%s/assets/img/car.jpg',
  38. 'thumbnail_url' => '%s/assets/img/thumbs/car.jpg',
  39. 'description' => esc_html__( 'Vintage Car', 'affinity' ),
  40. ),
  41. 'header-image-3' => array(
  42. 'url' => '%s/assets/img/typewriter.jpg',
  43. 'thumbnail_url' => '%s/assets/img/thumbs/typewriter.jpg',
  44. 'description' => esc_html__( 'Typewriter', 'affinity' ),
  45. ),
  46. 'header-image-4' => array(
  47. 'url' => '%s/assets/img/tulips.jpg',
  48. 'thumbnail_url' => '%s/assets/img/thumbs/tulips.jpg',
  49. 'description' => esc_html__( 'Tulips', 'affinity' ),
  50. ),
  51. 'header-image-5' => array(
  52. 'url' => '%s/assets/img/camera.jpg',
  53. 'thumbnail_url' => '%s/assets/img/thumbs/camera.jpg',
  54. 'description' => esc_html__( 'Vintage Camera', 'affinity' ),
  55. ),
  56. ) );
  57. }
  58. add_action( 'after_setup_theme', 'affinity_custom_header_setup' );
  59. if ( ! function_exists( 'affinity_header_style' ) ) :
  60. /**
  61. * Styles the header image and text displayed on the blog
  62. *
  63. * @see affinity_custom_header_setup().
  64. */
  65. function affinity_header_style() {
  66. $header_text_color = get_header_textcolor();
  67. // If no custom options for text are set, let's bail
  68. // get_header_textcolor() options: add_theme_support( 'custom-header' ) is default, hide text (returns 'blank') or any hex value.
  69. if ( get_theme_support( 'custom-header', 'default-text-color' ) === $header_text_color ) {
  70. return;
  71. }
  72. // If we get this far, we have custom styles. Let's do this.
  73. ?>
  74. <style type="text/css">
  75. <?php
  76. // Has the text been hidden?
  77. if ( 'blank' === $header_text_color ) :
  78. ?>
  79. .site-title,
  80. .site-description {
  81. position: absolute;
  82. clip: rect(1px, 1px, 1px, 1px);
  83. }
  84. <?php
  85. // If the user has set a custom color for the text use that.
  86. else :
  87. ?>
  88. .site-title a,
  89. .site-description {
  90. color: #<?php echo esc_attr( $header_text_color ); ?>;
  91. }
  92. <?php endif; ?>
  93. </style>
  94. <?php
  95. }
  96. endif; // affinity_header_style