Number of Products to Display

1. Changing the number of products per page – change the number 12 to what you want.

add_filter( 'storefront_products_per_page', 'sf_child_products_per_page' );
function sf_child_products_per_page() {
	return 12;
}

2. To change the number of products per row add this – where 4 is the number to change

add_filter( 'storefront_loop_columns', 'sf_child_products_per_row' );
function sf_child_products_per_row() {
	return 4;
}

Then you’ll want to update the css. Here is how I would do that. Make sure to change the number 4 with the number of columns you chose above. The 30px is the margin between the products.

.site-main ul.products li.product {
    width: calc( ( 100% - ( 30px * ( 4 - 1 ) ) ) / 4 );
    float: left;
    margin-right: 30px;
}

3. Can you give a link to an example where its happening and I can try to check it out for you.

Also make sure the php is going in your child functions file and the css is going in your child css file.

3) Here is an example:
https://www.backtoschool-deals.com/

Thanks so it looks like the plugin commission machine is adding the css that is cutting the titles off.

You’re going to add this css to your child css file and it should fix the issue:

.woocommerce ul.products li.product h3, .woocommerce-page ul.products li.product h3, .product-name > a, .product_list_widget li a {
    line-height: 1.3em;
    overflow: visible;
    text-overflow: inherit;
    display: block;
    white-space: normal;
}