Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add option to choose if the checkout marks either required or optional fields, and style these options.

This commit is contained in:
Mike Jolley 2018-04-05 14:12:59 +01:00
parent 0091d7a18c
commit 3a6c3e002b
11 changed files with 77 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
assets/css/twenty-seventeen-rtl.css
View File

File diff suppressed because one or more lines are too long

2
assets/css/twenty-seventeen.css
View File

File diff suppressed because one or more lines are too long

8
assets/css/twenty-seventeen.scss
View File

@ -139,12 +139,18 @@
.required {
color: firebrick;
text-decoration: none;
visibility: hidden; // Only show optional by default.
&[title] {
border-bottom: none;
border: 0 !important;
}
}
.optional {
visibility: visible;
}
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {

2
assets/css/woocommerce-rtl.css
View File

File diff suppressed because one or more lines are too long

2
assets/css/woocommerce.css
View File

File diff suppressed because one or more lines are too long

8
assets/css/woocommerce.scss
View File

@ -1284,7 +1284,13 @@ p.demo_store,
.required {
color: red;
font-weight: 700;
border: 0;
border: 0 !important;
text-decoration: none;
visibility: hidden; // Only show optional by default.
}
.optional {
visibility: visible;
}
.input-checkbox {

12
assets/js/frontend/address-i18n.js
View File

@ -11,13 +11,19 @@ jQuery( function( $ ) {
function field_is_required( field, is_required ) {
if ( is_required ) {
if ( field.find( 'label abbr.required' ).length === 0 ) {
field.find( 'label' ).append( '&nbsp;<abbr class="required" title="' + wc_address_i18n_params.i18n_required_text + '">*</abbr>' );
field.find( 'label .optional' ).remove();
field.addClass( 'validate-required' );
if ( field.find( 'label .required' ).length === 0 ) {
field.find( 'label' ).append( '&nbsp;<abbr class="required" title="' + wc_address_i18n_params.i18n_required_text + '">*</abbr>' );
}
} else {
field.find( 'label abbr' ).remove();
field.find( 'label .required' ).remove();
field.removeClass( 'validate-required' );
if ( field.find( 'label .required' ).length === 0 ) {
field.find( 'label' ).append( '&nbsp;<span class="optional">(' + wc_address_i18n_params.i18n_optional_text + ')</span>' );
}
}
}

2
assets/js/frontend/address-i18n.min.js vendored
View File

@ -1 +1 @@
jQuery(function(e){function a(e,a){a?0===e.find("label abbr.required").length&&(e.find("label").append('&nbsp;<abbr class="required" title="'+wc_address_i18n_params.i18n_required_text+'">*</abbr>'),e.addClass("validate-required")):(e.find("label abbr").remove(),e.removeClass("validate-required"))}if("undefined"==typeof wc_address_i18n_params)return!1;var i=wc_address_i18n_params.locale.replace(/&quot;/g,'"'),d=e.parseJSON(i);e(document.body).bind("country_to_state_changing",function(i,t,r){var l,n=r;l="undefined"!=typeof d[t]?d[t]:d["default"];var o=n.find("#billing_postcode_field, #shipping_postcode_field"),s=n.find("#billing_city_field, #shipping_city_field"),f=n.find("#billing_state_field, #shipping_state_field");o.attr("data-o_class")||(o.attr("data-o_class",o.attr("class")),s.attr("data-o_class",s.attr("class")),f.attr("data-o_class",f.attr("class")));var p=e.parseJSON(wc_address_i18n_params.locale_fields);e.each(p,function(i,t){var r=n.find(t),o=e.extend(!0,{},d["default"][i],l[i]);"undefined"!=typeof o.label&&r.find("label").html(o.label),"undefined"!=typeof o.placeholder&&(r.find("input").attr("placeholder",o.placeholder),r.find(".select2-selection__placeholder").text(o.placeholder)),"undefined"!=typeof o.placeholder||"undefined"==typeof o.label||r.find("label").length||(r.find("input").attr("placeholder",o.label),r.find(".select2-selection__placeholder").text(o.label)),"undefined"!=typeof o.required?a(r,o.required):a(r,!1),"undefined"!=typeof o.priority&&r.data("priority",o.priority),"state"!==i&&("undefined"!=typeof o.hidden&&!0===o.hidden?r.hide().find("input").val(""):r.show())}),e(".woocommerce-billing-fields__field-wrapper, .woocommerce-shipping-fields__field-wrapper, .woocommerce-address-fields__field-wrapper, .woocommerce-additional-fields__field-wrapper .woocommerce-account-fields").each(function(a,i){var d=e(i).find(".form-row"),t=d.first().parent(),r=0;d.each(function(){e(this).data("priority")||e(this).data("priority",r+1),r=e(this).data("priority")}),d.sort(function(a,i){var d=e(a).data("priority"),t=e(i).data("priority");return d>t?1:d<t?-1:0}),d.detach().appendTo(t)})})});
jQuery(function(e){function a(e,a){a?(e.find("label .optional").remove(),e.addClass("validate-required"),0===e.find("label .required").length&&e.find("label").append('&nbsp;<abbr class="required" title="'+wc_address_i18n_params.i18n_required_text+'">*</abbr>')):(e.find("label .required").remove(),e.removeClass("validate-required"),0===e.find("label .required").length&&e.find("label").append('&nbsp;<span class="optional">('+wc_address_i18n_params.i18n_optional_text+")</span>"))}if("undefined"==typeof wc_address_i18n_params)return!1;var i=wc_address_i18n_params.locale.replace(/&quot;/g,'"'),d=e.parseJSON(i);e(document.body).bind("country_to_state_changing",function(i,t,r){var l,n=r;l="undefined"!=typeof d[t]?d[t]:d["default"];var o=n.find("#billing_postcode_field, #shipping_postcode_field"),s=n.find("#billing_city_field, #shipping_city_field"),p=n.find("#billing_state_field, #shipping_state_field");o.attr("data-o_class")||(o.attr("data-o_class",o.attr("class")),s.attr("data-o_class",s.attr("class")),p.attr("data-o_class",p.attr("class")));var f=e.parseJSON(wc_address_i18n_params.locale_fields);e.each(f,function(i,t){var r=n.find(t),o=e.extend(!0,{},d["default"][i],l[i]);"undefined"!=typeof o.label&&r.find("label").html(o.label),"undefined"!=typeof o.placeholder&&(r.find("input").attr("placeholder",o.placeholder),r.find(".select2-selection__placeholder").text(o.placeholder)),"undefined"!=typeof o.placeholder||"undefined"==typeof o.label||r.find("label").length||(r.find("input").attr("placeholder",o.label),r.find(".select2-selection__placeholder").text(o.label)),"undefined"!=typeof o.required?a(r,o.required):a(r,!1),"undefined"!=typeof o.priority&&r.data("priority",o.priority),"state"!==i&&("undefined"!=typeof o.hidden&&!0===o.hidden?r.hide().find("input").val(""):r.show())}),e(".woocommerce-billing-fields__field-wrapper, .woocommerce-shipping-fields__field-wrapper, .woocommerce-address-fields__field-wrapper, .woocommerce-additional-fields__field-wrapper .woocommerce-account-fields").each(function(a,i){var d=e(i).find(".form-row"),t=d.first().parent(),r=0;d.each(function(){e(this).data("priority")||e(this).data("priority",r+1),r=e(this).data("priority")}),d.sort(function(a,i){var d=e(a).data("priority"),t=e(i).data("priority");return d>t?1:d<t?-1:0}),d.detach().appendTo(t)})})});

7
includes/class-wc-frontend-scripts.php
View File

@ -412,6 +412,12 @@ class WC_Frontend_Scripts {
self::enqueue_style( $handle, $args['src'], $args['deps'], $args['version'], $args['media'], $args['has_rtl'] );
}
}
if ( true === wc_string_to_bool( get_option( 'woocommerce_checkout_label_required_fields', 'yes' ) ) ) {
wp_add_inline_style( 'woocommerce-general', '.woocommerce form .form-row .required { visibility: visible; } .woocommerce form .form-row .optional { visibility: hidden; }' );
} else {
wp_add_inline_style( 'woocommerce-general', '.woocommerce form .form-row .required { visibility: hidden; } .woocommerce form .form-row .optional { visibility: visible; }' );
}
}
/**
@ -509,6 +515,7 @@ class WC_Frontend_Scripts {
'locale' => wp_json_encode( WC()->countries->get_country_locale() ),
'locale_fields' => wp_json_encode( WC()->countries->get_country_locale_field_selectors() ),
'i18n_required_text' => esc_attr__( 'required', 'woocommerce' ),
'i18n_optional_text' => esc_html__( 'optional', 'woocommerce' ),
);
break;
case 'wc-cart':

38
includes/customizer/class-wc-shop-customizer.php
View File

@ -170,6 +170,14 @@ class WC_Shop_Customizer {
} );
} );
wp.customize.section( 'woocommerce_checkout', function( section ) {
section.expanded.bind( function( isExpanded ) {
if ( isExpanded ) {
wp.customize.previewer.previewUrl.set( '<?php echo esc_js( wc_get_page_permalink( 'checkout' ) ); ?>' );
}
} );
} );
wp.customize( 'woocommerce_catalog_columns', function( setting ) {
setting.bind( function( value ) {
var min = parseInt( '<?php echo esc_js( $min_columns ); ?>', 10 );
@ -657,10 +665,36 @@ class WC_Shop_Customizer {
$wp_customize->add_section(
'woocommerce_checkout',
array(
'title' => __( 'Checkout Form Options', 'woocommerce' ),
'title' => __( 'Checkout', 'woocommerce' ),
'priority' => 20,
'panel' => 'woocommerce',
'description' => __( 'These options let you change the appearance of certain parts of the WooCommerce checkout form.', 'woocommerce' ),
'description' => __( 'These options let you change the appearance of certain parts of the WooCommerce checkout.', 'woocommerce' ),
)
);
// Register settings.
$wp_customize->add_setting(
'woocommerce_checkout_label_required_fields',
array(
'default' => 'yes',
'type' => 'option',
'capability' => 'manage_woocommerce',
)
);
// Register controls.
$wp_customize->add_control(
'woocommerce_checkout_label_required_fields',
array(
'label' => __( 'Label required fields', 'woocommerce' ),
'description' => __( 'Choose if required fields should be labeled with an asterisk, or if optional fields should be clearly marked instead.', 'woocommerce' ),
'section' => 'woocommerce_checkout',
'settings' => 'woocommerce_checkout_label_required_fields',
'type' => 'radio',
'choices' => array(
'yes' => __( 'Label required fields', 'woocommerce' ),
'no' => __( 'Label optional fields', 'woocommerce' ),
),
)
);
}

2
includes/wc-template-functions.php
View File

@ -2160,7 +2160,7 @@ if ( ! function_exists( 'woocommerce_form_field' ) ) {
$args['class'][] = 'validate-required';
$required = '&nbsp;<abbr class="required" title="' . esc_attr__( 'required', 'woocommerce' ) . '">*</abbr>';
} else {
$required = '';
$required = '&nbsp;<span class="optional">(' . esc_html__( 'optional', 'woocommerce' ) . ')</span>';
}
if ( is_string( $args['label_class'] ) ) {