PIP

Could you throw up your link to where it’s happening and I can check on it?

Seems to be loading for me…

Add this css code to your child themes css file:

.main-navigation ul.menu, .main-navigation ul.nav-menu {
    text-align: center;
}

Did you install the Homepage Control plugin?

Not sure why the titles aren’t showing in that section, could you send a link to the example.

If you would like to remove them altogether, I would recommend a plugin called: Homepage Control

https://www.ads-software.com/plugins/homepage-control/

You can then go to your customizer in the admin and turn off or rearrange certain sections on the homepage.

Ok if you want to target the css you are going to have to change a couple things. First the php code, change to:

add_action( 'storefront_header', 'custom_text_next_to_logo', 25 );
function custom_text_next_to_logo() {
    echo '<span class="my-logo-text">This is my custom text</span>';
}

Now you can target the css class .my-logo-text

The easiest solution would be to add text to your logo…

Or you can add code like this to your child themes function file.

add_action( 'storefront_header', 'custom_text_next_to_logo', 25 );
function custom_text_next_to_logo() {
    echo 'This is my custom text';
}

Then you’ll have to position it correctly with css.

In your wp-admin, you can go into your customizer at Appearance > Customize

Then go to Header > Add a new image

Hey mcsean, there is a free plugin that you can use to do this called Homepage Control located here: https://www.ads-software.com/plugins/homepage-control/

You can also remove the actions via your child theme functions file like so:

/**
 * Remove some Storefront theme stuff
 */

add_action( 'init', 'sf_framework_remove_parent_theme_stuff', 0 );
function sf_framework_remove_parent_theme_stuff() {
	remove_action( 'homepage', 'storefront_featured_products', 40 );
	remove_action( 'homepage', 'storefront_popular_products', 50 );
	remove_action( 'homepage', 'storefront_on_sale_products', 60 );
	remove_action( 'homepage', 'storefront_best_selling_products', 70 );
}

You could try something like this in your css:

.handheld-navigation .menu {
    max-height: 300px;
    overflow: scroll;
}

When adding filters you don’t need to call the function later. The function is called at the point you add the filter.

The new return $value that you are filtering will show wherever that filter is being applied in WooCommerce.

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;
}

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.

No prob, awesome work!!

Actually try this:

Also things to consider: make sure you have updated to the newest version of Storefront and make sure this stuff is going in a child theme functions file…

add_action( 'init', 'sf_child_remove_parent_theme_stuff', 0 );
function sf_child_remove_parent_theme_stuff() {
	remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );
}