WooCommerce Cart Tab - Version 0.1

Version Description

Initial release.

Download this release

Release Info

Developer jameskoster
Plugin Icon wp plugin WooCommerce Cart Tab
Version 0.1
Comparing to
See all releases

Version 0.1

Files changed (9) hide show
  1. README.md +4 -0
  2. assets/css/mixins.less +122 -0
  3. assets/css/style.css +1 -0
  4. assets/css/style.less +130 -0
  5. cart-tab.php +167 -0
  6. readme.txt +46 -0
  7. screenshot-1.png +0 -0
  8. screenshot-2.png +0 -0
  9. screenshot-3.png +0 -0
README.md ADDED
@@ -0,0 +1,4 @@
 
 
 
 
1
+ WooCommerce Cart Tab
2
+ ====================
3
+
4
+ Displays a link to the cart which is visible sitewide and fixed in position so it remains visible wherever the user scrolls. When the user hovers over the tab, the full cart widget is displayed.
assets/css/mixins.less ADDED
@@ -0,0 +1,122 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ // MIXINS
2
+ .clearfix() {
3
+ &:after {
4
+ content: "";
5
+ display: block;
6
+ clear: both;
7
+ }
8
+ }
9
+ .border_radius(@radius:10px)
10
+ {
11
+ -webkit-border-radius:@radius;
12
+ -moz-border-radius:@radius;
13
+ border-radius:@radius;
14
+ }
15
+
16
+ .border_radius_right(@radius:10px)
17
+ {
18
+ -webkit-border-top-right-radius: @radius;
19
+ -webkit-border-bottom-right-radius: @radius;
20
+ -moz-border-radius-topright: @radius;
21
+ -moz-border-radius-bottomright: @radius;
22
+ border-top-right-radius: @radius;
23
+ border-bottom-right-radius: @radius;
24
+ }
25
+
26
+ .border_radius_left(@radius:10px)
27
+ {
28
+ -webkit-border-top-left-radius: @radius;
29
+ -webkit-border-bottom-left-radius: @radius;
30
+ -moz-border-radius-topleft: @radius;
31
+ -moz-border-radius-bottomleft: @radius;
32
+ border-top-left-radius: @radius;
33
+ border-bottom-left-radius: @radius;
34
+ }
35
+
36
+ .border_radius_bottom(@radius:10px)
37
+ {
38
+ -webkit-border-bottom-left-radius: @radius;
39
+ -webkit-border-bottom-right-radius: @radius;
40
+ -moz-border-radius-bottomleft: @radius;
41
+ -moz-border-radius-bottomright: @radius;
42
+ border-bottom-left-radius: @radius;
43
+ border-bottom-right-radius: @radius;
44
+ }
45
+
46
+ .border_radius_top(@radius:10px)
47
+ {
48
+ -webkit-border-top-left-radius: @radius;
49
+ -webkit-border-top-right-radius: @radius;
50
+ -moz-border-radius-topleft: @radius;
51
+ -moz-border-radius-topright: @radius;
52
+ border-top-left-radius: @radius;
53
+ border-top-right-radius: @radius;
54
+ }
55
+
56
+ .box_shadow(@shadow_x:3px, @shadow_y:3px, @shadow_rad:3px, @shadow_in:3px, @shadow_color:#888)
57
+ {
58
+ box-shadow:@shadow_x @shadow_y @shadow_rad @shadow_in @shadow_color;
59
+ -webkit-box-shadow:@shadow_x @shadow_y @shadow_rad @shadow_in @shadow_color;
60
+ -moz-box-shadow:@shadow_x @shadow_y @shadow_rad @shadow_in @shadow_color;
61
+ -o-box-shadow:@shadow_x @shadow_y @shadow_rad @shadow_in @shadow_color;
62
+ }
63
+
64
+ .inset_box_shadow(@shadow_x:3px, @shadow_y:3px, @shadow_rad:3px, @shadow_in:3px, @shadow_color:#888)
65
+ {
66
+ box-shadow:inset @shadow_x @shadow_y @shadow_rad @shadow_in @shadow_color;
67
+ -webkit-box-shadow:inset @shadow_x @shadow_y @shadow_rad @shadow_in @shadow_color;
68
+ -moz-box-shadow:inset @shadow_x @shadow_y @shadow_rad @shadow_in @shadow_color;
69
+ -o-box-shadow:inset @shadow_x @shadow_y @shadow_rad @shadow_in @shadow_color;
70
+ }
71
+
72
+ .text_shadow(@shadow_x:3px, @shadow_y:3px, @shadow_rad:3px, @shadow_color:#fff)
73
+ {
74
+ text-shadow:@shadow_x @shadow_y @shadow_rad @shadow_color;
75
+ }
76
+
77
+ .vertical_gradient(@from: #000, @to: #FFF) {
78
+ background: @from;
79
+ background: -webkit-gradient(linear, left top, left bottom, from(@from), to(@to));
80
+ background: -webkit-linear-gradient(@from, @to);
81
+ background: -moz-linear-gradient(center top, @from 0%, @to 100%);
82
+ background: -moz-gradient(center top, @from 0%, @to 100%);
83
+ filter: e(%("progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=%d,endColorstr=%d)", @from, @to));
84
+ -ms-filter: %("progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=%d, endColorstr=%d)", @from, @to);
85
+ }
86
+
87
+ .transition(@selector:all, @animation:ease-in-out, @duration:.2s) {
88
+ -webkit-transition:@selector @animation @duration;
89
+ -moz-transition:@selector @animation @duration;
90
+ -o-transition:@selector @animation @duration;
91
+ transition:@selector @animation @duration;
92
+ }
93
+
94
+ .opacity(@opacity:0.75) {
95
+ filter:~"alpha(opacity=@opacity * 100)";
96
+ -moz-opacity:@opacity;
97
+ -khtml-opacity: @opacity;
98
+ opacity: @opacity;
99
+ }
100
+
101
+ .rotate(@degree:1deg) {
102
+ -webkit-transform:rotate(@degree);
103
+ -moz-transform:rotate(@degree);
104
+ }
105
+
106
+ .scale(@ratio:1.5){
107
+ -webkit-transform:scale(@ratio);
108
+ -moz-transform:scale(@ratio);
109
+ transform:scale(@ratio);
110
+ }
111
+
112
+ .radial_gradient(@from: #000, @to: #FFF) {
113
+ background: @from;
114
+ background: -webkit-gradient(radial, 50% 10%, 0, 50% 10%, 1000, from(@from), to(@to));
115
+ background: -moz-radial-gradient(center top, @from 0%, @to 100%);
116
+ }
117
+
118
+ .borderbox () {
119
+ -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
120
+ -moz-box-sizing: border-box; /* Firefox, other Gecko */
121
+ box-sizing: border-box; /* Opera/IE 8+ */
122
+ }
assets/css/style.css ADDED
@@ -0,0 +1 @@
 
1
+ .cart-tab{width:22em;position:fixed;top:5em;z-index:9999999}.cart-tab a.cart-parent{position:absolute;top:0;display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:1.618em;text-decoration:none}.cart-tab a.cart-parent span.contents{display:block;color:#666;font-size:.8em}.cart-tab a.cart-parent:hover{text-decoration:none}.cart-tab .widget{padding:1.618em;margin:0}.cart-tab.light{background:#fff}.cart-tab.light a.cart-parent,.cart-tab.light .widget{box-shadow:0 2px 1em 0 rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 1em 0 rgba(0,0,0,0.2);-moz-box-shadow:0 2px 1em 0 rgba(0,0,0,0.2);-o-box-shadow:0 2px 1em 0 rgba(0,0,0,0.2)}.cart-tab.light a.cart-parent{background:#fff}.cart-tab.light a.cart-parent:after{content:"";display:block;width:10px;height:100%;background:#fff;position:absolute;top:0;right:-10px}.cart-tab.dark{background:#333}.cart-tab.dark a.cart-parent,.cart-tab.dark .widget{box-shadow:0 2px 1em 0 rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 1em 0 rgba(0,0,0,0.2);-moz-box-shadow:0 2px 1em 0 rgba(0,0,0,0.2);-o-box-shadow:0 2px 1em 0 rgba(0,0,0,0.2)}.cart-tab.dark a.cart-parent{background:#333}.cart-tab.dark a.cart-parent:after{content:"";display:block;width:10px;height:100%;background:#333;position:absolute;top:0;right:-10px}.cart-tab.right{right:-22em;-webkit-transition:right ease .5s;-moz-transition:right ease .5s;-o-transition:right ease .5s;transition:right ease .5s}.cart-tab.right a.cart-parent{left:-8.402328em;width:8.402328em;-webkit-border-top-left-radius:3px;-webkit-border-bottom-left-radius:3px;-moz-border-radius-topleft:3px;-moz-border-radius-bottomleft:3px;border-top-left-radius:3px;border-bottom-left-radius:3px}.cart-tab.right:hover{right:0}.cart-tab.right .widget{-webkit-border-bottom-left-radius:3px;-webkit-border-bottom-right-radius:3px;-moz-border-radius-bottomleft:3px;-moz-border-radius-bottomright:3px;border-bottom-left-radius:3px;border-bottom-right-radius:3px;-webkit-border-top-right-radius:0;-webkit-border-bottom-right-radius:0;-moz-border-radius-topright:0;-moz-border-radius-bottomright:0;border-top-right-radius:0;border-bottom-right-radius:0}.cart-tab.left{left:-22em;-webkit-transition:left ease .5s;-moz-transition:left ease .5s;-o-transition:left ease .5s;transition:left ease .5s}.cart-tab.left a.cart-parent{right:-8.402328em;width:8.402328em;-webkit-border-top-right-radius:3px;-webkit-border-bottom-right-radius:3px;-moz-border-radius-topright:3px;-moz-border-radius-bottomright:3px;border-top-right-radius:3px;border-bottom-right-radius:3px}.cart-tab.left:hover{left:0}.cart-tab.left .widget{-webkit-border-bottom-left-radius:3px;-webkit-border-bottom-right-radius:3px;-moz-border-radius-bottomleft:3px;-moz-border-radius-bottomright:3px;border-bottom-left-radius:3px;border-bottom-right-radius:3px;-webkit-border-top-left-radius:0;-webkit-border-bottom-left-radius:0;-moz-border-radius-topleft:0;-moz-border-radius-bottomleft:0;border-top-left-radius:0;border-bottom-left-radius:0}.cart-tab.left.light a.cart-parent:after,.cart-tab.left.dark a.cart-parent:after{right:auto;left:-10px}.cart-tab.no-animation.right:hover{right:-22em}.cart-tab.no-animation.left:hover{left:-22em}@media only screen and (-webkit-min-device-pixel-ratio:2),only screen and (min--moz-device-pixel-ratio:2),only screen and (-o-min-device-pixel-ratio:2/
assets/css/style.less ADDED
@@ -0,0 +1,130 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ @import 'mixins.less';
2
+
3
+ .cart-tab {
4
+ width:22em;
5
+ position: fixed;
6
+ top:5em;
7
+ z-index: 9999999;
8
+ a.cart-parent {
9
+ position: absolute;
10
+ top:0;
11
+ display: block;
12
+ .borderbox;
13
+ padding:1.618em;
14
+ text-decoration: none;
15
+ span.contents {
16
+ display: block;
17
+ color: #666;
18
+ font-size:.8em;
19
+ }
20
+ &:hover {
21
+ text-decoration: none;
22
+ }
23
+ }
24
+ .widget {
25
+ padding:1.618em;
26
+ margin:0;
27
+ }
28
+
29
+ // The light colour scheme
30
+ &.light {
31
+ background: #fff;
32
+ a.cart-parent, .widget {
33
+ .box_shadow(0,2px,1em,0,rgba(0,0,0,0.2));
34
+ }
35
+ a.cart-parent {
36
+ background: #fff;
37
+ &:after {
38
+ content: "";
39
+ display: block;
40
+ width:10px;
41
+ height:100%;
42
+ background: #fff;
43
+ position: absolute;
44
+ top:0;
45
+ right:-10px;
46
+ }
47
+ }
48
+ }
49
+
50
+ // The dark colour scheme
51
+ &.dark {
52
+ background: #333;
53
+ a.cart-parent, .widget {
54
+ .box_shadow(0,2px,1em,0,rgba(0,0,0,0.2));
55
+ }
56
+ a.cart-parent {
57
+ background: #333;
58
+ &:after {
59
+ content: "";
60
+ display: block;
61
+ width:10px;
62
+ height:100%;
63
+ background: #333;
64
+ position: absolute;
65
+ top:0;
66
+ right:-10px;
67
+ }
68
+ }
69
+ }
70
+
71
+ // If the cart tab is positioned to the right
72
+ &.right {
73
+ right:-22em;
74
+ .transition(right,ease,.5s);
75
+ a.cart-parent {
76
+ left:-8.402328em;
77
+ width:8.402328em;
78
+ .border_radius_left(3px);
79
+ }
80
+ &:hover {
81
+ right:0;
82
+ }
83
+ .widget {
84
+ .border_radius_bottom(3px);
85
+ .border_radius_right(0);
86
+ }
87
+ }
88
+
89
+ // If the cart tab is positioned to the left
90
+ &.left {
91
+ left:-22em;
92
+ .transition(left,ease,.5s);
93
+ a.cart-parent {
94
+ right:-8.402328em;
95
+ width:8.402328em;
96
+ .border_radius_right(3px);
97
+ }
98
+ &:hover {
99
+ left:0;
100
+ }
101
+ .widget {
102
+ .border_radius_bottom(3px);
103
+ .border_radius_left(0);
104
+ }
105
+ &.light, &.dark {
106
+ a.cart-parent:after {
107
+ right:auto;
108
+ left:-10px;
109
+ }
110
+ }
111
+ }
112
+
113
+ &.no-animation {
114
+ &.right:hover {
115
+ right:-22em;
116
+ }
117
+ &.left:hover {
118
+ left:-22em;
119
+ }
120
+ }
121
+ }
122
+
123
+ // Retina
124
+ @media
125
+ only screen and (-webkit-min-device-pixel-ratio: 2),
126
+ only screen and ( min--moz-device-pixel-ratio: 2),
127
+ only screen and ( -o-min-device-pixel-ratio: 2/1) {
128
+
129
+
130
+ }
cart-tab.php ADDED
@@ -0,0 +1,167 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ /*
3
+ Plugin Name: WooCommerce Cart Tab
4
+ Plugin URI: http://jameskoster.co.uk/tag/cart-tab/
5
+ Version: 0.1
6
+ Description: Displays a sitewide link to the cart which reveals the cart contents on hover.
7
+ Author: jameskoster
8
+ Tested up to: 3.5
9
+ Author URI: http://jameskoster.co.uk
10
+
11
+ License: GNU General Public License v3.0
12
+ License URI: http://www.gnu.org/licenses/gpl-3.0.html
13
+ */
14
+
15
+ /**
16
+ * Check if WooCommerce is active
17
+ **/
18
+ if ( in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', get_option( 'active_plugins' ) ) ) ) {
19
+
20
+ /**
21
+ * Localisation
22
+ **/
23
+ load_plugin_textdomain( 'woocommerce-cart-tab', false, dirname( plugin_basename( __FILE__ ) ) . '/' );
24
+
25
+
26
+ /**
27
+ * Accepted Payment Methods class
28
+ **/
29
+ if ( ! class_exists( 'WC_ct' ) ) {
30
+
31
+ class WC_ct {
32
+
33
+ public function __construct() {
34
+ add_action( 'wp_enqueue_scripts', array( &$this, 'setup_styles' ) ); // Enqueue the styles
35
+ add_action( 'wp_footer', array( &$this, 'woocommerce_cart_tab' ) ); // The cart tab function
36
+ add_filter( 'add_to_cart_fragments', array( &$this, 'wcct_add_to_cart_fragment' ) ); // The cart fragment
37
+
38
+ // Init settings
39
+ $this->settings = array(
40
+ array(
41
+ 'name' => __( 'Cart Tab', 'woocommerce-cart-tab' ),
42
+ 'type' => 'title',
43
+ 'id' => 'wc_ct_options'
44
+ ),
45
+ array(
46
+ 'name' => __( 'Cart Widget', 'woocommerce-cart-tab' ),
47
+ 'desc_tip' => __( 'Display the cart widget on hover', 'woocommerce-cart-tab' ),
48
+ 'id' => 'wc_ct_cart_widget',
49
+ 'type' => 'checkbox'
50
+ ),
51
+ array(
52
+ 'name' => __( 'Use the light or dark skin', 'woocommerce-cart-tab' ),
53
+ 'id' => 'wc_ct_skin',
54
+ 'type' => 'select',
55
+ 'options' => array(
56
+ 'light' => __( 'Light', 'woocommerce-cart-tab' ) ,
57
+ 'dark' => __( 'Dark', 'woocommerce-cart-tab' )
58
+ )
59
+ ),
60
+ array(
61
+ 'name' => __( 'Position the cart tab on the right or left', 'woocommerce-cart-tab' ),
62
+ 'id' => 'wc_ct_horizontal_position',
63
+ 'type' => 'select',
64
+ 'options' => array(
65
+ 'right' => __( 'Right', 'woocommerce-cart-tab' ) ,
66
+ 'left' => __( 'Left', 'woocommerce-cart-tab' )
67
+ )
68
+ ),
69
+ array( 'type' => 'sectionend', 'id' => 'wc_ct_options' ),
70
+ );
71
+
72
+
73
+ // Default options
74
+ add_option( 'wc_ct_cart_widget', 'yes' );
75
+ add_option( 'wc_ct_skin', 'light' );
76
+ add_option( 'wc_ct_horizontal_position', 'right' );
77
+
78
+
79
+ // Admin
80
+ add_action( 'woocommerce_settings_image_options_after', array( &$this, 'admin_settings' ), 20);
81
+ add_action( 'woocommerce_update_options_catalog', array( &$this, 'save_admin_settings' ) );
82
+ }
83
+
84
+
85
+ /*-----------------------------------------------------------------------------------*/
86
+ /* Class Functions */
87
+ /*-----------------------------------------------------------------------------------*/
88
+
89
+ // Load the settings
90
+ function admin_settings() {
91
+ woocommerce_admin_fields( $this->settings );
92
+ }
93
+
94
+
95
+ // Save the settings
96
+ function save_admin_settings() {
97
+ woocommerce_update_options( $this->settings );
98
+ }
99
+
100
+
101
+ // Setup styles
102
+ function setup_styles() {
103
+ if ( ! is_cart() && ! is_checkout() ) {
104
+ wp_enqueue_style( 'ct-styles', plugins_url( '/assets/css/style.css', __FILE__ ) );
105
+ }
106
+ }
107
+
108
+
109
+ // The cart fragment (ensures the cart button updates via AJAX)
110
+ function wcct_add_to_cart_fragment( $fragments ) {
111
+ global $woocommerce;
112
+ ob_start();
113
+ wcct_cart_button();
114
+ $fragments['a.cart-parent'] = ob_get_clean();
115
+ return $fragments;
116
+ }
117
+
118
+
119
+ /*-----------------------------------------------------------------------------------*/
120
+ /* Frontend Functions */
121
+ /*-----------------------------------------------------------------------------------*/
122
+
123
+ // Display the cart tab and widget
124
+ function woocommerce_cart_tab() {
125
+ global $woocommerce;
126
+ $skin = get_option( 'wc_ct_skin' );
127
+ $position = get_option( 'wc_ct_horizontal_position' );
128
+ $widget = get_option( 'wc_ct_cart_widget' );
129
+ if ( ! is_cart() && ! is_checkout() ) {
130
+ if ( $widget == 'yes' ) {
131
+ echo '<div class="' . $position . ' cart-tab ' . $skin . '">';
132
+ } else {
133
+ echo '<div class="' . $position . ' cart-tab no-animation ' . $skin . '">';
134
+ }
135
+ wcct_cart_button();
136
+ // Display the widget if specified
137
+ if ( $widget == 'yes' ) {
138
+ // Check for WooCommerce 2.0 and display the cart widget
139
+ if ( version_compare( WOOCOMMERCE_VERSION, "2.0.0" ) >= 0 ) {
140
+ the_widget( 'WC_Widget_Cart', 'title=' );
141
+ } else {
142
+ the_widget( 'WooCommerce_Widget_Cart', 'title=' );
143
+ }
144
+ }
145
+ echo '</div>';
146
+ }
147
+ }
148
+ }
149
+
150
+
151
+ // Displays the cart total and number of items as a link
152
+ function wcct_cart_button() {
153
+ global $woocommerce;
154
+ ?>
155
+ <a href="<?php echo $woocommerce->cart->get_cart_url(); ?>" title="<?php _e( 'View your shopping cart', 'woocommerce-cart-tab' ); ?>" class="cart-parent">
156
+ <?php
157
+ echo $woocommerce->cart->get_cart_total();
158
+ echo '<span class="contents">' . sprintf( _n( '%d item', '%d items', $woocommerce->cart->get_cart_contents_count(), 'woocommerce-cart-tab' ), $woocommerce->cart->get_cart_contents_count() ) . '</span>';
159
+ ?>
160
+ </a>
161
+ <?php
162
+ }
163
+
164
+
165
+ $WC_ct = new WC_ct();
166
+ }
167
+ }
readme.txt ADDED
@@ -0,0 +1,46 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ === WooCommerce Cart Tab ===
2
+ Contributors: jameskoster
3
+ Tags: woocommerce, ecommerce, cart
4
+ Requires at least: 3.3
5
+ Tested up to: 3.5.1
6
+ Stable tag: 0.1
7
+ License: GPLv2 or later
8
+ License URI: http://www.gnu.org/licenses/gpl-2.0.html
9
+
10
+ Displays a sitewide link to the cart which reveals the cart contents on hover.
11
+
12
+ == Description ==
13
+
14
+ Displays a link to the cart which is visible sitewide and fixed in position so it remains visible wherever the user scrolls. When the user hovers over the tab, the full cart widget is displayed.
15
+
16
+ There are options to display the cart tab on the right or the left, to use a light or dark skin to match your theme and to display the cart widget on hover or not.
17
+
18
+ == Installation ==
19
+
20
+ 1. Upload `woocommerce-cart-tab` to the `/wp-content/plugins/` directory
21
+ 2. Activate the plugin through the 'Plugins' menu in WordPress
22
+ 3. Choose your display settings on the catalog tab of the WooCommerce settings screen
23
+ 3. Done!
24
+
25
+ == Frequently Asked Questions ==
26
+
27
+ = It doesn't look like the screenshots on my site, what gives? =
28
+
29
+ This plugin uses CSS3 for things like animation, rounded corners and box shadows. If you're not using a modern browser then it might not look the same as the screenshots.
30
+
31
+ There is also the possibility that your theme is overwriting styles although that will be unlikely.
32
+
33
+ = I found and fixed a bug how can I help? =
34
+
35
+ Thanks! Please fork the repo on <a href="https://github.com/jameskoster/woocommerce-cart-tab">github</a>, push your fix then send a pull request.
36
+
37
+ == Screenshots ==
38
+
39
+ 1. The cart tab
40
+ 2. The cart tab on hover
41
+ 3. The cart tab with dark skin enabled
42
+
43
+ == Changelog ==
44
+
45
+ = 0.1 =
46
+ Initial release.
screenshot-1.png ADDED
Binary file
screenshot-2.png ADDED
Binary file
screenshot-3.png ADDED
Binary file