In this section we will learn WooCommerce customization from scratch in few steps before starting any step we know to neee few words about -,"WooCommerce is an open source e-commerce plugin for WordPress. It is designed for small to large-sized online merchants using WordPress".
1) First of all Install woocommerce plugin.
2)
// WooCommerce Theme Support
add_action( 'after_setup_theme', 'woocommerce_support' );
function woocommerce_support() {
add_theme_support( 'woocommerce' );
}
// Change number or products per row to 3
add_filter('loop_shop_columns', 'loop_columns');
if (!function_exists('loop_columns')) {
function loop_columns() {
return 3; // 3 products per row
}
}
/*** custom_woocommerce_template_loop_add_to_cart*/
function custom_woocommerce_product_add_to_cart_text() {
global $product;
$product_type = $product->product_type;
switch ( $product_type ) {
case 'external':
return __( 'Buy product', 'woocommerce' );
break;
case 'grouped':
return __( 'View products', 'woocommerce' );
break;
case 'simple':
return __( 'Add to cart', 'woocommerce' );
break;
case 'variable':
return __( 'Select options', 'woocommerce' );
break;
default:
return __( 'Read more', 'woocommerce' );
}
}
// Change woocommerce defaults breadcrumb
add_filter( 'woocommerce_breadcrumb_defaults', 'flipmart_woocommerce_breadcrumbs' );
function flipmart_woocommerce_breadcrumbs() {
return array(
'delimiter' => ' / ',
'wrap_before' => '<div class="breadcrumb-inner">
<ul class="list-inline list-unstyled">',
'wrap_after' => '</ul>
</div>',
'before' => '',
'after' => '',
'home' => _x( 'Home', 'breadcrumb', 'woocommerce' ),
);
}
// Remove woocommerce defaults breadcrumb
add_action( 'init', 'flipmart_remove_wc_breadcrumbs' );
function flipmart_remove_wc_breadcrumbs() {
remove_action( 'woocommerce_before_main_content', 'woocommerce_breadcrumb', 20, 0 );
}
// Remove Result count
add_action( 'init', 'flipmart_woocommerce_result_count' );
function flipmart_woocommerce_result_count() {
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_result_count', 20, 0 );
}
// Remove woocommerce defaults pagination
add_action( 'init', 'flipmart_woocommerce_pagination' );
function flipmart_woocommerce_pagination() {
remove_action( 'woocommerce_after_shop_loop', 'woocommerce_pagination', 10, 0 );
}
// custom pagination
function flipmart_pagination() {
global $wp_query;
$big = 999999999; // need an unlikely integer
$pages = paginate_links( array(
'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
'format' => '?paged=%#%',
'current' => max( 1, get_query_var('paged') ),
'total' => $wp_query->max_num_pages,
'type' => 'array',
'prev_next' => true,
'prev_text' => __('<i class="fa fa-angle-left"></i>'),
'next_text' => __('<i class="fa fa-angle-right"></i>'),
) );
if( is_array( $pages ) ) {
$paged = ( get_query_var('paged') == 0 ) ? 1 : get_query_var('paged');
echo '<div class="pagination-container"><ul class="list-inline list-unstyled">';
foreach ( $pages as $page ) {
echo "<li>$page</li>";
}
echo '</ul></div>';
}
}
// remove default sorting dropdown
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_ordering', 30 );
// WooCommerce custom catalog ordering
add_filter( 'woocommerce_catalog_orderby', 'flipmart_custom_woocommerce_catalog_orderby' );
function flipmart_custom_woocommerce_catalog_orderby( $sortby ) {
$sortby['menu_order'] = 'Position';
$sortby['price'] = 'Price:Lowest first';
$sortby['price-desc'] = 'Price:HIghest first';
unset($sortby['popularity']);
unset($sortby['date']);
unset($sortby['rating']);
return $sortby;
}
// call catlog ordering
<?php woocommerce_catalog_ordering(); ?>
// WooCommerce shop page show per page drop down
function flipmart_woocommerce_catalog_page_ordering() {
?>
<div class="lbl-cnt">
<?php echo '<span class="lbl">Show</span>' ?>
<form action="" method="POST" name="results" class="fld inline">
<select name="woocommerce-sort-by-columns" id="woocommerce-sort-by-columns" class="sortby" onchange="this.form.submit()">
<?php
//Get products on page reload
if (isset($_POST['woocommerce-sort-by-columns']) && (($_COOKIE['shop_pageResults'] <> $_POST['woocommerce-sort-by-columns']))) {
$numberOfProductsPerPage = $_POST['woocommerce-sort-by-columns'];
} else {
$numberOfProductsPerPage = $_COOKIE['shop_pageResults'];
}
// This is where you can change the amounts per page that the user will use feel free to change the numbers and text as you want, in my case we had 4 products per row so I chose to have multiples of four for the user to select.
$shopCatalog_orderby = apply_filters('woocommerce_sortby_page', array(
//Add as many of these as you like, -1 shows all products per page
// '' => __('Results per page', 'woocommerce'),
'12' => __('12', 'flipmart'),
'20' => __('20', 'flipmart'),
'30' => __('30', 'flipmart'),
'40' => __('40', 'flipmart'),
'50' => __('50', 'flipmart'),
'-1' => __('All', 'flipmart'),
));
foreach ( $shopCatalog_orderby as $sort_id => $sort_name )
echo '<option value="' . $sort_id . '" ' . selected( $numberOfProductsPerPage, $sort_id, true ) . ' >' . $sort_name . '</option>';
?>
</select>
</form>
</div>
<?php
}
// Total price
<?php echo WC()->cart->get_cart_total(); ?>
// Total items
<?php echo WC()->cart->get_cart_contents_count();?>
// Cart product
<?php
global $woocommerce;
$items = $woocommerce->cart->get_cart();
foreach($items as $item => $values) {
$_product = wc_get_product( $values['data']->get_id());
echo "<b>".$_product->get_title().'</b> <br> Quantity: '.$values['quantity'].'<br>';
$price = get_post_meta($values['product_id'] , '_price', true);
echo " Price: ".$price."<br>";
}
?>
// cart thumbnail
$thumbnail = apply_filters( 'woocommerce_in_cart_product_thumbnail', $_product->get_image(), $values, $cart_item_key ); echo $thumbnail;
// cart total price
<?php echo $woocommerce->cart->get_cart_total();?>
// remove item from cart
<?php
echo apply_filters(
'woocommerce_cart_item_remove_link',
sprintf(
'<a href="%s" class="remove" title="%s">×</a>',
esc_url( $woocommerce->cart->get_remove_url( $cart_item_key ) ),
__( 'Remove this item', 'woocommerce' )
),
$cart_item_key
);
?>
1) First of all Install woocommerce plugin.
2)
// WooCommerce Theme Support
add_action( 'after_setup_theme', 'woocommerce_support' );
function woocommerce_support() {
add_theme_support( 'woocommerce' );
}
// Change number or products per row to 3
add_filter('loop_shop_columns', 'loop_columns');
if (!function_exists('loop_columns')) {
function loop_columns() {
return 3; // 3 products per row
}
}
/*** custom_woocommerce_template_loop_add_to_cart*/
function custom_woocommerce_product_add_to_cart_text() {
global $product;
$product_type = $product->product_type;
switch ( $product_type ) {
case 'external':
return __( 'Buy product', 'woocommerce' );
break;
case 'grouped':
return __( 'View products', 'woocommerce' );
break;
case 'simple':
return __( 'Add to cart', 'woocommerce' );
break;
case 'variable':
return __( 'Select options', 'woocommerce' );
break;
default:
return __( 'Read more', 'woocommerce' );
}
}
// Change woocommerce defaults breadcrumb
add_filter( 'woocommerce_breadcrumb_defaults', 'flipmart_woocommerce_breadcrumbs' );
function flipmart_woocommerce_breadcrumbs() {
return array(
'delimiter' => ' / ',
'wrap_before' => '<div class="breadcrumb-inner">
<ul class="list-inline list-unstyled">',
'wrap_after' => '</ul>
</div>',
'before' => '',
'after' => '',
'home' => _x( 'Home', 'breadcrumb', 'woocommerce' ),
);
}
// Remove woocommerce defaults breadcrumb
add_action( 'init', 'flipmart_remove_wc_breadcrumbs' );
function flipmart_remove_wc_breadcrumbs() {
remove_action( 'woocommerce_before_main_content', 'woocommerce_breadcrumb', 20, 0 );
}
// Remove Result count
add_action( 'init', 'flipmart_woocommerce_result_count' );
function flipmart_woocommerce_result_count() {
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_result_count', 20, 0 );
}
// Remove woocommerce defaults pagination
add_action( 'init', 'flipmart_woocommerce_pagination' );
function flipmart_woocommerce_pagination() {
remove_action( 'woocommerce_after_shop_loop', 'woocommerce_pagination', 10, 0 );
}
// custom pagination
function flipmart_pagination() {
global $wp_query;
$big = 999999999; // need an unlikely integer
$pages = paginate_links( array(
'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
'format' => '?paged=%#%',
'current' => max( 1, get_query_var('paged') ),
'total' => $wp_query->max_num_pages,
'type' => 'array',
'prev_next' => true,
'prev_text' => __('<i class="fa fa-angle-left"></i>'),
'next_text' => __('<i class="fa fa-angle-right"></i>'),
) );
if( is_array( $pages ) ) {
$paged = ( get_query_var('paged') == 0 ) ? 1 : get_query_var('paged');
echo '<div class="pagination-container"><ul class="list-inline list-unstyled">';
foreach ( $pages as $page ) {
echo "<li>$page</li>";
}
echo '</ul></div>';
}
}
// remove default sorting dropdown
remove_action( 'woocommerce_before_shop_loop', 'woocommerce_catalog_ordering', 30 );
// WooCommerce custom catalog ordering
add_filter( 'woocommerce_catalog_orderby', 'flipmart_custom_woocommerce_catalog_orderby' );
function flipmart_custom_woocommerce_catalog_orderby( $sortby ) {
$sortby['menu_order'] = 'Position';
$sortby['price'] = 'Price:Lowest first';
$sortby['price-desc'] = 'Price:HIghest first';
unset($sortby['popularity']);
unset($sortby['date']);
unset($sortby['rating']);
return $sortby;
}
// call catlog ordering
<?php woocommerce_catalog_ordering(); ?>
// WooCommerce shop page show per page drop down
function flipmart_woocommerce_catalog_page_ordering() {
?>
<div class="lbl-cnt">
<?php echo '<span class="lbl">Show</span>' ?>
<form action="" method="POST" name="results" class="fld inline">
<select name="woocommerce-sort-by-columns" id="woocommerce-sort-by-columns" class="sortby" onchange="this.form.submit()">
<?php
//Get products on page reload
if (isset($_POST['woocommerce-sort-by-columns']) && (($_COOKIE['shop_pageResults'] <> $_POST['woocommerce-sort-by-columns']))) {
$numberOfProductsPerPage = $_POST['woocommerce-sort-by-columns'];
} else {
$numberOfProductsPerPage = $_COOKIE['shop_pageResults'];
}
// This is where you can change the amounts per page that the user will use feel free to change the numbers and text as you want, in my case we had 4 products per row so I chose to have multiples of four for the user to select.
$shopCatalog_orderby = apply_filters('woocommerce_sortby_page', array(
//Add as many of these as you like, -1 shows all products per page
// '' => __('Results per page', 'woocommerce'),
'12' => __('12', 'flipmart'),
'20' => __('20', 'flipmart'),
'30' => __('30', 'flipmart'),
'40' => __('40', 'flipmart'),
'50' => __('50', 'flipmart'),
'-1' => __('All', 'flipmart'),
));
foreach ( $shopCatalog_orderby as $sort_id => $sort_name )
echo '<option value="' . $sort_id . '" ' . selected( $numberOfProductsPerPage, $sort_id, true ) . ' >' . $sort_name . '</option>';
?>
</select>
</form>
</div>
<?php
}
// Total price
<?php echo WC()->cart->get_cart_total(); ?>
// Total items
<?php echo WC()->cart->get_cart_contents_count();?>
// Cart product
<?php
global $woocommerce;
$items = $woocommerce->cart->get_cart();
foreach($items as $item => $values) {
$_product = wc_get_product( $values['data']->get_id());
echo "<b>".$_product->get_title().'</b> <br> Quantity: '.$values['quantity'].'<br>';
$price = get_post_meta($values['product_id'] , '_price', true);
echo " Price: ".$price."<br>";
}
?>
// cart thumbnail
$thumbnail = apply_filters( 'woocommerce_in_cart_product_thumbnail', $_product->get_image(), $values, $cart_item_key ); echo $thumbnail;
// cart total price
<?php echo $woocommerce->cart->get_cart_total();?>
// remove item from cart
<?php
echo apply_filters(
'woocommerce_cart_item_remove_link',
sprintf(
'<a href="%s" class="remove" title="%s">×</a>',
esc_url( $woocommerce->cart->get_remove_url( $cart_item_key ) ),
__( 'Remove this item', 'woocommerce' )
),
$cart_item_key
);
?>
No comments:
Post a Comment