WooCommerce Grid / List toggle - Version 0.2.3

Version Description

  • 28/01/2013 =
  • Fixed active class bug on the toggle button
  • Styled the star-rating in list view
Download this release

Release Info

Developer jameskoster
Plugin Icon 128x128 WooCommerce Grid / List toggle
Version 0.2.3
Comparing to
See all releases

Code changes from version 0.2.2 to 0.2.3

Files changed (6) hide show
  1. assets/css/style.css +1 -1
  2. assets/css/style.less +2 -1
  3. assets/js/jquery.gridlistview.js +10 -10
  4. assets/js/jquery.gridlistview.min.js +1 -1
  5. grid-list-toggle.php +11 -11
  6. readme.txt +8 -4
assets/css/style.css CHANGED
@@ -1 +1 @@
1
- ul.products.grid div[itemprop="description"]{display:none}ul.products.grid hr{display:none}ul.products.list li.product{float:none!important;width:100%!important;text-align:left!important}ul.products.list li.product:after{content:"";display:block;clear:both}ul.products.list li.product img{width:30.75%!important;float:left;margin-bottom:1.5em;-webkit-transition:none!important}ul.products.list li.product h3,ul.products.list li.product div[itemprop="description"],ul.products.list li.product .price,ul.products.list li.product .gridlist-buttonwrap{width:65.4%;float:right;clear:none}ul.products.list li.product div[itemprop="description"]{display:block}ul.products.list li.product .gridlist-buttonwrap{margin-bottom:1.5em}ul.products.list li.product hr{clear:both}
1
+ ul.products.grid div[itemprop="description"]{display:none}ul.products.grid hr{display:none}ul.products.list li.product{float:none!important;width:100%!important;text-align:left!important}ul.products.list li.product:after{content:"";display:block;clear:both}ul.products.list li.product img{width:30.75%!important;float:left;margin-bottom:1.5em;-webkit-transition:none!important;margin-right:3.8%!important}ul.products.list li.product h3,ul.products.list li.product div[itemprop="description"],ul.products.list li.product .price,ul.products.list li.product .gridlist-buttonwrap{width:65.4%;float:right;clear:none}ul.products.list li.product div[itemprop="description"]{display:block}ul.products.list li.product .gridlist-buttonwrap{margin-bottom:1.5em}ul.products.list li.product hr{clear:both}
assets/css/style.less CHANGED
@@ -11,7 +11,7 @@ ul.products.grid {
11
 
12
  ul.products.list {
13
  li.product {
14
- float: none !important;
15
  width:100% !important;
16
  .clearfix;
17
  text-align: left !important;
@@ -20,6 +20,7 @@ ul.products.list {
20
  float: left;
21
  margin-bottom:1.5em;
22
  -webkit-transition:none !important;
 
23
  }
24
  h3, div[itemprop="description"], .price, .gridlist-buttonwrap {
25
  width: 65.4%;
11
 
12
  ul.products.list {
13
  li.product {
14
+ float: none !important;
15
  width:100% !important;
16
  .clearfix;
17
  text-align: left !important;
20
  float: left;
21
  margin-bottom:1.5em;
22
  -webkit-transition:none !important;
23
+ margin-right:3.8% !important;
24
  }
25
  h3, div[itemprop="description"], .price, .gridlist-buttonwrap {
26
  width: 65.4%;
assets/js/jquery.gridlistview.js CHANGED
@@ -1,7 +1,7 @@
1
  // The toggle
2
 
3
  jQuery(document).ready(function(){
4
-
5
  jQuery('#grid').click(function() {
6
  jQuery(this).addClass('active');
7
  jQuery('#list').removeClass('active');
@@ -11,7 +11,7 @@ jQuery(document).ready(function(){
11
  });
12
  return false;
13
  });
14
-
15
  jQuery('#list').click(function() {
16
  jQuery(this).addClass('active');
17
  jQuery('#grid').removeClass('active');
@@ -21,24 +21,24 @@ jQuery(document).ready(function(){
21
  });
22
  return false;
23
  });
24
-
25
  if (jQuery.cookie('gridcookie')) {
26
  jQuery('ul.products, #gridlist-toggle').addClass(jQuery.cookie('gridcookie'));
27
  }
28
 
29
  if (jQuery.cookie('gridcookie') == null) {
30
  jQuery('ul.products').addClass('grid');
31
- jQuery('#gridlist-toggle #grid').addClass('active');
32
  }
33
-
34
  if (jQuery.cookie('gridcookie') == 'grid') {
35
- jQuery('#gridlist-toggle #grid').addClass('active');
36
- jQuery('#gridlist-toggle #list').removeClass('active');
37
  }
38
-
39
  if (jQuery.cookie('gridcookie') == 'list') {
40
- jQuery('#gridlist-toggle #list').addClass('active');
41
- jQuery('#gridlist-toggle #grid').removeClass('active');
42
  }
43
 
44
  jQuery('#gridlist-toggle a').click(function(event) {
1
  // The toggle
2
 
3
  jQuery(document).ready(function(){
4
+
5
  jQuery('#grid').click(function() {
6
  jQuery(this).addClass('active');
7
  jQuery('#list').removeClass('active');
11
  });
12
  return false;
13
  });
14
+
15
  jQuery('#list').click(function() {
16
  jQuery(this).addClass('active');
17
  jQuery('#grid').removeClass('active');
21
  });
22
  return false;
23
  });
24
+
25
  if (jQuery.cookie('gridcookie')) {
26
  jQuery('ul.products, #gridlist-toggle').addClass(jQuery.cookie('gridcookie'));
27
  }
28
 
29
  if (jQuery.cookie('gridcookie') == null) {
30
  jQuery('ul.products').addClass('grid');
31
+ jQuery('.gridlist-toggle #grid').addClass('active');
32
  }
33
+
34
  if (jQuery.cookie('gridcookie') == 'grid') {
35
+ jQuery('.gridlist-toggle #grid').addClass('active');
36
+ jQuery('.gridlist-toggle #list').removeClass('active');
37
  }
38
+
39
  if (jQuery.cookie('gridcookie') == 'list') {
40
+ jQuery('.gridlist-toggle #list').addClass('active');
41
+ jQuery('.gridlist-toggle #grid').removeClass('active');
42
  }
43
 
44
  jQuery('#gridlist-toggle a').click(function(event) {
assets/js/jquery.gridlistview.min.js CHANGED
@@ -1,2 +1,2 @@
1
  // The toggle
2
- jQuery(document).ready(function(){jQuery("#grid").click(function(){jQuery(this).addClass("active");jQuery("#list").removeClass("active");jQuery.cookie("gridcookie","grid",{path:"/"});jQuery("ul.products").fadeOut(300,function(){jQuery(this).addClass("grid").removeClass("list").fadeIn(300)});return!1});jQuery("#list").click(function(){jQuery(this).addClass("active");jQuery("#grid").removeClass("active");jQuery.cookie("gridcookie","list",{path:"/"});jQuery("ul.products").fadeOut(300,function(){jQuery(this).removeClass("grid").addClass("list").fadeIn(300)});return!1});jQuery.cookie("gridcookie")&&jQuery("ul.products, #gridlist-toggle").addClass(jQuery.cookie("gridcookie"));if(jQuery.cookie("gridcookie")==null){jQuery("ul.products").addClass("grid");jQuery("#gridlist-toggle #grid").addClass("active")}if(jQuery.cookie("gridcookie")=="grid"){jQuery("#gridlist-toggle #grid").addClass("active");jQuery("#gridlist-toggle #list").removeClass("active")}if(jQuery.cookie("gridcookie")=="list"){jQuery("#gridlist-toggle #list").addClass("active");jQuery("#gridlist-toggle #grid").removeClass("active")}jQuery("#gridlist-toggle a").click(function(e){e.preventDefault()})});
1
  // The toggle
2
+ jQuery(document).ready(function(){jQuery("#grid").click(function(){jQuery(this).addClass("active");jQuery("#list").removeClass("active");jQuery.cookie("gridcookie","grid",{path:"/"});jQuery("ul.products").fadeOut(300,function(){jQuery(this).addClass("grid").removeClass("list").fadeIn(300)});return!1});jQuery("#list").click(function(){jQuery(this).addClass("active");jQuery("#grid").removeClass("active");jQuery.cookie("gridcookie","list",{path:"/"});jQuery("ul.products").fadeOut(300,function(){jQuery(this).removeClass("grid").addClass("list").fadeIn(300)});return!1});jQuery.cookie("gridcookie")&&jQuery("ul.products, #gridlist-toggle").addClass(jQuery.cookie("gridcookie"));if(jQuery.cookie("gridcookie")==null){jQuery("ul.products").addClass("grid");jQuery(".gridlist-toggle #grid").addClass("active")}if(jQuery.cookie("gridcookie")=="grid"){jQuery(".gridlist-toggle #grid").addClass("active");jQuery(".gridlist-toggle #list").removeClass("active")}if(jQuery.cookie("gridcookie")=="list"){jQuery(".gridlist-toggle #list").addClass("active");jQuery(".gridlist-toggle #grid").removeClass("active")}jQuery("#gridlist-toggle a").click(function(e){e.preventDefault()})});
grid-list-toggle.php CHANGED
@@ -3,7 +3,7 @@
3
  Plugin Name: WooCommerce Grid / List toggle
4
  Plugin URI: http://jameskoster.co.uk/tag/grid-list-toggle/
5
  Description: Adds a grid/list view toggle to product archives
6
- Version: 0.2.2
7
  Author: jameskoster
8
  Author URI: http://jameskoster.co.uk
9
  Requires at least: 3.1
@@ -21,19 +21,19 @@ if ( in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', g
21
  * Localisation
22
  **/
23
  load_plugin_textdomain('wc_list_grid_toggle', false, dirname( plugin_basename( __FILE__ ) ) . '/');
24
-
25
  /**
26
  * WC_List_Grid class
27
  **/
28
  if (!class_exists('WC_List_Grid')) {
29
-
30
  class WC_List_Grid {
31
-
32
- public function __construct() {
33
  // Hooks
34
  add_action( 'wp' , array(&$this, 'setup_gridlist' ) , 20);
35
  }
36
-
37
  // Functions
38
  // Setup
39
  function setup_gridlist() {
@@ -46,7 +46,7 @@ if ( in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', g
46
  add_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_single_excerpt', 5);
47
  }
48
  }
49
-
50
  // Scripts & styles
51
  function setup_scripts_styles() {
52
  if ( is_shop() || is_product_category() || is_product_tag() ) {
@@ -56,7 +56,7 @@ if ( in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', g
56
  wp_enqueue_style( 'grid-list-button', plugins_url( '/assets/css/button.css', __FILE__ ) );
57
  }
58
  }
59
-
60
  // Toggle button
61
  function gridlist_toggle_button() {
62
  ?>
@@ -65,7 +65,7 @@ if ( in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', g
65
  </nav>
66
  <?php
67
  }
68
-
69
  // Button wrap
70
  function gridlist_buttonwrap_open() {
71
  ?>
@@ -77,14 +77,14 @@ if ( in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', g
77
  </div>
78
  <?php
79
  }
80
-
81
  // hr
82
  function gridlist_hr() {
83
  ?>
84
  <hr />
85
  <?php
86
  }
87
- }
88
  $WC_List_Grid = new WC_List_Grid();
89
  }
90
  }
3
  Plugin Name: WooCommerce Grid / List toggle
4
  Plugin URI: http://jameskoster.co.uk/tag/grid-list-toggle/
5
  Description: Adds a grid/list view toggle to product archives
6
+ Version: 0.2.3
7
  Author: jameskoster
8
  Author URI: http://jameskoster.co.uk
9
  Requires at least: 3.1
21
  * Localisation
22
  **/
23
  load_plugin_textdomain('wc_list_grid_toggle', false, dirname( plugin_basename( __FILE__ ) ) . '/');
24
+
25
  /**
26
  * WC_List_Grid class
27
  **/
28
  if (!class_exists('WC_List_Grid')) {
29
+
30
  class WC_List_Grid {
31
+
32
+ public function __construct() {
33
  // Hooks
34
  add_action( 'wp' , array(&$this, 'setup_gridlist' ) , 20);
35
  }
36
+
37
  // Functions
38
  // Setup
39
  function setup_gridlist() {
46
  add_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_single_excerpt', 5);
47
  }
48
  }
49
+
50
  // Scripts & styles
51
  function setup_scripts_styles() {
52
  if ( is_shop() || is_product_category() || is_product_tag() ) {
56
  wp_enqueue_style( 'grid-list-button', plugins_url( '/assets/css/button.css', __FILE__ ) );
57
  }
58
  }
59
+
60
  // Toggle button
61
  function gridlist_toggle_button() {
62
  ?>
65
  </nav>
66
  <?php
67
  }
68
+
69
  // Button wrap
70
  function gridlist_buttonwrap_open() {
71
  ?>
77
  </div>
78
  <?php
79
  }
80
+
81
  // hr
82
  function gridlist_hr() {
83
  ?>
84
  <hr />
85
  <?php
86
  }
87
+ }
88
  $WC_List_Grid = new WC_List_Grid();
89
  }
90
  }
readme.txt CHANGED
@@ -3,7 +3,7 @@ Contributors: jameskoster
3
  Tags: woocommerce, grid, list, products, ecommerce
4
  Requires at least: 3.3
5
  Tested up to: 3.5
6
- Stable tag: 0.2.2
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
@@ -44,7 +44,7 @@ function remove_gridlist_styles() {
44
  }
45
  `
46
 
47
- That will remove the button styles but keep the layout styles which will allow you to design the buttons as you see fit.
48
 
49
  To remove the layout styles as well use:
50
 
@@ -62,16 +62,20 @@ function remove_gridlist_styles() {
62
 
63
  == Changelog ==
64
 
 
 
 
 
65
  = 0.2.2 - 16/01/2013 =
66
  * Re-applied button style. See FAQ to remove
67
  * YUI compressed CSS
68
  * Styles loaded on product tag archives
69
 
70
  = 0.2.1 - 10/01/2013 =
71
- * Add active class to grid button on initial load
72
 
73
  = 0.2 - 09/01/2013 =
74
- * Delayed gridlist_toggle_button() priority for better WooCommerce 2.0 compatibility
75
  * Even stricter CSS for list view (improves theme compatibility)
76
  * Changed #gridlist-toggle to .gridlist-toggle
77
 
3
  Tags: woocommerce, grid, list, products, ecommerce
4
  Requires at least: 3.3
5
  Tested up to: 3.5
6
+ Stable tag: 0.2.3
7
  License: GPLv2 or later
8
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
 
44
  }
45
  `
46
 
47
+ That will remove the button styles but keep the layout styles which will allow you to design the buttons as you see fit.
48
 
49
  To remove the layout styles as well use:
50
 
62
 
63
  == Changelog ==
64
 
65
+ = 0.2.3 - 28/01/2013 =
66
+ * Fixed active class bug on the toggle button
67
+ * Styled the star-rating in list view
68
+
69
  = 0.2.2 - 16/01/2013 =
70
  * Re-applied button style. See FAQ to remove
71
  * YUI compressed CSS
72
  * Styles loaded on product tag archives
73
 
74
  = 0.2.1 - 10/01/2013 =
75
+ * Add active class to grid button on initial load
76
 
77
  = 0.2 - 09/01/2013 =
78
+ * Delayed gridlist_toggle_button() priority for better WooCommerce 2.0 compatibility
79
  * Even stricter CSS for list view (improves theme compatibility)
80
  * Changed #gridlist-toggle to .gridlist-toggle
81