Ok, lets start from creating  user interface  through customizer API. Hope you guys know about Customizer setting API API of WordPress.

This is how i build user interface to choose number of related products on theme.

First add this code inside “customize_register” hooks.

//create section  for woocommerce setting

$wp_customize->add_section( 'woocommerce_settings', array(

'title' => __( 'Woocommerce Settings', 'theme_textdomain' ),
'priority' => 40,
'panel' => 'woo_set',
) );

//setting to display number of related products
$wp_customize->add_setting( 'woocommerce_products_num', array(
'default' => '4',
'sanitize_callback' => 'theme_sanitize_text',
) );

//setting to display number of related products
$wp_customize->add_setting( 'woocommerce_products_num', array(
'default' => '4',
'sanitize_callback' => 'Theme_sanitize_text',
) );
$wp_customize->add_control( 'woocommerce_products_num', array(
'label' => __( 'Number of Related products In product page', 'theme_textdomain' ),
'section' => 'woocommerce_settings',
'settings' => 'woocommerce_products_num',
'type' => 'select',
'choices' => array(
'1' => '1',
'2' => '2',
'3' => '3',
'4' => '4',
'5' => '5',
'6' => '6',
'7' => '7',
'8' => '8',
'9' => '9',
),
'priority' => 1,
) );

This above code will create multiple select option on backend.  To change number of related products i had used “woocommerce_output_related_products_args” filter hook.

Here is the example of it:

/**
* related products in woocommerce
*/
add_filter( 'woocommerce_output_related_products_args', 'jk_related_products_argsS' );

function jk_related_products_argSs( $args ) {
$related_product = get_theme_mod('woocommerce_products_num','4');
$no_of_rows = $related_product/3;

if($no_of_rows>1 && $no_of_rows= 3 || $no_of_rows>2) {
$args['posts_per_page'] = get_theme_mod('woocommerce_products_num');
$args['rows'] = 3;
} else {
$args['posts_per_page'] = get_theme_mod('woocommerce_products_num');
$args['rows'] = 1;
}
return $args;
}

Finally you will be able to change number of related products on products page.

If you got any problems on this please feel free to contact me. And  also if you have effective ideas than this , then please let me know

Thanks

sushil adhikari

Advertisements

Join the Conversation

2 Comments

  1. Hi Sushil,

    thank you for sharing this code. I was directed here by one of your other tutorials “How to make slider for woocommerce related product?”
    I already implemented above code, deleted cache, tried different browsers, etc, but I don’t see the multiple select option on backend you mentioned.
    Where should they appear exactly?
    I’m afraid recent Woocommerce changes may be the reason. Or do I need to get_template_directory ( ) before?

    Hope you are still active as I am looking forward to hear from you. 🙂 Best regards,

    -Björn

    Like

Leave a comment

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: