Listing detail on two rows

[em_de]

Hey there!

I’m trying to get the Listing detail page on two rows so that only the Image gallery would be on the left side and the attributes and description on the right side.

How can I do that?

Edit 1:
Just by looking and testing, I tried to add the hp-row class to the hp-page__content div in the browser directly. That made it halfway but now I know, I need to add that and wrap some div’s around to specify “blocks” via template.

I found this snippet, edited it but that wraps it around the whole page instead of the block:

add_filter(
	'hivepress/v1/templates/listing_view_page',
	function( $args ) {
		return hivepress()->helper->merge_arrays(
			$args,
			[
				'blocks' => [
					'before' => [
						'type'    => 'content',
						'content' => '<div class="my-custom-wrapper">',
						'_order'  => 1,
					],

					'after'  => [
						'type'    => 'content',
						'content' => '</div>',
						'_order'  => 1000,
					],
				],
			]
		);
	}
);

Besides that, how can I specify the attributes and description block to wrap it in one div by itself?

[andrii]

Hi,

You can do this by overwriting the template parts using a child theme, please check this doc Customizing Templates I HivePress Developer Docs - YouTube

[em_de]

That’s where I’m working on, but are there any files where the template parts are specified? For example the hp__page is getting the listing title, description, image ect. But where is it specified like that?

[ihor]

I recommend using CSS customizations where possible, e.g. in this case you can target any CSS class via the .hp-template--listing-view-page body class and customize the layout without affecting other pages. If you want to customize the CSS classes, add, remove or re-order blocks then custom PHP snippets for the template hooks are required, please check some samples here Search · user:hivepress hivepress/v1/templates · GitHub

Also, you can check template parts in hivepress/templates directory, you can override any of these by copying them to the child theme’s directory.