[Support request] GP 1.4 Page Headers – Categories

[David]

Hi Tom, loving the headers, thought it better to raise a support ticket as opposed to FB community.

Using the new headers on category pages including the Title Tag. When you view the category page it doesn’t show the Category Title. Instead it shows the tile of the first post/product in the loop. This applies to post and woo product categories. What gives?

It would be really awesome if woo product categories (and normal categories) could pull in the thumbnail attachment as the local header image in the absence of a featured image. With a fix for the above it means one category header could be applied to all categories!

I used the following snippet so as Woo Categories shows the thumbnail image – however it wraps it in a woocommerce-products-header class so it doesn’t get grabbed by the Page Header, could this be adapted to make the above happen?

add_action( 'woocommerce_archive_description', 'woocommerce_category_image', 2 );
function woocommerce_category_image() {
    if ( is_product_category() ){
	    global $wp_query;
	    $cat = $wp_query->get_queried_object();
	    $thumbnail_id = get_woocommerce_term_meta( $cat->term_id, 'thumbnail_id', true );
	    $image = wp_get_attachment_url( $thumbnail_id );
	    if ( $image ) {
		    echo '<img src="' . $image . '" alt="' . $cat->name . '" />';
		}
	}
}

Thanks – keep up the good work, it kept me up to 4am this morning. Trouble and strife wasn’t happy…..

[Tom]

Hi David – thanks so much for the feedback.

Right now the {{post_title}} tag is only meant for singular pages/posts. Since Page Headers can’t be applied to ALL categories or tags, I didn’t see the point in giving them global tags like this. However, it should be possible and I’ll definitely take a look at that today.

Not sure what you mean about the thumbnails? In order to display an image specific to the category or tag, that taxonomy would need to have an image attached to it specifically. This would typically require another field while editing/adding the taxonomy.

[David]

Hi Tom, thanks for the update.
My idea for categories (particularly woo products) was to use a ‘master’ header and apply this to each category – and for it to pull in the title (now understand why that doesn’t work) of the category and along with an image background that was contained/related to the category.

Whereas post categories you can only add media (no thumbnail or featured image), woo does at leasts have a thumbnail that can be displayed as a woo header with the code above but this appears below your headers.

using the add media function in categories, is it possible to ‘tag’ an image so your headers will use this image for categories?

Really love this and sorry to throw a curve ball within 24hrs of release…..

[Tom]

No need to be sorry – this is the exact kind of feedback I’m looking for.

Just made it so {{post_title}} will bring in the taxonomy title if used on a taxonomy.

The image part is much harder – I could of course check to see if a WC thumbnail is set, but that would mean specifically checking a custom field. Right now, the add-on will work the same for any CPT, no additional code needed. When you start checking things based on specific CPTs etc.. it starts to get a little more cluttered/complicated. I’ll see if there’s a way for me to do it with minimal coding 🙂

[David]

Damn that was quick! Will that be in another alpha roll out?

Maybe ill cast my noob coder eyeballs over the code so i can understand how this featured image works and whats the difference with woo/post_thumbnails. I found a lot of snippets that allow you to add Categories to your images and then posts can pull in the top category image as the featured image if the post doesn’t have one…. thought it would be easy enough to classify an image as the featured image… but seeing as i dont know (yet) how it works thats beyond me.

[Tom]

It will be in alpha.2 🙂

[David]

Thanks Tom looking forward to alpha.2
On a another note – header and category related. How would i go about changing the header background colour with CSS? I use product categories to set the background colour of my shop products (transparent png) and want to apply this to the header also. Just cant seem to see what class i need to attack.

regards

David

[David]

OK well i found a few of them.
page-header-content generate-page-header generate-content-header

They all work but is there one in particular i should (or should not) use for styling?

[Tom]

.page-header-content is probably the best selector to use 🙂

[David]

Thanks Tom, i cant say enough how awesome this global header function is. The value its added to my shop pages is unbelievable.
It helped me realise my original design. Shop headers now have a full page product image, with product title and short description (custom shortcode to pull post excerpt – might be worth thinking of adding this to your template tags) and now custom color backgrounds based upon category.

FYI I used the original code from this thread which adds the woo category to the page body for styling according to product.

[Tom]

Awesome to hear!

Yea, I’d like to add some template tags for the excerpt/category descriptions etc..

[Author]

Posts