Modify Form to show only after clicking a button

Resolved axelbatz
(@axelbatz)

2 years, 11 months ago

Hi, I’m working on a site that gets a lot of users, and some of them are already talking to an HR recruiter, so they shouldn’t be aplying to the openings from the website.

Is there a way to add two buttons to every job detail page, one that says something like “I’m already talking to a recruiter” and that button would link to another page, and “I want to apply” and that button would show the form? Or at least make the form show only after clicking a button.

Thanks.

Viewing 5 replies - 1 through 5 (of 5 total)

Plugin Contributor Nithin John
(@nithi22)

2 years, 11 months ago
Hi,

If you are familiar with JavaScript code customization, you can hide the default application form and toggle the form with JavaScript code. If you are not familiar with you can use a plugin such as Show-Hide / Collapse-Expand for your purpose.

First you need to add the below CSS to hide the form,
```
.awsm-job-form {
	display: none;
}
```
Then in the plugin mentioned above, under ‘Onclick JS function’ you can add the below code,

jQuery('.awsm-job-form').toggle();

In WP Job Openings PRO, the shortcode for the application form is supported. It can show the application form anywhere the shortcode is supported. It will be very useful with page builders such as Elementor to show the application form with button actions. Also, PRO supports replacing the existing form with a custom button, shortcode, or disabling it.

Regards
Nithin John
- This reply was modified 2 years, 11 months ago by Nithin John.
- This reply was modified 2 years, 11 months ago by Nithin John.
Thread Starter axelbatz
(@axelbatz)

2 years, 11 months ago

Hi Nithin, thanks for your answer.

It isn’t clear where should I add the code “jQuery(‘.awsm-job-form’).toggle();” for it to display a button that toggles the content. Can you please show me with images? Because in the Plugin description, the only way to show that “Onclick JS function” option is if you are in an editor.

Thanks in advance.

Plugin Contributor Nithin John
(@nithi22)

2 years, 11 months ago

Hi,

Please refer to the screenshot below.

Regards,
Nithin John
Thread Starter axelbatz
(@axelbatz)

2 years, 11 months ago
Hi Nithin, thanks for your response.

That screenshot shows an old version of the WordPress editor, when we edit or create a new Job Listing, with the new editor we can’t find where is the option to insert that shortcode.

Thanks again, I’ll be waiting for your answer.
- This reply was modified 2 years, 11 months ago by axelbatz.
Plugin Contributor Nithin John
(@nithi22)

2 years, 11 months ago

Hi,

Sorry for the delay in response.

In the block editor, you can use the classic block for adding the same.

or you can simply add the below shortcode

[bg_collapse view="button-orange" color="#4a4949" expand_text="Show More" collapse_text="Show Less" onclick="jQuery('.awsm-job-form').toggle();" ][/bg_collapse]

Regards,
Nithin John