WooCommerce without Storefont theme – remove or hide 'shop' title on shop page

Yes you can hide that in CSS, can’t seem to inspect element there, but set display as none for the title in your custom css to hide title.

You should be able to inspect element now, turned content protection off for a while. I have no idea what code I should type to hide the title in custom css.

Try adding the following on new line in custom css, maybe add comments so you don’t get confused with code.

/* hide title top */
h1 {
    display: none;
}

By adding that it will hide the title and logo on top ??

So maybe try this:

/* hide title top */
h1 {
    color: #FFFFFF;
}

which will essentially still have the title there but you won’t see it because it is white.

Thanks for your response! Your first suggestion does indeed hide the menu bar and logo, that measure is a little bit too drastic. Your second suggestion does unfortunately not make the word ‘shop’ white. Any other ideas?

I tried to add margins for spacing when using first option but can’t seem to get spacing right, think best is to contact theme developer to assist you with this.

I don’t know if its worth anything but I found out that removing ‘shop’ in the inspect elements line (Chrome) removes it from the shop page (https://imgur.com/SVTtI2z). Is it perhaps possible to replicate this action in Simple Custom CSS?

Thanks

You can also remove this in woocommerce-template.php page, look for
<h1 class="page-title">

and remove

echo apply_filters( 'the_title', ( $shop_page_title = get_option( 'woocommerce_shop_page_title' ) ) ? $shop_page_title : $shop_page->post_title );

You can also try adding a filter in the theme’s functions.php file:

add_filter('woocommerce_show_page_title',false);

I would actually advise adding filter than removing code in woocommerce-template.php file ??

That logo will disappear because it is also inside a <h1> tag.
Hiding all those h1-titles, will also hide that logo.

So you try only to hide that shop-title by using its class: page-title

Try this:

/* hide Page-title on Shop page */
h1.page-title {
    display: none;
}

But this may remove all that section, and the thumbnails will touch the upper menu;
so you can also try this:

h1.page-title {
    display: block;
    visibility: hidden;
    height: 1em;
}

You can use browser extensions to inspect which class or what poarameter you have to change, and change on the go and see the effects for yourself before making changes in the files…

ManusH, your last suggestion worked! Amazing what you guys can come up with, thanks so much.

Aaah great, thanks, that was bothering me the whole time now.