Make WordPress Core

Ticket #22058: 22058.2.diff

File 22058.2.diff, 23.0 KB (added by celloexpressions, 8 years ago)

Tweak colors, ensure that background position control is displayed in 3 columns.

  • src/wp-admin/css/customize-controls.css

     
    608608        float: left;
    609609}
    610610
     611/* Background Property Controls */
     612.customize-control-background_property .choice {
     613        position: relative;
     614        margin: 0 4px 4px 0;
     615        padding: 0;
     616        width: 82px;
     617        height: 62px;
     618        border: 1px solid #ddd;
     619        background: #fff;
     620        color: #555;
     621        border-radius: 0;
     622        float: left;
     623        overflow: hidden;
     624}
     625
     626.customize-control-background_property .selected {
     627        border-color: #23282d;
     628        box-shadow: 0 0 0 3px #23282d;
     629}
     630
     631.customize-control-background_property .choice:hover,
     632.customize-control-background_property .choice:focus {
     633        box-shadow: 0 0 0 3px #0073aa;
     634        border-color: #0073aa;
     635        cursor: pointer;
     636        outline: none;
     637}
     638
     639.customize-control-background_property .choice:before {
     640        content: "";
     641        font: 40px/50px dashicons;
     642        width: 60px;
     643        height: 50px;
     644        position: absolute;
     645        left: 10px;
     646        top: 5px;
     647}
     648
     649#customize-control-background_size .choice:before,
     650#customize-control-background_position .choice:before {
     651        content: "\f128";
     652        background: #555;
     653        color: #fff;
     654}
     655
     656#customize-control-background_size .choice:hover:before,
     657#customize-control-background_size .choice:focus:before,
     658#customize-control-background_position .choice:hover:before,
     659#customize-control-background_position .choice:focus:before {
     660        background: #0073aa;
     661}
     662
     663#customize-control-background_size .choice:before {
     664        font: 30px/40px dashicons;
     665        width: 40px;
     666        height: 40px;
     667        position: absolute;
     668        left: 20px;
     669        top: 10px;
     670}
     671
     672#customize-control-background_size .choice:nth-of-type(2):before {
     673        height: 60px; /* Emulate background-size: contain. */
     674        top: 0;
     675        width: 60px;
     676        left: 10px;
     677        font-size: 40px;
     678        line-height: 60px;
     679}
     680
     681#customize-control-background_size .choice:nth-of-type(3):before {
     682        height: 60px; /* Emulate background-size: cover. */
     683        top: 0;
     684        width: 80px;
     685        left: 0;
     686        font-size: 60px;
     687        line-height: 80px; /* cut off the bottom of the icon */
     688}
     689
     690#customize-control-background_repeat .choice {
     691        width: 60px;
     692}
     693
     694#customize-control-background_repeat .choice:before {
     695        content: "\f128";
     696        font-size: 19px;
     697        left: -1px;
     698}
     699
     700#customize-control-background_repeat .choice:nth-of-type(2):before {
     701        content: "\f128\f128\f128"; /* Three image dashicons. */
     702}
     703
     704#customize-control-background_repeat .choice:nth-of-type(3):before {
     705        content: "\f128\f128\f128"; /* Three image dashicons. */
     706        font-size: 20px;
     707        width: 20px;
     708        line-height: 20px;
     709        left: 19px;
     710        height: 60px;
     711        top: 0;
     712        word-wrap: break-word;
     713}
     714
     715#customize-control-background_repeat .choice:nth-of-type(4):before {
     716        content: "\f128\f128\f128\f128\f128\f128\f128\f128\f128"; /* Nine image dashicons. */
     717        line-height: 20px;
     718        height: 60px;
     719        top: 0;
     720        word-wrap: break-word;
     721}
     722
     723#customize-control-background_repeat .choice:hover:before,
     724#customize-control-background_repeat .choice:focus:before {
     725        color: #0073aa;
     726}
     727
     728#customize-control-background_position {
     729        max-width: 300px;
     730}
     731
     732#customize-control-background_position .choice:before {
     733        font-size: 20px;
     734        line-height: 30px;
     735        width: 40px;
     736        height: 30px;
     737        top: 15px;
     738        left: 20px;
     739}
     740
     741#customize-control-background_position .choice:nth-of-type(1):before,
     742#customize-control-background_position .choice:nth-of-type(2):before,
     743#customize-control-background_position .choice:nth-of-type(3):before {
     744        top: 0;
     745}
     746
     747#customize-control-background_position .choice:nth-of-type(7):before,
     748#customize-control-background_position .choice:nth-of-type(8):before,
     749#customize-control-background_position .choice:nth-of-type(9):before {
     750        top: 30px;
     751}
     752
     753#customize-control-background_position .choice:nth-of-type(3n):before {
     754        left: 40px;
     755}
     756
     757#customize-control-background_position .choice:nth-of-type(3n - 2):before {
     758        left: 0;
     759}
     760
    611761#customize-preview iframe {
    612762        width: 100%;
    613763        height: 100%;
  • src/wp-admin/custom-background.php

     
    151151                        set_theme_mod('background_position_x', $position);
    152152                }
    153153
     154                if ( isset($_POST['background-position-y']) ) {
     155                        check_admin_referer('custom-background');
     156                        if ( in_array($_POST['background-position-y'], array('center', 'top', 'bottom')) )
     157                                $position = $_POST['background-position-y'];
     158                        else
     159                                $position = 'top';
     160                        set_theme_mod('background_position_y', $position);
     161                }
     162
    154163                if ( isset($_POST['background-attachment']) ) {
    155164                        check_admin_referer('custom-background');
    156165                        if ( in_array($_POST['background-attachment'], array('fixed', 'scroll')) )
     
    223232                        // Background-image URL must be single quote, see below.
    224233                        $background_styles .= ' background-image: url(\'' . $background_image_thumb . '\');'
    225234                                . ' background-repeat: ' . get_theme_mod( 'background_repeat', get_theme_support( 'custom-background', 'default-repeat' ) ) . ';'
    226                                 . ' background-position: top ' . get_theme_mod( 'background_position_x', get_theme_support( 'custom-background', 'default-position-x' ) );
     235                                . ' background-position: '. get_theme_mod( 'background_position_x', get_theme_support( 'custom-background', 'default-position-x' ) ) .' ' . get_theme_mod( 'background_position_x', get_theme_support( 'custom-background', 'default-position-x' ) );
    227236                }
    228237        ?>
    229238        <div id="custom-background-image" style="<?php echo $background_styles; ?>"><?php // must be double quote, see above ?>
     
    293302<tbody>
    294303<?php if ( get_background_image() ) : ?>
    295304<tr>
    296 <th scope="row"><?php _e( 'Position' ); ?></th>
     305<th scope="row"><?php _e( 'Position X' ); ?></th>
    297306<td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Background Position' ); ?></span></legend>
    298307<label>
    299308<input name="background-position-x" type="radio" value="left"<?php checked( 'left', get_theme_mod( 'background_position_x', get_theme_support( 'custom-background', 'default-position-x' ) ) ); ?> />
     
    310319</fieldset></td>
    311320</tr>
    312321
     322        <tr>
     323                <th scope="row"><?php _e( 'Position Y' ); ?></th>
     324                <td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Background Position' ); ?></span></legend>
     325                                <label>
     326                                        <input name="background-position-y" type="radio" value="left"<?php checked( 'top', get_theme_mod( 'background_position_y', get_theme_support( 'custom-background', 'default-position-y' ) ) ); ?> />
     327                                        <?php _e('Top') ?>
     328                                </label>
     329                                <label>
     330                                        <input name="background-position-y" type="radio" value="center"<?php checked( 'center', get_theme_mod( 'background_position_y', get_theme_support( 'custom-background', 'default-position-y' ) ) ); ?> />
     331                                        <?php _e('Center') ?>
     332                                </label>
     333                                <label>
     334                                        <input name="background-position-y" type="radio" value="right"<?php checked( 'bottom', get_theme_mod( 'background_position_y', get_theme_support( 'custom-background', 'default-position-y' ) ) ); ?> />
     335                                        <?php _e('Bottom') ?>
     336                                </label>
     337                        </fieldset></td>
     338        </tr>
     339
    313340<tr>
    314341<th scope="row"><?php _e( 'Repeat' ); ?></th>
    315342<td><fieldset><legend class="screen-reader-text"><span><?php _e( 'Background Repeat' ); ?></span></legend>
  • src/wp-admin/js/customize-controls.js

     
    21732173        });
    21742174
    21752175        /**
     2176         * A control for setting properties for custom backgrounds.
     2177         *
     2178         * @class
     2179         * @augments wp.customize.Control
     2180         * @augments wp.customize.Class
     2181         */
     2182        api.BackgroundPropertyControl = api.Control.extend({
     2183
     2184                /**
     2185                 * When the control's DOM structure is ready,
     2186                 * set up internal event bindings.
     2187                 */
     2188                ready: function() {
     2189                        var control = this, value, values;
     2190                       
     2191                        // Update setting when a choice is selected.
     2192                        control.container.on( 'click', '.choice', function( e ) {
     2193                                value = $( e.target ).val();
     2194                                if ( 'background_position' === control.id ) {
     2195                                        // Handle multiple settings associated with one control.
     2196                                        values = value.split( '-' );
     2197                                        control.settings[0]( values[0] ); // background_position_x
     2198                                        control.settings[1]( values[1] ); // background_position_y
     2199                                } else {
     2200                                        control.setting( value );
     2201                                }
     2202                                control.container.find( '.choice.selected' ).removeClass( 'selected' );
     2203                                $( e.target ).addClass( 'selected' );
     2204                        });
     2205
     2206                        // Set initial selection.
     2207                        if ( 'background_position' === control.id ) {
     2208                                // Handle multiple settings associated with one control.
     2209                                value = control.settings[0]() + '-' + control.settings[1](); // background_position_x|y
     2210                        } else {
     2211                                value = control.setting();
     2212                        }
     2213                        control.container.find( '.choice' ).each( function () {
     2214                                if ( value === $( this ).val() ) {
     2215                                        $( this ).addClass( 'selected' );
     2216                                }
     2217                        });
     2218                },
     2219        });
     2220
     2221        /**
    21762222         * A control for selecting and cropping an image.
    21772223         *
    21782224         * @class
     
    34043450
    34053451        api.settingConstructor = {};
    34063452        api.controlConstructor = {
    3407                 color:         api.ColorControl,
    3408                 media:         api.MediaControl,
    3409                 upload:        api.UploadControl,
    3410                 image:         api.ImageControl,
    3411                 cropped_image: api.CroppedImageControl,
    3412                 site_icon:     api.SiteIconControl,
    3413                 header:        api.HeaderControl,
    3414                 background:    api.BackgroundControl,
    3415                 theme:         api.ThemeControl
     3453                color:               api.ColorControl,
     3454                media:               api.MediaControl,
     3455                upload:              api.UploadControl,
     3456                image:               api.ImageControl,
     3457                cropped_image:       api.CroppedImageControl,
     3458                site_icon:           api.SiteIconControl,
     3459                header:              api.HeaderControl,
     3460                background:          api.BackgroundControl,
     3461                background_property: api.BackgroundPropertyControl,
     3462                theme:               api.ThemeControl
    34163463        };
    34173464        api.panelConstructor = {};
    34183465        api.sectionConstructor = {
     
    41104157
    41114158                // Control visibility for default controls
    41124159                $.each({
     4160                        'background_size': {
     4161                                controls: [ 'background_repeat' ],
     4162                                callback: function( to ) { return ( 'cover' !== to && !! api( 'background_image' ) ); } // Hide background repeat when size is cover.
     4163                        },
    41134164                        'background_image': {
    4114                                 controls: [ 'background_repeat', 'background_position_x', 'background_attachment' ],
     4165                                controls: [ 'background_size', 'background_repeat', 'background_position', 'background_attachment' ],
    41154166                                callback: function( to ) { return !! to; }
    41164167                        },
    41174168                        'show_on_front': {
  • src/wp-includes/class-wp-customize-manager.php

     
    215215                require_once( ABSPATH . WPINC . '/customize/class-wp-customize-upload-control.php' );
    216216                require_once( ABSPATH . WPINC . '/customize/class-wp-customize-image-control.php' );
    217217                require_once( ABSPATH . WPINC . '/customize/class-wp-customize-background-image-control.php' );
     218                require_once( ABSPATH . WPINC . '/customize/class-wp-customize-background-property-control.php' );
    218219                require_once( ABSPATH . WPINC . '/customize/class-wp-customize-cropped-image-control.php' );
    219220                require_once( ABSPATH . WPINC . '/customize/class-wp-customize-site-icon-control.php' );
    220221                require_once( ABSPATH . WPINC . '/customize/class-wp-customize-header-image-control.php' );
     
    19771978                $this->register_control_type( 'WP_Customize_Upload_Control' );
    19781979                $this->register_control_type( 'WP_Customize_Image_Control' );
    19791980                $this->register_control_type( 'WP_Customize_Background_Image_Control' );
     1981                $this->register_control_type( 'WP_Customize_Background_Property_Control' );
    19801982                $this->register_control_type( 'WP_Customize_Cropped_Image_Control' );
    19811983                $this->register_control_type( 'WP_Customize_Site_Icon_Control' );
    19821984                $this->register_control_type( 'WP_Customize_Theme_Control' );
     
    22062208
    22072209                $this->add_control( new WP_Customize_Background_Image_Control( $this ) );
    22082210
     2211                $this->add_setting( 'background_size', array(
     2212                        'default'        => get_theme_support( 'custom-background', 'default-size' ),
     2213                        'theme_supports' => 'custom-background',
     2214                ) );
     2215               
     2216                $this->add_control( new WP_Customize_Background_Property_Control( $this, 'background_size', array(
     2217                        'label'      => __( 'Background Size' ),
     2218                        'description' => __( 'Preview your site at different screen sizes to see how these work.' ),
     2219                        'section'    => 'background_image',
     2220                        'choices'    => array(
     2221                                'auto'    => __( 'Auto' ),
     2222                                'contain' => __( 'Contain' ),
     2223                                'cover'   => __( 'Cover' ),
     2224                        ),
     2225                ) ) );
     2226
     2227                $this->add_setting( 'background_attachment', array(
     2228                        'default'           => get_theme_support( 'custom-background', 'default-attachment' ),
     2229                        'theme_supports'    => 'custom-background',
     2230                        'sanitize_callback' => array( $this, '_sanitize_background_attachment' ),
     2231                ) );
     2232
     2233                $this->add_control( 'background_attachment', array(
     2234                        'label'      => __( 'Scroll image with page' ),
     2235                        'section'    => 'background_image',
     2236                        'type'       => 'checkbox',
     2237                ) );
     2238
    22092239                $this->add_setting( 'background_repeat', array(
    22102240                        'default'        => get_theme_support( 'custom-background', 'default-repeat' ),
    22112241                        'theme_supports' => 'custom-background',
    22122242                ) );
    22132243
    2214                 $this->add_control( 'background_repeat', array(
    2215                         'label'      => __( 'Background Repeat' ),
     2244                $this->add_control( new WP_Customize_Background_Property_Control( $this, 'background_repeat', array(
     2245                        'label'      => __( 'Tile Background' ),
    22162246                        'section'    => 'background_image',
    2217                         'type'       => 'radio',
    22182247                        'choices'    => array(
    22192248                                'no-repeat'  => __('No Repeat'),
    2220                                 'repeat'     => __('Tile'),
    22212249                                'repeat-x'   => __('Tile Horizontally'),
    22222250                                'repeat-y'   => __('Tile Vertically'),
     2251                                'repeat'     => __('Tile'),
    22232252                        ),
    2224                 ) );
     2253                ) ) );
    22252254
    22262255                $this->add_setting( 'background_position_x', array(
    22272256                        'default'        => get_theme_support( 'custom-background', 'default-position-x' ),
    2228                         'theme_supports' => 'custom-background',
     2257                        'theme_supports' => 'custom-background', // @todo sanitize callback
    22292258                ) );
    22302259
    2231                 $this->add_control( 'background_position_x', array(
    2232                         'label'      => __( 'Background Position' ),
    2233                         'section'    => 'background_image',
    2234                         'type'       => 'radio',
    2235                         'choices'    => array(
    2236                                 'left'       => __('Left'),
    2237                                 'center'     => __('Center'),
    2238                                 'right'      => __('Right'),
    2239                         ),
    2240                 ) );
    2241 
    2242                 $this->add_setting( 'background_attachment', array(
    2243                         'default'        => get_theme_support( 'custom-background', 'default-attachment' ),
     2260                $this->add_setting( 'background_position_y', array(
     2261                        'default'        => get_theme_support( 'custom-background', 'default-position-y' ),
    22442262                        'theme_supports' => 'custom-background',
    22452263                ) );
    22462264
    2247                 $this->add_control( 'background_attachment', array(
    2248                         'label'      => __( 'Background Attachment' ),
    2249                         'section'    => 'background_image',
    2250                         'type'       => 'radio',
    2251                         'choices'    => array(
    2252                                 'scroll'     => __('Scroll'),
    2253                                 'fixed'      => __('Fixed'),
     2265                $this->add_control( new WP_Customize_Background_Property_Control( $this, 'background_position', array(
     2266                        'label'    => __( 'Background Position' ),
     2267                        'section'  => 'background_image',
     2268                        'settings' => array( 'background_position_x', 'background_position_y' ),
     2269                        'choices'  => array(
     2270                                'left-top'      => __( 'Left, Top' ),
     2271                                'center-top'    => __( 'Center, Top' ),
     2272                                'right-top'     => __( 'Right, Top' ),
     2273                                'left-center'   => __( 'Left, Center' ),
     2274                                'center-center' => __( 'Center, Center' ),
     2275                                'right-center'  => __( 'Right, Center' ),
     2276                                'left-bottom'   => __( 'Left, Bottom' ),
     2277                                'center-bottom' => __( 'Center, Bottom' ),
     2278                                'right-bottom'  => __( 'Right, Bottom' ),
    22542279                        ),
    2255                 ) );
     2280                ) ) );
    22562281
     2282
    22572283                // If the theme is using the default background callback, we can update
    22582284                // the background CSS using postMessage.
    22592285                if ( get_theme_support( 'custom-background', 'wp-head-callback' ) === '_custom_background_cb' ) {
    2260                         foreach ( array( 'color', 'image', 'position_x', 'repeat', 'attachment' ) as $prop ) {
     2286                        foreach ( array( 'color', 'image', 'size', 'position_x', 'position_y', 'repeat', 'attachment' ) as $prop ) {
    22612287                                $this->get_setting( 'background_' . $prop )->transport = 'postMessage';
    22622288                        }
    22632289                }
     
    23522378        }
    23532379
    23542380        /**
     2381         * Callback for sanitizing the background_attachment value.
     2382         *
     2383         * Converts the current checkbox UI to `fixed` or `scroll`.
     2384         *
     2385         * @since 4.7.0
     2386         *
     2387         * @param string $value
     2388         * @return mixed
     2389         */
     2390        public function _sanitize_background_attachment( $value ) {
     2391                if ( ! $value || 'fixed' === $value ) {
     2392                        return 'fixed';
     2393                } else {
     2394                        return 'scroll';
     2395                }
     2396        }
     2397
     2398        /**
    23552399         * Callback for rendering the custom logo, used in the custom_logo partial.
    23562400         *
    23572401         * This method exists because the partial object and context data are passed
  • src/wp-includes/customize/class-wp-customize-background-property-control.php

     
     1<?php
     2/**
     3 * Customize API: WP_Customize_Background_Property_Control class
     4 *
     5 * @package WordPress
     6 * @subpackage Customize
     7 * @since 4.7.0
     8 */
     9
     10/**
     11 * Customize Background Property Control Class.
     12 *
     13 * Used to display a series of css-formetted buttons to control various properties.
     14 * @since 4.7.0
     15 */
     16class WP_Customize_Background_Property_Control extends WP_Customize_Control {
     17
     18        /**
     19         * Control type.
     20         *
     21         * @since 4.7.0
     22         * @access public
     23         * @var string
     24         */
     25        public $type = 'background_property';
     26
     27        /**
     28         * Don't render the control's content - it uses a JS template instead.
     29         *
     30         * @since 4.7.0
     31         * @access public
     32         */
     33        public function render_content() {}
     34
     35        /**
     36         * JS/Underscore template for the control UI.
     37         *
     38         * @since 4.7.0
     39         * @access public
     40         */
     41        public function content_template() {
     42                ?>
     43                <# if ( data.label ) { #>
     44                        <span class="customize-control-title">{{ data.label }}</span>
     45                <# } if ( data.description ) { #>
     46                        <span class="description customize-control-description">{{ data.description }}</span>
     47                <# }
     48
     49                jQuery.each( data.choices, function ( key, value ) { #>
     50                        <?php /* translators: $1%s: control label, $2%s: choice label */ ?>
     51                        <button type="button" value="{{ key }}" class="choice"><span class="screen-reader-text"><?php printf( __( 'Set %1$s to %2$s' ), '{{ data.label }}', '{{ value }}' ); ?></span></button>
     52                <# }); #>
     53                <?php
     54        }
     55
     56        /**
     57         * Return parameters for this control to export to JS.
     58         *
     59         * @since 4.7.0
     60         * @access public
     61         *
     62         * @return array Exported parameters.
     63         */
     64        public function json() {
     65                $exported            = parent::json();
     66                $exported['choices'] = $this->choices;
     67
     68                return $exported;
     69        }
     70}
  • src/wp-includes/js/customize-preview.js

     
    185185                });
    186186
    187187                /* Custom Backgrounds */
    188                 bg = $.map(['color', 'image', 'position_x', 'repeat', 'attachment'], function( prop ) {
     188                bg = $.map(['color', 'image', 'size', 'position_x', 'position_y', 'repeat', 'attachment'], function( prop ) {
    189189                        return 'background_' + prop;
    190190                });
    191191
    192                 api.when.apply( api, bg ).done( function( color, image, position_x, repeat, attachment ) {
     192                api.when.apply( api, bg ).done( function( color, image, size, position_x, position_y, repeat, attachment ) {
    193193                        var body = $(document.body),
    194194                                head = $('head'),
    195195                                style = $('#custom-background-css'),
     
    196196                                update;
    197197
    198198                        update = function() {
    199                                 var css = '';
     199                                var css = '', attachmentString;
    200200
    201201                                // The body will support custom backgrounds if either
    202202                                // the color or image are set.
     
    204204                                // See get_body_class() in /wp-includes/post-template.php
    205205                                body.toggleClass( 'custom-background', !! ( color() || image() ) );
    206206
    207                                 if ( color() )
     207                                if ( color() ) {
    208208                                        css += 'background-color: ' + color() + ';';
     209                                }
    209210
    210211                                if ( image() ) {
     212                                        if ( ! attachment() || 'fixed' === attachment() ) {
     213                                                attachmentString = 'fixed';
     214                                        } else {
     215                                                attachmentString = 'scroll';
     216                                        }
    211217                                        css += 'background-image: url("' + image() + '");';
    212                                         css += 'background-position: top ' + position_x() + ';';
     218                                        css += 'background-size: ' + size() + ';';
     219                                        css += 'background-position: ' + position_x() + ' ' + position_y() + ';';
    213220                                        css += 'background-repeat: ' + repeat() + ';';
    214                                         css += 'background-attachment: ' + attachment() + ';';
     221                                        css += 'background-attachment: ' + attachmentString + ';';
    215222                                }
    216223
    217224                                // Refresh the stylesheet by removing and recreating it.
  • src/wp-includes/theme.php

     
    13761376        if ( $background ) {
    13771377                $image = " background-image: url('$background');";
    13781378
     1379                $size = get_theme_mod( 'background_size', get_theme_support( 'custom-background', 'default-size' ) );
     1380                if ( ! in_array( $size, array( 'auto', 'contain', 'cover' ) ) ) {
     1381                        $size = 'auto';
     1382                }
     1383
     1384                $size = " background-size: $size;";
     1385
    13791386                $repeat = get_theme_mod( 'background_repeat', get_theme_support( 'custom-background', 'default-repeat' ) );
    1380                 if ( ! in_array( $repeat, array( 'no-repeat', 'repeat-x', 'repeat-y', 'repeat' ) ) )
     1387                if ( ! in_array( $repeat, array( 'no-repeat', 'repeat-x', 'repeat-y', 'repeat' ) ) ) {
    13811388                        $repeat = 'repeat';
     1389                }
    13821390                $repeat = " background-repeat: $repeat;";
    13831391
    1384                 $position = get_theme_mod( 'background_position_x', get_theme_support( 'custom-background', 'default-position-x' ) );
    1385                 if ( ! in_array( $position, array( 'center', 'right', 'left' ) ) )
    1386                         $position = 'left';
    1387                 $position = " background-position: top $position;";
     1392                $position_x = get_theme_mod( 'background_position_x', get_theme_support( 'custom-background', 'default-position-x' ) );
     1393                if ( ! in_array( $position_x, array( 'center', 'right', 'left' ) ) ) {
     1394                        $position_x = 'left';
     1395                }
    13881396
     1397                $position_y = get_theme_mod( 'background_position_y', get_theme_support( 'custom-background', 'default-position-y' ) );
     1398                if ( ! in_array( $position_y, array( 'center', 'top', 'bottom' ) ) ) {
     1399                        $position_y = 'top';
     1400                }
     1401
     1402                $position = " background-position: $position_y $position_x;";
     1403
    13891404                $attachment = get_theme_mod( 'background_attachment', get_theme_support( 'custom-background', 'default-attachment' ) );
    1390                 if ( ! in_array( $attachment, array( 'fixed', 'scroll' ) ) )
     1405                if ( ! in_array( $attachment, array( 'fixed', 'scroll' ) ) ) {
    13911406                        $attachment = 'scroll';
     1407                }
    13921408                $attachment = " background-attachment: $attachment;";
    13931409
    1394                 $style .= $image . $repeat . $position . $attachment;
     1410                $style .= $image . $size . $repeat . $position . $attachment;
    13951411        }
    13961412?>
    13971413<style type="text/css" id="custom-background-css">