Show vendor images instead of listing images

[condorito.fr]

Hello,

I am currently having the licence for TaskHive theme.
However, I found that adding an image to the task is a pain, and adds a lot of friction (vendor needs to create the image) :

I saw that the ExpertHive theme handles the problem differently :

Basically, the image is replaced by the vendor’s picture , which is brilliant.

Is there a way to do this easily with taskhive, or do I need to ask for a refund and change theme (I bought it less than a month ago ) ?

Cheers.

[andrii]

Hi,

Please use this PHP snippet:

add_filter(
	'hivepress/v1/templates/listing_view_block/blocks',
	function( $blocks, $template ) {
		return hivepress()->helper->merge_trees(
			[ 'blocks' => $blocks ],
			[
				'blocks' => [
					'listing_image' => [
						'path' => 'vendor/view/block/vendor-image',
					],
				],
			]
		)['blocks'];
	},
	1000,
	2
);

Please note that it can require further customization.

​I hope this is helpful to you.

[condorito.fr]

Hello @andrii,

First, thank you for your quick response.
Here’s the output from your code snippet :

Definitely requires some customization indeed.

I am not asking for something new : it’s already implemented in Experthive theme.
I want the same output as on this theme.

Something pro-looking , not clunky.

I have been trying to investigate and fumble the taskhive theme files (templates), but could not get any satisfactory result.
As you know, I am trying to be helpful, and share my findings on the forum whenever I can.

But this half-baked “solution” is not enough.

Let’s try harder.

[condorito.fr]

Here is what I managed to achieve so far (today). Getting close.

So basically removed the image alltogether with this code snippet (based on what you sent me, and some research on this forum) :

add_filter(
	'hivepress/v1/templates/listing_view_block/blocks',
	function( $blocks, $template ) {		
		return hivepress()->helper->merge_trees(
			[ 'blocks' => $blocks ],
			[
				'blocks' => [
					'listing_image' => [
						/*'path' => 'vendor/view/block/vendor-image',*/
						'type' => 'content',					
					],
				],
			]
		)['blocks'];
	},
	1000,
	2
);

Initially I was just hiding the listing image with CSS, but it seems they get loaded by the browser anyway, so I went the extra mile with this PHP snippet instead.

To display the listings in rows, rather than in grid, I had to tweak this file :

/*\wp-content\plugins\hivepress\includes\blocks\class-listings.php */
--> line 310
	//OCO 
	//$output .= '<div class="hp-grid__item hp-col-sm-' . esc_attr( $column_width ) . ' hp-col-xs-12">';
	$output .= '<div class="hp-grid__item hp-col-sm-12 hp-col-xs-12">';

--> line 337 : 
	//OCO
	//$output .= '<div class="hp-grid__item hp-col-sm-' . esc_attr( $column_width ) . ' hp-col-xs-12">';
	$output .= '<div class="hp-grid__item hp-col-sm-12 hp-col-xs-12">';

to change the bootstrap class. It’s not a proper way of coding, since next update from this plugin should override my tweak. So if any one knows of a better solution , please share. I could have probably altered these classes with jQuery too, mind you.

I am still interested in having the original code for the expert hive listings layout page. It definitely looks better than my own little hacks. At least give me some useful hints. Have mercy on me !

Cheers !

[ihor]

Hi,

If you’re still within a 30-day window, we can offer to swap TaskHive with ExpertHive in this case, ExpertHive includes the same extensions so there would be the same functionality. Please let me know if this works for you.

While we really appreciate your engagement on the forum, unfortunately we can’t help with customizing the theme beyond the available design and functional features, the support scope we offer with every license includes fixing bugs and general guidance, although if there are simple code snippets or workarounds we always happy to help. This is not the case because there’s no simple code snippet to re-design listings in TaskHive, it’s easy to replace the image with the vendor one but further styling changes to switch the listings layout to horizontal one like in ExpertHive requires further PHP/CSS customizations, and an easier way in this case is to switch the theme if its design matches your project requirements better.

Hope this helps

[condorito.fr]

Thank you for your answer @ihor, I appreciate.

I 'd still prefer the overall design of the TaskHive theme over ExpertHive’s, and I started tweaking Taskhive via a child theme already.

What are the main differences between those two, beyond the listings page layout I mentioned (and really prefer) ?

Can’t you just send me the few different php files at stake for the listings layout on my email address (myhivepresslogin[AT]gmail[DOT]com), and I will try to study and work it out by myself ?

Cheers !

[ihor]

Sorry, there’s no simple snippet for this, and no specific PHP file - there are mostly CSS customizations which would require in-depth guidance. I highly recommend switching the theme if this list view layout is required, or if you want to customize it in TaskHive then I recommend checking listings with highlight tool in the browser on ExpertHive demo. The first step is to add flex-direction:row for the listing block .hp-listing--view-block The layout will become horizontal and then depending on what elements still fit (or don’t) specific CSS tweaks are needed (e.g. to make the font smaller, or to change the direction of displayed attributes).

There’s no difference between TaskHive and ExpertHive in terms of functionality, both include Marketplace, Requests, and Tags. ExpertHive has a bit different listing design (list view instead of grid view), and shows vendor images instead of listing ones. Also, ExpertHive includes a helper HivePress Blocks extension which provides 2 blocks for the editor (Testimonials and Recent Posts), which you can see on the ExpertHive demo’s home page.

Hope this helps

[condorito.fr]

Thank you @ihor for your insights !

I played around with CSS, positioning… it’s messy / overly complicated, at least for me. I give up.
The solution I found and detailed above is good enough for the time being.