Wrapping a DIV around the login form

[Seegon]

I need to aquire the skill to wrap different hp-elements in a custom Div, but cannot seem to figure out how.

with this as my starting point:

add_filter(
	'hivepress/v1/blocks/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,
					],
				],
			]
		);
	}
);

I’ve tryed different hooks, without success, like this one:

add_filter(
	'hivepress/v1/blocks/user_login_form',
	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 it doesn’t work, going through the folder structure confuses me a bit. I find the login_form several places. Like includes/blocks/class-user-login-form.php and includes/templates/class-user-login-page.php

also, theres the /forms/user_login hook.

May I get some assistance sorting this out? Thank you

[yevhen]

Please try this PHP snippet. It wraps the user login form on the login page in the div tag. In a similar way, it is possible to add a wrapper for other elements. Also, you can check our Developer Docs to find more information Getting started - Developer Docs

add_filter(
	'hivepress/v1/templates/user_login_page',
	function ($template) {
		hivepress()->template->fetch_block( $template, 'user_login_form' );
		
		return hivepress()->template->merge_blocks(
			$template,
			[
				'page_content' => [
					'blocks' => [
						'form_wrapper_custom' => [
							'type' => 'container',
							'_order' => 10,
							
							'attributes' => [
								'class' => ['custom_form_wrapper'],
							],
							
							'blocks' => [
								'user_login_form' => [
									'type'   => 'user_login_form',
									'_order' => 10,
								],
							],
						],
					],
				],
			]
		);
	}
);

[Seegon]

I’m sorry, but this doesn’t seem to work.

I understand there are several “login froms” in hivepress. The one you are refering to is the login-form-page template that can be edited in hivepress/templates.

Also there is the form that can be inserted with the gutenberg block-editor, or with a shortcode. Then, finally, we have the login form in the modal.

If possible, I’d like them all to be affected - or do I have to use three different hooks for this?

[ihor]

You can try using the hivepress/v1/forms/user_login filter instead, then prepend the opening DIV to the “header” form parameter (it accepts plain HTML) and appending the closing one to the “footer” parameter. This way this form will be wrapped no matter where it appears.

[Seegon]

I’m not sure exactly what you mean.

I am trying it this way, but this just returns the string “array” in the header and footer section, removing the social login links and register now link.

Also, this puts the content (if it would work) within the <form> element, not outside/around it.

Here is my take at it

add_filter(
	'hivepress/v1/forms/user_login',
	function ($form) {
		return hivepress()->helper->merge_arrays(
			$form,
			[
				'header' => [
					'before' => [
						'type'    => 'content',
						'content' => '<div class="my-custom-wrapper">',
						'_order'  => 1,
					],
				],
				'apend' => [
					'after' => [
						'type'    => 'content',
						'content' => '</div>',
						'_order'  => 1000,
					],
				],
			]
		);
	}
);

[ihor]

Sorry for the confusion, I tested this approach and remembered that the form header and footer areas are wrapped with their own separate DIVs:

add_filter(
	'hivepress/v1/forms/user_login',
	function ( $form ) {
		$form['header'] = '<div class="my-custom-wrapper">' . hivepress()->helper->get_array_value( $form, 'header' );
		$form['footer'] = hivepress()->helper->get_array_value( $form, 'footer' ) . '</div>';

		return $form;
	}
);

So the solution suggested by Yevhen is the correct one, currently there are only 2 templates (user_login_page and site_footer_block) where the login form is used and the only way is filtering these 2 templates, adding content blocks before and after the form.