Gathering the Necessary Information
1. Required Information
- espar form account
- Form ID
- API key
- Embed code
- Form code
Creating an espar form account
2. Go to https://www.feedtailor.jp/product_espar-form/ to create an account
Obtaining the Form ID, API Key, Embed Code, and Form Code
3. Go to the espar form dashboard
4. Enter your login credentials
5. Log in
Configuring Basic Information
6. Set the “Form Name”
7. Copy the “Embed Code”
8. Copy the code for the “Sample Form”
Tip: Please save the copied content in a text editor or similar tool
Configuring Notification Emails
9. Set the sender, recipient, and subject line
10. Configure the email body
Important Notes
At this point, you must ensure that the labels in the email match the corresponding form fields.
For details, please refer to Email Templates | espar form DOCS.
11. Once you’re done, click the “Save Changes” button to save your settings
Autoresponder Settings
12. Set up an automatic reply email for the person who submitted the inquiry.
If you wish to use this feature, check the “Send an autoresponder” box and configure the following settings:
- From
- To
- Subject
- Email Body
13. Customize the email body.
14. Once you’ve finished configuring, click the “Save Changes” button to save your settings.
Advanced Settings
Allowed Sender Hosts
15. Set the hostname of the site where you’ll actually install the form. Please check this in the Shifter dashboard beforehand and make a note of it.
- The string ending in.on.getshifter.io shown in the overview (e.g., abc123.on.getshifter.io)
- Custom domain name (e.g., example.com, www.example.com)
- CloudFront URL (
def456.cloudfront.net)
Additionally, if you plan to perform a submission test while WordPress is running, please make a note of the WordPress hostname as well.
Example: ghi789.static.getshifter.io
16. Email the list of hostnames you noted in Step 15 to the development team and request that they be added.
That completes the settings in the espar form dashboard.
Launching WordPress and Inserting the Form
17. Log in to the Shifter dashboard
18. Launch WordPress
19. Add a new page under “Pages.”
20. Click Pages → “Add New Page”
21. Display the list of blocks.
22. Select “Custom HTML.”
23. Paste both the embedded code and the form code into the input field.
24. The form is now complete
25. Click the “Publish” button to publish the page
WordPress Test Email
26. Click “View Page” to display the page with the form
27. Fill in each field and click the [Submit] button
28. Submit the form
29. The email has been sent.
Check the Send History
30. Log in to the espar form dashboard and check the “Send History.”
If the submission status is “Success,” the inquiry email should have been delivered to the specified email address.
Create an artifact and deploy it
31. Click “Deploy”
32. Click “Stop WordPress.”
33. The deployment has been published.
34. Access the site’s URL.
Send a test email from the published site.
35. Enter the required information and click the [Confirm] button.
36. Click the Send button to send the email.
37. The email has been sent.
38. The email was delivered successfully.
39. That concludes the setup of the espar form, its configuration on the Shifter site, and the test email procedure.