I want to make forms customization to look similar like front end of forms

[haseebdeveloper37]

Hi community / developer i need help

i have a website on which i have installed ExpertHive theme now i have customize listing submission form by using a hook which is this one

add_filter(
	'hivepress/v1/forms/listing_submit',
	function( $form ) {
		
		$form['fields']['categories']['description'] = 'Select your service category';
		$form['fields']['title']['description'] = 'Enter concise description of your service eg Electrical Fittings';
		$form['fields']['title']['placeholder'] = '';
		$form['fields']['price']['label'] = 'HOURLY RATE (OPTIONAL)';
		$form['fields']['price']['_order'] = 31;
		$form['fields']['location']['description'] = 'Operational head office or main City/Suberb Served eg Accra';
		$form['fields']['location']['placeholder'] = '';
		//$form['fields']['other_cities']['description'] = 'List other cities and suburbs served.';
		//$form['fields']['other_cities']['placeholder'] = '';
		//$form['fields']['warranty']['description'] = 'Enter warranty and duration';
		//$form['fields']['warranty']['placeholder'] = '';
// 		unset( $form['fields']['other_cities'] );
		$form['fields']['description']['description'] = 'Enter full description of your business and service';
		$form['fields']['description']['_order'] = 30;
		$form['fields']['description']['placeholder'] = '';
		$form['fields']['tags']['_order'] = 30;
		$form['fields']['association_accreditation']['_order'] = 250;
		$form['fields']['awards']['_order'] = 250;
		$form['fields']['other_cities']['_order'] = 100;
// 				$form['fields']['other_city'] = [
// 			'label' => 'Other cities/suburbs served',
// 			'placeholder' => '',
// 			'description' => 'List other cities and suburbs served.',
// 			'type' => 'textarea',
// 			'_order' => 100,
// 			'class' => 'hp-field--textarea',
// 		];
		
// 		$form['fields']['association-accrediatation'] = [
// 			'label' => 'PROFESSIONAL ASSOCIATION / ACCREDITATION',
// 			'type' => 'textarea',
// 			'_order' => 250,
// 		];
		
// 		$form['fields']['awards'] = [
// 			'label' => 'AWARDS',
// 			'type' => 'textarea',
// 			'_order' => 250,
// 		];
		
			return $form;
	},
	1000
);

now it is affecting the front end view of form and its perfect but i want also the same styled form or customized form in the backend as well means when go to listings and add new listing how can i do this please tell me i have also attached images

Thank You

[haseebdeveloper37]

this is the backend form

[haseebdeveloper37]

this one is the front end view of that form

[ihor]

I’m sorry for the delay.

Please try using this hook in addition to the form hooks Filter: hivepress/v1/meta_boxes/{meta_box_name} | HivePress Hook Reference
For example, you can customize the listing attribute fields via the hivepress/v1/meta_boxes/listing_attributes hook.

Hope this helps.

P.S. Please consider applying to our Experts program once you get familiar with the HivePress framework Customization | HivePress

[haseebdeveloper37]

ok so for example here is my code

add_filter(
    'hivepress/v1/meta_boxes/listing_attributes',
    function( $meta_box ) {
		$meta_box['fields']['hp_price']['_order'] = 31;

        return $meta_box;
    }
);

i have inspect the hourly rate field in the backend listing edit form and get the name attribute value hp_price is this correct i am doing and it is giving an error can you please tell me what needs to do or how can in check properties that i can change or put styling on the fields please see attached

[haseebdeveloper37]

[haseebdeveloper37]

I also want to vertically align the fields instead of horizontal means label then description then text box please make an example

[ihor]

Please try the same code snippet, but without the “hp_” prefix, it’s already added by HivePress automatically. You can always check the contents of $meta_box with var_dump to see the available fields and their keys.

Styling the fields vertically requires CSS customizations, this is not specific to the HivePress framework, please try to inspect fields via the browser dev tools and add custom CSS snippets to change the elements styling, layout etc.

[haseebdeveloper37]

Hi @ihor now i have another issue i want to discuss that is i want to reorder attributes or fields data on the single listing page here is my code that i have used

add_filter(
	'hivepress/v1/models/listing/fields',
	function( $fields, $model ) {
		if ( $fields ) {
			$fields['price']['label'] = 'Hourly Rate';
			$fields['price']['display_template'] = '%label%</br>%value% / hour';
			$fields['tags']['display_template'] = '%label%</br>%value%';
			$fields['tags']['_display_areas'] = 'view_page_primary';
			$fields['categories']['display_template'] = '%label%</br>%value%';
			$fields['categories']['_display_areas'] = 'view_page_primary';
			$fields['location']['display_template'] = '%label%</br>%value%';
			$fields['location']['_display_areas'] = 'view_page_primary';
			$fields['opening_hours']['display_template'] = '%label%</br>%value%';
			$fields['opening_hours']['_display_areas'][1] = 'view_page_primary';
		}
		
// 		echo '<pre>'; var_dump($fields); echo '</pre>';
		return $fields;
	},
	1000,
	2
);

and here is the code that i have to sort the attributes fields in the backend listing form

add_filter(
	'hivepress/v1/models/listing/attributes',
	function( $fields ) {
// 		if ( isset( $fields['price'] ) ) {
// 			$fields['price']['label'] = 'Hourly Rate';
// 			$fields['price']['_order'] = 50;
// 			$fields['price']['display_template'] = '%label%</br>%value% / hour';
// 		}
		$fields['price']['edit_field']['_order'] = 35;
		$fields['tags']['edit_field']['_order'] = 30;
		$fields['location']['edit_field']['_order'] = 40;
// 		echo '<pre>'; var_dump($fields); echo '</pre>';
		return $fields;
	},
	1000
);

and i have attached single listing page front end screenshot

please tell me what i need to do to sort fields on the front end and one more issue is that i also attached code for opening_hours to display on view_page_primary in the code above but it is not displaying the opening hours can you please tell me why

looking to hear from you

Thank You

[haseebdeveloper37]

and even if i added this code $fields[‘price’][‘_order’] = 0; in the add_filter(
'hivepress/v1/models/listing/fields but it is still not order the hourly rate field to the top of the fields

[haseebdeveloper37]

also i am building single listing page in the backend as well in the hivepress listing template

[ihor]

1. Please use the hivepress/v1/forms/listing_update hook to re-order fields inside the listing edit form. For re-ordering attributes, I recommend using the hivepress/v1/models/listing/attributes hook instead of the models one. Moving template parts like categories and opening hours is a bit more tricky since they are not added as attributes, there are template parts so you can use the template hooks instead, but they will not work if you override the template via HivePress/Templates because then the content you add to the editor has a higher priority, in this case please order blocks in the editor.

2. If some blocks can’t be loaded please send more details (which one, steps to reproduce, etc.) and I’ll look into it.

[haseebdeveloper37]

Hi @ihor I was used this code in order to sort field on the front end but it is not moving the opening hours on the front end listing single page my whole purpose if to reorder the fields on the front end on single listing how can i do this by making custom template as well for the single listing page

// add_filter(
// 	'hivepress/v1/forms/listing_update',
// 	function( $form ) {
// 		if ( isset( $form['fields']['opening_hours'] ) ) {
// 			$form['fields']['opening_hours']['_order'] = 100;
// 		}

// 		return $form;
// 	},
// 	);

and is this possible or not

[haseebdeveloper37]

and now one more thing i have created single request page template in the hivepress template and when i go to the single request page on the frontend it is not showing budget budget label as it is an attribute of the request

what i do to show its label also

[ihor]

1. If you mean moving the Opening Hours displayed in the listing sidebar then another hook is required since it’s a template and not a form with fields. Please try using the hivepress/v1/templates/listing_view_page hook instead to move the template blocks, you can check some examples in our code snippet collection.

2. Yes, Budget is a built-in field added by the Marketplace extension, even if you add a custom attribute it will not override the built-in field, a custom code snippet is required for this.