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

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

this is the backend form

this one is the front end view of that form

1 Like

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

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

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

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.

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

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

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

  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.