Merge pull request #88 from Automattic/87-radcliffe-2-wc-customizer-options-fix

Radcliffe 2: Adds support for the new WC 3.3+ Customizer options

radcliffe-2/inc/woocommerce.php

@@ -15,7 +15,18 @@
  * @return void
  */
 function radcliffe_2_woocommerce_setup() {
-	add_theme_support( 'woocommerce' );
+	add_theme_support( 'woocommerce', apply_filters( 'radcliffe_2_woocommerce_args', array(
+		'single_image_width'    => 600,
+		'thumbnail_image_width' => 300,
+		'product_grid'          => array(
+			'default_columns' => 3,
+			'default_rows'    => 4,
+			'min_columns'     => 1,
+			'max_columns'     => 6,
+			'min_rows'        => 1
+		)
+	) ) );
+
 	add_theme_support( 'wc-product-gallery-zoom' );
 	add_theme_support( 'wc-product-gallery-lightbox' );
 	add_theme_support( 'wc-product-gallery-slider' );
@@ -73,7 +84,10 @@ function radcliffe_2_woocommerce_products_per_page() {
 	return absint( apply_filters( 'radcliffe_2_woocommerce_products_per_page', 12 ) );
 }
 
-add_filter( 'loop_shop_per_page', 'radcliffe_2_woocommerce_products_per_page' );
+// Legacy WooCommerce products per page filter.
+if ( defined( 'WC_VERSION' ) && version_compare( WC_VERSION, '3.3', '<' ) ) {
+	add_filter( 'loop_shop_per_page', 'radcliffe_2_woocommerce_products_per_page' );
+}
 
 /**
  * Product gallery thumnbail columns
@@ -95,7 +109,10 @@ function radcliffe_2_woocommerce_loop_columns() {
 	return absint( apply_filters( 'radcliffe_2_woocommerce_loop_columns', 3 ) );
 }
 
-add_filter( 'loop_shop_columns', 'radcliffe_2_woocommerce_loop_columns' );
+// Legacy WooCommerce columns filter.
+if ( defined( 'WC_VERSION' ) && version_compare( WC_VERSION, '3.3', '<' ) ) {
+	add_filter( 'loop_shop_columns', 'radcliffe_2_woocommerce_loop_columns' );
+}
 
 /**
  * Related Products Args
@@ -121,13 +138,28 @@ if ( ! function_exists( 'radcliffe_2_woocommerce_product_columns_wrapper' ) ) {
 	 * @return  void
 	 */
 	function radcliffe_2_woocommerce_product_columns_wrapper() {
-		$columns = radcliffe_2_woocommerce_loop_columns();
+		$columns = radcliffe_2_loop_columns();
 		echo '<div class="columns-' . absint( $columns ) . '">';
 	}
 }
 
 add_action( 'woocommerce_before_shop_loop', 'radcliffe_2_woocommerce_product_columns_wrapper', 40 );
 
+if ( ! function_exists( 'radcliffe_2_loop_columns' ) ) {
+	/**
+	 * Default loop columns on product archives
+	 *
+	 * @return integer products per row
+	 */
+	function radcliffe_2_loop_columns() {
+		$columns = 3; // 3 products per row
+		if ( function_exists( 'wc_get_default_products_per_row' ) ) {
+			$columns = wc_get_default_products_per_row();
+		}
+		return apply_filters( 'radcliffe_2_loop_columns', $columns );
+	}
+}
+
 if ( ! function_exists( 'radcliffe_2_woocommerce_product_columns_wrapper_close' ) ) {
 	/**
 	 * Product columns wrapper close
@@ -277,7 +309,6 @@ if ( ! function_exists( 'radcliffe_2_woocommerce_header_cart' ) ) {
  */
 remove_action( 'woocommerce_before_main_content', 'woocommerce_breadcrumb', 20 );
 
-
 /**
  * Add breadcrumbs after
  *
@@ -285,3 +316,11 @@ remove_action( 'woocommerce_before_main_content', 'woocommerce_breadcrumb', 20 )
  * let's add the breadcrumbs before that, at priority 5
  */
 add_action( 'woocommerce_before_shop_loop', 'woocommerce_breadcrumb', 5 );
+
+/**
+ * Move the sale flash badge
+ */
+remove_action( 'woocommerce_before_shop_loop_item_title', 'woocommerce_show_product_loop_sale_flash', 10 );
+add_action( 'woocommerce_after_shop_loop_item_title', 'woocommerce_show_product_loop_sale_flash', 6 );
+remove_action ( 'woocommerce_before_single_product_summary', 'woocommerce_show_product_sale_flash', 10 );
+add_action ( 'woocommerce_single_product_summary', 'woocommerce_show_product_sale_flash', 5 );

radcliffe-2/style.css

@@ -4,7 +4,7 @@ Theme URI: http://wordpress.com/themes/radcliffe-2
 Author: Anders Norén
 Author URI: http://www.andersnoren.se
 Description: A theme for bloggers who want their content to take center stage.
-Version: 2.0.1-wpcom
+Version: 2.0.2-wpcom
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Text Domain: radcliffe-2

radcliffe-2/woocommerce.css

@@ -281,11 +281,7 @@ ul.products li.product .price ins {
 ul.products li.product .onsale {
 	font-size: 12px;
 	font-size: 1.2rem;
-	height: 50px;
-	left: 30px;
-	line-height: calc( 50px - .6em);
-	top: -20px;
-	width: 50px;
+	margin: 0;
 }
 
 ul.products li.product img {
@@ -304,7 +300,7 @@ ul.products li.product .button {
 
 @media screen and (min-width: 768px) {
 	ul.products li.product {
-		width: 30.7966666667%;
+		width: 22.15%;
 		float: left;
 		margin-right: 3.8%;
 	}
@@ -319,44 +315,43 @@ ul.products li.product .button {
 		width: 100%;
 	}
 	.columns-2 ul.products li.product {
-		width: 48.7333333333%;
+		width: 48.1%;
 	}
 	.columns-3 ul.products li.product {
-		width: 30.7966666667%;
+		width: 30.8%;
 	}
 	.columns-4 ul.products li.product {
-		width: 21.2%;
+		width: 22.15%;
 	}
 	.columns-5 ul.products li.product {
-		width: 14.9333333333%;
+		width: 16.96%;
 	}
 	.columns-6 ul.products li.product {
-		width: 10.3266666667%;
+		width: 13.5%;
 	}
 }
 
 .onsale {
-	background: #fff9c0;
-	border-radius: 100%;
-	display: block;
-	height: 80px;
+	border: 1px solid currentcolor;
+	border-radius: 3px;
+	color: #222222;
+	display: inline-block;
 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
 	font-weight: 700;
-	line-height: calc( 80px - .6em);
-	left: 33%;
-	padding: .3em;
-	position: absolute;
+	padding: .202em .6180469716em;
 	text-align: center;
 	text-transform: uppercase;
-	width: 80px;
-	z-index: 10;
+	margin-top: 0.5em;
+	margin-bottom: 1em;
 }
 
 /**/
 /* !Single product */
 /**/
 
-.single-product div.product {}
+.single-product .product_title {
+	margin-top: 0.5em;
+}
 
 .single-product div.product .onsale {
 	left: 4%;
@@ -403,6 +398,7 @@ ul.products li.product .button {
 
 .single-product div.product .woocommerce-product-gallery img {
 	display: block;
+	margin: 0 auto;
 }
 
 .single-product div.product .woocommerce-product-gallery__wrapper {
@@ -431,7 +427,7 @@ ul.products li.product .button {
 .single-product div.product .woocommerce-product-gallery .flex-control-thumbs {
 	content: "";
 	display: table;
-	margin: 0 auto 1em;
+	margin: 0 auto;
 	padding: 0;
 	table-layout: fixed;
 	text-align: center;
@@ -505,10 +501,20 @@ ul.products li.product .button {
 	clear: both;
 }
 
+.single.no-featured-image .site-header,
+.page.no-featured-image .site-header {
+	border-bottom: 1px solid #ddd;
+}
+
 .single-product div.product .woocommerce-product-details__short-description {
 	margin-bottom: 3em;
 }
 
+.single.no-featured-image.single-product .site-header,
+.page.no-featured-image.single-product .site-header {
+	border-bottom: 0;
+}
+
 .single-product div.product .cart {
 	border-top: 1px solid #ddd;
 	float: left;