Astra_Ext_Advanced_Headers_Meta::page_header_tab( array $options )
Markup for the Page Header Tab.
Description
Parameters
- $options
-
(array) (Required) Post meta.
Source
File: addons/advanced-headers/classes/class-astra-ext-advanced-headers-meta.php
public function page_header_tab( $options ) {
$layout = $options['layouts'];
$design = $options['designs'];
$layout_opt = isset( $layout['layout'] ) ? $layout['layout'] : '';
?>
<table class="ast-advanced-headers-table widefat">
<tr class="ast-advanced-headers-row">
<td class="ast-advanced-headers-row-heading">
<label><?php esc_html_e( 'Layout', 'astra-addon' ); ?></label>
</td>
<td class="ast-advanced-headers-row-content ast-advanced-header-layout-radio-button-wrap">
<!-- Layout Radio Images -->
<label
for="ast-advanced-headers-layout-2" <?php checked( 'advanced-headers-layout-2', $layout_opt ); ?> class="ast-advanced-headers-heading-img-help">
<input type="radio" name="ast-advanced-headers-layout[layout]"
id="ast-advanced-headers-layout-2"
value="advanced-headers-layout-2"<?php checked( 'advanced-headers-layout-2', $layout_opt ); ?> />
<img
src="<?php echo esc_url( ASTRA_EXT_ADVANCED_HEADERS_URL . 'assets/images/advanced-header-1-77x48.png' ); ?>"
alt="<?php echo esc_attr__( 'Page Header: Center Aligned', 'astra-addon' ); ?>"
title="<?php echo esc_attr__( 'Page Header: Center Aligned', 'astra-addon' ); ?>" />
</label>
<label
for="ast-advanced-headers-layout-1" <?php checked( 'advanced-headers-layout-1', $layout_opt ); ?> class="ast-advanced-headers-heading-img-help">
<input type="radio" name="ast-advanced-headers-layout[layout]"
id="ast-advanced-headers-layout-1"
value="advanced-headers-layout-1"<?php checked( 'advanced-headers-layout-1', $layout_opt ); ?> />
<img
src="<?php echo esc_url( ASTRA_EXT_ADVANCED_HEADERS_URL . 'assets/images/advanced-header-2-77x48.png' ); ?>"
alt="<?php echo esc_attr__( 'Page Header: Inline', 'astra-addon' ); ?>"
title="<?php echo esc_attr__( 'Page Header: Inline', 'astra-addon' ); ?>" />
</label>
<label
for="ast-advanced-header-layout-disable" <?php checked( 'disable', $layout_opt ); ?> class="ast-advanced-headers-heading-img-help" >
<input type="radio" name="ast-advanced-headers-layout[layout]"
id="ast-advanced-header-layout-disable"
value="disable"<?php checked( 'disable', $layout_opt ); ?> />
<img
src="<?php echo esc_url( ASTRA_EXT_ADVANCED_HEADERS_URL . 'assets/images/disabled-77x48.png' ); ?>"
alt="<?php echo esc_attr__( 'No Page Header', 'astra-addon' ); ?>"
title="<?php echo esc_attr__( 'No Page Header', 'astra-addon' ); ?>" />
</label>
</td>
</tr>
<tr class="ast-advanced-headers-row ast-advanced-header-layout-breadcrumb-wrap">
<td class="ast-advanced-headers-row-heading">
<label><?php esc_html_e( 'Display Breadcrumb', 'astra-addon' ); ?></label>
</td>
<td class="ast-advanced-headers-row-content">
<input type="checkbox" id="ast-advanced-header-layout-breadcrumb"
name="ast-advanced-headers-layout[breadcrumb]"
value="enabled" <?php checked( isset( $layout['breadcrumb'] ) ? $layout['breadcrumb'] : '', 'enabled' ); ?> />
</td>
</tr>
</table>
<!-- Design -->
<table class="ast-advanced-headers-table design-wrap widefat">
<tr class="ast-advanced-headers-row">
<td class="ast-advanced-headers-row-heading title">
<label><?php esc_html_e( 'Title', 'astra-addon' ); ?></label>
</td>
<tr class="ast-advanced-headers-row">
<td class="ast-advanced-headers-row-sub-heading">
<label><?php esc_html_e( 'Text Color', 'astra-addon' ); ?></label>
</td>
<td class="ast-advanced-headers-row-content">
<input type="text" class="ast-advanced-headers-color-picker" data-alpha="true"
name="ast-advanced-headers-design[title-color]"
value="<?php echo esc_attr( $design['title-color'] ); ?>" />
</td>
</tr>
<tr class="ast-advanced-headers-row breadcrumb-row">
<td class="ast-advanced-headers-row-heading title">
<label><?php esc_html_e( 'Breadcrumb', 'astra-addon' ); ?></label>
</td>
</tr>
<tr class="ast-advanced-headers-row breadcrumb-row">
<td class="ast-advanced-headers-row-sub-heading">
<label><?php esc_html_e( 'Text Color', 'astra-addon' ); ?></label>
</td>
<td class="ast-advanced-headers-row-content">
<input type="text" class="ast-advanced-headers-color-picker" data-alpha="true"
name="ast-advanced-headers-design[b-text-color]"
value="<?php echo esc_attr( $design['b-text-color'] ); ?>" />
</td>
</tr>
<tr class="ast-advanced-headers-row breadcrumb-row">
<td class="ast-advanced-headers-row-sub-heading">
<label><?php esc_html_e( 'Link Color', 'astra-addon' ); ?></label>
</td>
<td class="ast-advanced-headers-row-content">
<input type="text" class="ast-advanced-headers-color-picker" data-alpha="true"
name="ast-advanced-headers-design[b-link-color]"
value="<?php echo esc_attr( $design['b-link-color'] ); ?>" />
</td>
</tr>
<tr class="ast-advanced-headers-row breadcrumb-row">
<td class="ast-advanced-headers-row-sub-heading">
<label><?php esc_html_e( 'Link Hover Color', 'astra-addon' ); ?></label>
</td>
<td class="ast-advanced-headers-row-content">
<input type="text" class="ast-advanced-headers-color-picker" data-alpha="true"
name="ast-advanced-headers-design[b-link-hover-color]"
value="<?php echo esc_attr( $design['b-link-hover-color'] ); ?>" />
</td>
</tr>
<tr class="ast-advanced-headers-row">
<td class="ast-advanced-headers-row-heading title">
<label><?php esc_html_e( 'Size ', 'astra-addon' ); ?></label>
</td>
</tr>
<tr class="ast-advanced-headers-row">
<td class="ast-advanced-headers-row-sub-heading">
<label><?php esc_html_e( 'Background Size', 'astra-addon' ); ?></label>
<i class="ast-advanced-headers-heading-help dashicons dashicons-editor-help"
title="<?php echo esc_attr__( 'Custom Size can be given any positive number with or without units as "5" or "5px". Default unit is "%"', 'astra-addon' ); ?>"></i>
</td>
<td class="ast-advanced-headers-row-content">
<select name="ast-advanced-headers-design[bg-size]" id="ast-advanced-header-design-bg-size"
style="width:210px;">
<option
value="custom-bg-size" <?php selected( $design['bg-size'], 'custom-bg-size' ); ?> > <?php esc_html_e( 'Custom Size', 'astra-addon' ); ?></option>
<option
value="full-screen" <?php selected( $design['bg-size'], 'full-screen' ); ?> > <?php esc_html_e( 'Full screen', 'astra-addon' ); ?></option>
</select>
<div class="ast-advanced-haeders-design-bg-custom-size-wrap">
<input type="text" name="ast-advanced-headers-design[bg-custom-size-top-padding]"
id="ast-advanced-haeders-design-bg-custom-size-top-padding"
value="<?php echo esc_attr( $design['bg-custom-size-top-padding'] ); ?>"
placeholder="<?php echo esc_attr( $design['bg-custom-size-top-padding'] ); ?>"
style="width:110px;"/>
<label for="ast-advanced-haeders-design-bg-custom-size-top-padding"><?php esc_html_e( 'Top Padding', 'astra-addon' ); ?></label>
<br><input type="text" name="ast-advanced-headers-design[bg-custom-size-bottom-padding]"
id="ast-advanced-haeders-design-bg-custom-size-bottom-padding"
value="<?php echo esc_attr( $design['bg-custom-size-bottom-padding'] ); ?>"
placeholder="<?php echo esc_attr( $design['bg-custom-size-bottom-padding'] ); ?>"
style="width:110px;"/>
<label
for="ast-advanced-haeders-design-bg-custom-size-bottom-padding"><?php esc_html_e( 'Bottom Padding', 'astra-addon' ); ?></label>
</div>
</td>
</tr>
<tr class="ast-advanced-headers-row">
<td class="ast-advanced-headers-row-heading title">
<label><?php esc_html_e( 'Background ', 'astra-addon' ); ?></label>
</td>
</tr>
<tr class="ast-advanced-headers-row">
<td class="ast-advanced-headers-row-sub-heading">
<label><?php esc_html_e( 'Color', 'astra-addon' ); ?></label>
</td>
<td class="ast-advanced-headers-row-content">
<input type="text" class="ast-advanced-headers-color-picker" data-alpha="true" data-rgba="true"
name="ast-advanced-headers-design[background-color]"
value="<?php echo esc_attr( $design['background-color'] ); ?>" />
</td>
</tr>
<tr class="ast-advanced-headers-row">
<td class="ast-advanced-headers-row-sub-heading">
<label><?php esc_html_e( 'Image', 'astra-addon' ); ?></label>
</td>
<td class="ast-advanced-headers-row-content">
<div id="ast-advanced-headers-preview-img">
<?php if ( isset( $design['bg-image'] ) && '' != $design['bg-image'] ) { ?>
<img class="ast-advanced-headers-bg-image saved-image"
src="<?php echo esc_url( $design['bg-image'] ); ?>" width="150"
style="margin-bottom:12px;"/>
<?php } ?>
</div>
<input type="hidden" id="ast-advanced-headers-bg-image-id"
class="ast-advanced-headers-bg-image-id" name="ast-advanced-headers-design[bg-image-id]"
value="<?php echo esc_attr( $design['bg-image-id'] ); ?>"/>
<input type="hidden" id="ast-advanced-headers-bg-image" class="ast-advanced-headers-bg-image"
name="ast-advanced-headers-design[bg-image]"
value="<?php echo esc_attr( $design['bg-image'] ); ?>"/>
<a class="ast-advanced-headers-bg-image-select button-secondary"
href="#"><?php esc_html_e( 'Select Image', 'astra-addon' ); ?></a>
<?php
// Remove button based on image is selected or not.
$remove_button = ( isset( $design['bg-image'] ) && '' != $design['bg-image'] ) ? 'display:inline-block' : 'display:none';
?>
<button class="ast-advanced-headers-bg-image-remove button" type="button"
style="<?php echo esc_attr( $remove_button ); ?>">
<?php esc_html_e( 'Remove Image', 'astra-addon' ); ?>
</button>
<br><br>
<input type="checkbox" id="ast-advanced-header-page-post-featured"
name="ast-advanced-headers-design[page-post-featured]"
value="enabled" <?php checked( isset( $design['page-post-featured'] ) ? $design['page-post-featured'] : '', 'enabled' ); ?> />
<label for="ast-advanced-header-page-post-featured">
<?php esc_html_e( 'Override this image with the featured image on individual posts & pages. ', 'astra-addon' ); ?>
</label>
<br><br>
<input type="checkbox" id="ast-advanced-header-overlay-bg-color"
name="ast-advanced-headers-design[overlay-bg-color]"
value="enabled" <?php checked( isset( $design['overlay-bg-color'] ) ? $design['overlay-bg-color'] : '', 'enabled' ); ?> />
<label for="ast-advanced-header-overlay-bg-color">
<?php esc_html_e( 'Overlay Background Color', 'astra-addon' ); ?>
</label>
</td>
<tr class="ast-advanced-headers-row">
<td class="ast-advanced-headers-row-sub-heading">
<label><?php esc_html_e( 'Parallax', 'astra-addon' ); ?></label>
</td>
<td class="ast-advanced-headers-row-content">
<!-- Deprecated checkbox to enable Parallax effect, this is now replaced by select box to enable parallax effect on responsive devices from version 2.3.0 This option should be removed after 4 major updates. -->
<input type="hidden" name="ast-advanced-headers-design[parallax]"
value="<?php echo esc_attr( ( 'none' !== $design['parallax-device'] ) ? 'enabled' : '' ); ?>" />
<select name="ast-advanced-headers-design[parallax-device]" id="ast-advanced-header-design-parallax-device"
style="width:210px;">
<option value="none" <?php selected( $design['parallax-device'], 'none' ); ?> > <?php esc_html_e( 'None', 'astra-addon' ); ?></option>
<option value="both" <?php selected( $design['parallax-device'], 'both' ); ?> > <?php esc_html_e( 'Desktop + Mobile', 'astra-addon' ); ?></option>
<option value="desktop" <?php selected( $design['parallax-device'], 'desktop' ); ?> > <?php esc_html_e( 'Desktop', 'astra-addon' ); ?></option>
<option value="mobile" <?php selected( $design['parallax-device'], 'mobile' ); ?> > <?php esc_html_e( 'Mobile', 'astra-addon' ); ?></option>
</select>
</td>
</tr>
</table>
<?php
}
Expand full source code Collapse full source code View on Trac
Changelog
| Version | Description |
|---|---|
| 1.0.0 | Introduced. |