PageRenderTime 48ms CodeModel.GetById 19ms RepoModel.GetById 0ms app.codeStats 0ms

/src/wp-content/themes/twentyfifteen/inc/custom-header.php

https://gitlab.com/morganestes/wordpress-develop
PHP | 378 lines | 282 code | 25 blank | 71 comment | 13 complexity | a7f6ea42ea94e1a010c6b546df58ae25 MD5 | raw file
  1. <?php
  2. /**
  3. * Custom Header functionality for Twenty Fifteen
  4. *
  5. * @package WordPress
  6. * @subpackage Twenty_Fifteen
  7. * @since Twenty Fifteen 1.0
  8. */
  9. /**
  10. * Set up the WordPress core custom header feature.
  11. *
  12. * @uses twentyfifteen_header_style()
  13. */
  14. function twentyfifteen_custom_header_setup() {
  15. $color_scheme = twentyfifteen_get_color_scheme();
  16. $default_text_color = trim( $color_scheme[4], '#' );
  17. /**
  18. * Filter Twenty Fifteen custom-header support arguments.
  19. *
  20. * @since Twenty Fifteen 1.0
  21. *
  22. * @param array $args {
  23. * An array of custom-header support arguments.
  24. *
  25. * @type string $default_text_color Default color of the header text.
  26. * @type int $width Width in pixels of the custom header image. Default 954.
  27. * @type int $height Height in pixels of the custom header image. Default 1300.
  28. * @type string $wp-head-callback Callback function used to styles the header image and text
  29. * displayed on the blog.
  30. * }
  31. */
  32. add_theme_support(
  33. 'custom-header', apply_filters(
  34. 'twentyfifteen_custom_header_args', array(
  35. 'default-text-color' => $default_text_color,
  36. 'width' => 954,
  37. 'height' => 1300,
  38. 'wp-head-callback' => 'twentyfifteen_header_style',
  39. )
  40. )
  41. );
  42. }
  43. add_action( 'after_setup_theme', 'twentyfifteen_custom_header_setup' );
  44. /**
  45. * Convert HEX to RGB.
  46. *
  47. * @since Twenty Fifteen 1.0
  48. *
  49. * @param string $color The original color, in 3- or 6-digit hexadecimal form.
  50. * @return array Array containing RGB (red, green, and blue) values for the given
  51. * HEX code, empty array otherwise.
  52. */
  53. function twentyfifteen_hex2rgb( $color ) {
  54. $color = trim( $color, '#' );
  55. if ( strlen( $color ) == 3 ) {
  56. $r = hexdec( substr( $color, 0, 1 ) . substr( $color, 0, 1 ) );
  57. $g = hexdec( substr( $color, 1, 1 ) . substr( $color, 1, 1 ) );
  58. $b = hexdec( substr( $color, 2, 1 ) . substr( $color, 2, 1 ) );
  59. } elseif ( strlen( $color ) == 6 ) {
  60. $r = hexdec( substr( $color, 0, 2 ) );
  61. $g = hexdec( substr( $color, 2, 2 ) );
  62. $b = hexdec( substr( $color, 4, 2 ) );
  63. } else {
  64. return array();
  65. }
  66. return array(
  67. 'red' => $r,
  68. 'green' => $g,
  69. 'blue' => $b,
  70. );
  71. }
  72. if ( ! function_exists( 'twentyfifteen_header_style' ) ) :
  73. /**
  74. * Styles the header image and text displayed on the blog.
  75. *
  76. * @since Twenty Fifteen 1.0
  77. *
  78. * @see twentyfifteen_custom_header_setup()
  79. */
  80. function twentyfifteen_header_style() {
  81. $header_image = get_header_image();
  82. // If no custom options for text are set, let's bail.
  83. if ( empty( $header_image ) && display_header_text() ) {
  84. return;
  85. }
  86. // If we get this far, we have custom styles. Let's do this.
  87. ?>
  88. <style type="text/css" id="twentyfifteen-header-css">
  89. <?php
  90. // Short header for when there is no Custom Header and Header Text is hidden.
  91. if ( empty( $header_image ) && ! display_header_text() ) :
  92. ?>
  93. .site-header {
  94. padding-top: 14px;
  95. padding-bottom: 14px;
  96. }
  97. .site-branding {
  98. min-height: 42px;
  99. }
  100. @media screen and (min-width: 46.25em) {
  101. .site-header {
  102. padding-top: 21px;
  103. padding-bottom: 21px;
  104. }
  105. .site-branding {
  106. min-height: 56px;
  107. }
  108. }
  109. @media screen and (min-width: 55em) {
  110. .site-header {
  111. padding-top: 25px;
  112. padding-bottom: 25px;
  113. }
  114. .site-branding {
  115. min-height: 62px;
  116. }
  117. }
  118. @media screen and (min-width: 59.6875em) {
  119. .site-header {
  120. padding-top: 0;
  121. padding-bottom: 0;
  122. }
  123. .site-branding {
  124. min-height: 0;
  125. }
  126. }
  127. <?php
  128. endif;
  129. // Has a Custom Header been added?
  130. if ( ! empty( $header_image ) ) :
  131. ?>
  132. .site-header {
  133. /*
  134. * No shorthand so the Customizer can override individual properties.
  135. * @see https://core.trac.wordpress.org/ticket/31460
  136. */
  137. background-image: url(<?php header_image(); ?>);
  138. background-repeat: no-repeat;
  139. background-position: 50% 50%;
  140. -webkit-background-size: cover;
  141. -moz-background-size: cover;
  142. -o-background-size: cover;
  143. background-size: cover;
  144. }
  145. @media screen and (min-width: 59.6875em) {
  146. body:before {
  147. /*
  148. * No shorthand so the Customizer can override individual properties.
  149. * @see https://core.trac.wordpress.org/ticket/31460
  150. */
  151. background-image: url(<?php header_image(); ?>);
  152. background-repeat: no-repeat;
  153. background-position: 100% 50%;
  154. -webkit-background-size: cover;
  155. -moz-background-size: cover;
  156. -o-background-size: cover;
  157. background-size: cover;
  158. border-right: 0;
  159. }
  160. .site-header {
  161. background: transparent;
  162. }
  163. }
  164. <?php
  165. endif;
  166. // Has the text been hidden?
  167. if ( ! display_header_text() ) :
  168. ?>
  169. .site-title,
  170. .site-description {
  171. clip: rect(1px, 1px, 1px, 1px);
  172. position: absolute;
  173. }
  174. <?php endif; ?>
  175. </style>
  176. <?php
  177. }
  178. endif; // twentyfifteen_header_style
  179. /**
  180. * Enqueues front-end CSS for the header background color.
  181. *
  182. * @since Twenty Fifteen 1.0
  183. *
  184. * @see wp_add_inline_style()
  185. */
  186. function twentyfifteen_header_background_color_css() {
  187. $color_scheme = twentyfifteen_get_color_scheme();
  188. $default_color = $color_scheme[1];
  189. $header_background_color = get_theme_mod( 'header_background_color', $default_color );
  190. // Don't do anything if the current color is the default.
  191. if ( $header_background_color === $default_color ) {
  192. return;
  193. }
  194. $css = '
  195. /* Custom Header Background Color */
  196. body:before,
  197. .site-header {
  198. background-color: %1$s;
  199. }
  200. @media screen and (min-width: 59.6875em) {
  201. .site-header,
  202. .secondary {
  203. background-color: transparent;
  204. }
  205. .widget button,
  206. .widget input[type="button"],
  207. .widget input[type="reset"],
  208. .widget input[type="submit"],
  209. .widget_calendar tbody a,
  210. .widget_calendar tbody a:hover,
  211. .widget_calendar tbody a:focus {
  212. color: %1$s;
  213. }
  214. }
  215. ';
  216. wp_add_inline_style( 'twentyfifteen-style', sprintf( $css, $header_background_color ) );
  217. }
  218. add_action( 'wp_enqueue_scripts', 'twentyfifteen_header_background_color_css', 11 );
  219. /**
  220. * Enqueues front-end CSS for the sidebar text color.
  221. *
  222. * @since Twenty Fifteen 1.0
  223. */
  224. function twentyfifteen_sidebar_text_color_css() {
  225. $color_scheme = twentyfifteen_get_color_scheme();
  226. $default_color = $color_scheme[4];
  227. $sidebar_link_color = get_theme_mod( 'sidebar_textcolor', $default_color );
  228. // Don't do anything if the current color is the default.
  229. if ( $sidebar_link_color === $default_color ) {
  230. return;
  231. }
  232. // If we get this far, we have custom styles. Let's do this.
  233. $sidebar_link_color_rgb = twentyfifteen_hex2rgb( $sidebar_link_color );
  234. $sidebar_text_color = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.7)', $sidebar_link_color_rgb );
  235. $sidebar_border_color = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.1)', $sidebar_link_color_rgb );
  236. $sidebar_border_focus_color = vsprintf( 'rgba( %1$s, %2$s, %3$s, 0.3)', $sidebar_link_color_rgb );
  237. $css = '
  238. /* Custom Sidebar Text Color */
  239. .site-title a,
  240. .site-description,
  241. .secondary-toggle:before {
  242. color: %1$s;
  243. }
  244. .site-title a:hover,
  245. .site-title a:focus {
  246. color: %1$s; /* Fallback for IE7 and IE8 */
  247. color: %2$s;
  248. }
  249. .secondary-toggle {
  250. border-color: %1$s; /* Fallback for IE7 and IE8 */
  251. border-color: %3$s;
  252. }
  253. .secondary-toggle:hover,
  254. .secondary-toggle:focus {
  255. border-color: %1$s; /* Fallback for IE7 and IE8 */
  256. border-color: %4$s;
  257. }
  258. .site-title a {
  259. outline-color: %1$s; /* Fallback for IE7 and IE8 */
  260. outline-color: %4$s;
  261. }
  262. @media screen and (min-width: 59.6875em) {
  263. .secondary a,
  264. .dropdown-toggle:after,
  265. .widget-title,
  266. .widget blockquote cite,
  267. .widget blockquote small {
  268. color: %1$s;
  269. }
  270. .widget button,
  271. .widget input[type="button"],
  272. .widget input[type="reset"],
  273. .widget input[type="submit"],
  274. .widget_calendar tbody a {
  275. background-color: %1$s;
  276. }
  277. .textwidget a {
  278. border-color: %1$s;
  279. }
  280. .secondary a:hover,
  281. .secondary a:focus,
  282. .main-navigation .menu-item-description,
  283. .widget,
  284. .widget blockquote,
  285. .widget .wp-caption-text,
  286. .widget .gallery-caption {
  287. color: %2$s;
  288. }
  289. .widget button:hover,
  290. .widget button:focus,
  291. .widget input[type="button"]:hover,
  292. .widget input[type="button"]:focus,
  293. .widget input[type="reset"]:hover,
  294. .widget input[type="reset"]:focus,
  295. .widget input[type="submit"]:hover,
  296. .widget input[type="submit"]:focus,
  297. .widget_calendar tbody a:hover,
  298. .widget_calendar tbody a:focus {
  299. background-color: %2$s;
  300. }
  301. .widget blockquote {
  302. border-color: %2$s;
  303. }
  304. .main-navigation ul,
  305. .main-navigation li,
  306. .secondary-toggle,
  307. .widget input,
  308. .widget textarea,
  309. .widget table,
  310. .widget th,
  311. .widget td,
  312. .widget pre,
  313. .widget li,
  314. .widget_categories .children,
  315. .widget_nav_menu .sub-menu,
  316. .widget_pages .children,
  317. .widget abbr[title] {
  318. border-color: %3$s;
  319. }
  320. .dropdown-toggle:hover,
  321. .dropdown-toggle:focus,
  322. .widget hr {
  323. background-color: %3$s;
  324. }
  325. .widget input:focus,
  326. .widget textarea:focus {
  327. border-color: %4$s;
  328. }
  329. .sidebar a:focus,
  330. .dropdown-toggle:focus {
  331. outline-color: %4$s;
  332. }
  333. }
  334. ';
  335. wp_add_inline_style( 'twentyfifteen-style', sprintf( $css, $sidebar_link_color, $sidebar_text_color, $sidebar_border_color, $sidebar_border_focus_color ) );
  336. }
  337. add_action( 'wp_enqueue_scripts', 'twentyfifteen_sidebar_text_color_css', 11 );