Custom_Background::admin_page() │ public │ WP 3.0.0

Displays the custom background page.

Method of the class: Custom_Background{}

No Hooks.

Return

null. Nothing (null).

Usage

$Custom_Background = new Custom_Background();
$Custom_Background->admin_page();

Changelog

Since 3.0.0 Introduced.

Custom_Background::admin_page() code WP 6.5.2

wp-admin/includes/class-custom-background.php 
<?php
public function admin_page() {
	?>
<div class="wrap" id="custom-background">
<h1><?php _e( 'Custom Background' ); ?></h1>

	<?php
	if ( current_user_can( 'customize' ) ) {
		$message = sprintf(
			/* translators: %s: URL to background image configuration in Customizer. */
			__( 'You can now manage and live-preview Custom Backgrounds in the <a href="%s">Customizer</a>.' ),
			admin_url( 'customize.php?autofocus[control]=background_image' )
		);
		wp_admin_notice(
			$message,
			array(
				'type'               => 'info',
				'additional_classes' => array( 'hide-if-no-customize' ),
			)
		);
	}

	if ( ! empty( $this->updated ) ) {
		$updated_message = sprintf(
			/* translators: %s: Home URL. */
			__( 'Background updated. <a href="%s">Visit your site</a> to see how it looks.' ),
			esc_url( home_url( '/' ) )
		);
		wp_admin_notice(
			$updated_message,
			array(
				'id'                 => 'message',
				'additional_classes' => array( 'updated' ),
			)
		);
	}
	?>

<h2><?php _e( 'Background Image' ); ?></h2>

<table class="form-table" role="presentation">
<tbody>
<tr>
<th scope="row"><?php _e( 'Preview' ); ?></th>
<td>
	<?php
	if ( $this->admin_image_div_callback ) {
		call_user_func( $this->admin_image_div_callback );
	} else {
		$background_styles = '';
		$bgcolor           = get_background_color();
		if ( $bgcolor ) {
			$background_styles .= 'background-color: #' . $bgcolor . ';';
		}

		$background_image_thumb = get_background_image();
		if ( $background_image_thumb ) {
			$background_image_thumb = esc_url( set_url_scheme( get_theme_mod( 'background_image_thumb', str_replace( '%', '%%', $background_image_thumb ) ) ) );
			$background_position_x  = get_theme_mod( 'background_position_x', get_theme_support( 'custom-background', 'default-position-x' ) );
			$background_position_y  = get_theme_mod( 'background_position_y', get_theme_support( 'custom-background', 'default-position-y' ) );
			$background_size        = get_theme_mod( 'background_size', get_theme_support( 'custom-background', 'default-size' ) );
			$background_repeat      = get_theme_mod( 'background_repeat', get_theme_support( 'custom-background', 'default-repeat' ) );
			$background_attachment  = get_theme_mod( 'background_attachment', get_theme_support( 'custom-background', 'default-attachment' ) );

			// Background-image URL must be single quote, see below.
			$background_styles .= " background-image: url('$background_image_thumb');"
			. " background-size: $background_size;"
			. " background-position: $background_position_x $background_position_y;"
			. " background-repeat: $background_repeat;"
			. " background-attachment: $background_attachment;";
		}
		?>
<div id="custom-background-image" style="<?php echo $background_styles; ?>"><?php // Must be double quote, see above. ?>
		<?php if ( $background_image_thumb ) { ?>
	<img class="custom-background-image" src="<?php echo $background_image_thumb; ?>" style="visibility:hidden;" alt="" /><br />
	<img class="custom-background-image" src="<?php echo $background_image_thumb; ?>" style="visibility:hidden;" alt="" />
	<?php } ?>
</div>
<?php } ?>
</td>
</tr>

	<?php if ( get_background_image() ) : ?>
<tr>
<th scope="row"><?php _e( 'Remove Image' ); ?></th>
<td>
<form method="post">
		<?php wp_nonce_field( 'custom-background-remove', '_wpnonce-custom-background-remove' ); ?>
		<?php submit_button( __( 'Remove Background Image' ), '', 'remove-background', false ); ?><br />
		<?php _e( 'This will remove the background image. You will not be able to restore any customizations.' ); ?>
</form>
</td>
</tr>
	<?php endif; ?>

	<?php $default_image = get_theme_support( 'custom-background', 'default-image' ); ?>
	<?php if ( $default_image && get_background_image() !== $default_image ) : ?>
<tr>
<th scope="row"><?php _e( 'Restore Original Image' ); ?></th>
<td>
<form method="post">
		<?php wp_nonce_field( 'custom-background-reset', '_wpnonce-custom-background-reset' ); ?>
		<?php submit_button( __( 'Restore Original Image' ), '', 'reset-background', false ); ?><br />
		<?php _e( 'This will restore the original background image. You will not be able to restore any customizations.' ); ?>
</form>
</td>
</tr>
	<?php endif; ?>

	<?php if ( current_user_can( 'upload_files' ) ) : ?>
<tr>
<th scope="row"><?php _e( 'Select Image' ); ?></th>
<td><form enctype="multipart/form-data" id="upload-form" class="wp-upload-form" method="post">
<p>
	<label for="upload"><?php _e( 'Choose an image from your computer:' ); ?></label><br />
	<input type="file" id="upload" name="import" />
	<input type="hidden" name="action" value="save" />
		<?php wp_nonce_field( 'custom-background-upload', '_wpnonce-custom-background-upload' ); ?>
		<?php submit_button( __( 'Upload' ), '', 'submit', false ); ?>
</p>
<p>
	<label for="choose-from-library-link"><?php _e( 'Or choose an image from your media library:' ); ?></label><br />
	<button id="choose-from-library-link" class="button"
		data-choose="<?php esc_attr_e( 'Choose a Background Image' ); ?>"
		data-update="<?php esc_attr_e( 'Set as background' ); ?>"><?php _e( 'Choose Image' ); ?></button>
</p>
</form>
</td>
</tr>
	<?php endif; ?>
</tbody>
</table>

<h2><?php _e( 'Display Options' ); ?></h2>
<form method="post">
<table class="form-table" role="presentation">
<tbody>
	<?php if ( get_background_image() ) : ?>
<input name="background-preset" type="hidden" value="custom">

		<?php
		$background_position = sprintf(
			'%s %s',
			get_theme_mod( 'background_position_x', get_theme_support( 'custom-background', 'default-position-x' ) ),
			get_theme_mod( 'background_position_y', get_theme_support( 'custom-background', 'default-position-y' ) )
		);

		$background_position_options = array(
			array(
				'left top'   => array(
					'label' => __( 'Top Left' ),
					'icon'  => 'dashicons dashicons-arrow-left-alt',
				),
				'center top' => array(
					'label' => __( 'Top' ),
					'icon'  => 'dashicons dashicons-arrow-up-alt',
				),
				'right top'  => array(
					'label' => __( 'Top Right' ),
					'icon'  => 'dashicons dashicons-arrow-right-alt',
				),
			),
			array(
				'left center'   => array(
					'label' => __( 'Left' ),
					'icon'  => 'dashicons dashicons-arrow-left-alt',
				),
				'center center' => array(
					'label' => __( 'Center' ),
					'icon'  => 'background-position-center-icon',
				),
				'right center'  => array(
					'label' => __( 'Right' ),
					'icon'  => 'dashicons dashicons-arrow-right-alt',
				),
			),
			array(
				'left bottom'   => array(
					'label' => __( 'Bottom Left' ),
					'icon'  => 'dashicons dashicons-arrow-left-alt',
				),
				'center bottom' => array(
					'label' => __( 'Bottom' ),
					'icon'  => 'dashicons dashicons-arrow-down-alt',
				),
				'right bottom'  => array(
					'label' => __( 'Bottom Right' ),
					'icon'  => 'dashicons dashicons-arrow-right-alt',
				),
			),
		);
		?>
<tr>
<th scope="row"><?php _e( 'Image Position' ); ?></th>
<td><fieldset><legend class="screen-reader-text"><span>
		<?php
		/* translators: Hidden accessibility text. */
		_e( 'Image Position' );
		?>
</span></legend>
<div class="background-position-control">
		<?php foreach ( $background_position_options as $group ) : ?>
<div class="button-group">
			<?php foreach ( $group as $value => $input ) : ?>
	<label>
		<input class="ui-helper-hidden-accessible" name="background-position" type="radio" value="<?php echo esc_attr( $value ); ?>"<?php checked( $value, $background_position ); ?>>
		<span class="button display-options position"><span class="<?php echo esc_attr( $input['icon'] ); ?>" aria-hidden="true"></span></span>
		<span class="screen-reader-text"><?php echo $input['label']; ?></span>
	</label>
<?php endforeach; ?>
</div>
<?php endforeach; ?>
</div>
</fieldset></td>
</tr>

<tr>
<th scope="row"><label for="background-size"><?php _e( 'Image Size' ); ?></label></th>
<td><fieldset><legend class="screen-reader-text"><span>
		<?php
		/* translators: Hidden accessibility text. */
		_e( 'Image Size' );
		?>
</span></legend>
<select id="background-size" name="background-size">
<option value="auto"<?php selected( 'auto', get_theme_mod( 'background_size', get_theme_support( 'custom-background', 'default-size' ) ) ); ?>><?php _ex( 'Original', 'Original Size' ); ?></option>
<option value="contain"<?php selected( 'contain', get_theme_mod( 'background_size', get_theme_support( 'custom-background', 'default-size' ) ) ); ?>><?php _e( 'Fit to Screen' ); ?></option>
<option value="cover"<?php selected( 'cover', get_theme_mod( 'background_size', get_theme_support( 'custom-background', 'default-size' ) ) ); ?>><?php _e( 'Fill Screen' ); ?></option>
</select>
</fieldset></td>
</tr>

<tr>
<th scope="row"><?php _ex( 'Repeat', 'Background Repeat' ); ?></th>
<td><fieldset><legend class="screen-reader-text"><span>
		<?php
		/* translators: Hidden accessibility text. */
		_ex( 'Repeat', 'Background Repeat' );
		?>
</span></legend>
<input name="background-repeat" type="hidden" value="no-repeat">
<label><input type="checkbox" name="background-repeat" value="repeat"<?php checked( 'repeat', get_theme_mod( 'background_repeat', get_theme_support( 'custom-background', 'default-repeat' ) ) ); ?>> <?php _e( 'Repeat Background Image' ); ?></label>
</fieldset></td>
</tr>

<tr>
<th scope="row"><?php _ex( 'Scroll', 'Background Scroll' ); ?></th>
<td><fieldset><legend class="screen-reader-text"><span>
		<?php
		/* translators: Hidden accessibility text. */
		_ex( 'Scroll', 'Background Scroll' );
		?>
</span></legend>
<input name="background-attachment" type="hidden" value="fixed">
<label><input name="background-attachment" type="checkbox" value="scroll" <?php checked( 'scroll', get_theme_mod( 'background_attachment', get_theme_support( 'custom-background', 'default-attachment' ) ) ); ?>> <?php _e( 'Scroll with Page' ); ?></label>
</fieldset></td>
</tr>
<?php endif; // get_background_image() ?>
<tr>
<th scope="row"><?php _e( 'Background Color' ); ?></th>
<td><fieldset><legend class="screen-reader-text"><span>
	<?php
	/* translators: Hidden accessibility text. */
	_e( 'Background Color' );
	?>
</span></legend>
	<?php
	$default_color = '';
	if ( current_theme_supports( 'custom-background', 'default-color' ) ) {
		$default_color = ' data-default-color="#' . esc_attr( get_theme_support( 'custom-background', 'default-color' ) ) . '"';
	}
	?>
<input type="text" name="background-color" id="background-color" value="#<?php echo esc_attr( get_background_color() ); ?>"<?php echo $default_color; ?>>
</fieldset></td>
</tr>
</tbody>
</table>

	<?php wp_nonce_field( 'custom-background' ); ?>
	<?php submit_button( null, 'primary', 'save-background-options' ); ?>
</form>

</div>
	<?php
}