I'm working on translating my Typo3 page.
Now I've come to my contact form which I want to translate. From the Typo3 Documentation I've found that I need something like this:
contact.element.subject.properties.fluidAdditionalAttributes.placeholder
...as the translation ID inside my locallang.xlf file. I've linked my CustomFormSettings.yaml via TypoeScript, in there set the translation path to my extension and created a contact form.
I was actually able to translate the submit button for example and other buttons. But I can't get the placeholder inside my contact form to get translated, they all fallback to the value set in the contact form not the translation.
I'm guessing I'm handling the fluidAdditionalAttributes property wrong but I've tested lots of other combinations then the above.
What is the exact line I have to type inside my translation ID?
Here is my complete contact form:
renderingOptions:
submitButtonLabel: Submit
identifier: contact
label: Contact
type: Form
prototypeName: frameform
finishers:
-
options:
subject: 'Your message: {subject}'
recipientAddress: mail#mail.com
recipientName: 'Recipient Name'
senderAddress: '{email}'
senderName: '{name}'
replyToAddress: ''
carbonCopyAddress: ''
blindCarbonCopyAddress: ''
format: html
attachUploads: true
translation:
language: ''
identifier: EmailToReceiver
-
options:
subject: 'We have received: {subject}'
recipientAddress: '{email}'
recipientName: '{name}'
senderAddress: mail#mail.com
senderName: 'Sender Name'
replyToAddress: ''
carbonCopyAddress: ''
blindCarbonCopyAddress: ''
format: html
attachUploads: true
identifier: EmailToSender
-
options:
pageUid: '7'
additionalParameters: ''
identifier: Redirect
renderables:
-
renderingOptions:
previousButtonLabel: 'Previous step'
nextButtonLabel: 'Next step'
identifier: mainPage
type: Page
renderables:
-
defaultValue: ''
identifier: name
label: Name
type: Text
properties:
fluidAdditionalAttributes:
placeholder: Name
required: required
validators:
-
identifier: NotEmpty
-
defaultValue: ''
identifier: subject
label: Subject
type: Text
properties:
fluidAdditionalAttributes:
placeholder: Subject
required: required
validators:
-
identifier: NotEmpty
-
defaultValue: ''
identifier: email
label: Email
type: Text
properties:
fluidAdditionalAttributes:
placeholder: 'Email address'
required: required
validators:
-
identifier: NotEmpty
-
identifier: EmailAddress
-
defaultValue: ''
identifier: message
label: Message
type: Textarea
properties:
fluidAdditionalAttributes:
placeholder: Message
required: required
minlength: '10'
maxlength: '512'
validators:
-
identifier: NotEmpty
-
options:
minimum: '10'
maximum: '512'
identifier: StringLength
-
renderingOptions:
previousButtonLabel: 'Previous step'
nextButtonLabel: 'Next step'
identifier: summarypage
label: 'Summary page'
type: SummaryPage
You can override your placeholders in a locallang.xlf like this: element.<field-identifier>.properties.placeholder
example:
<trans-unit id="element.firstname.properties.placeholder">
<source>Your first name</source>
<target>Ihr Vorname</target>
</trans-unit>
Related
I am trying to remove an input field from the generated email. With Powermail it is relatively easy. There I can exclude fields in the typoscript. How could something like this look with cms-forms?
Example powermail
excludeFromPowermailAllMarker {
# On Confirmation Page (if activated)
confirmationPage {
# add some markernames (commaseparated) which should be excluded
excludeFromMarkerNames = datenschutzbestimmungen, agb
}
}
TYPO3 11.5.12
php 8.1.2
This is possible with the form variants introduced in TYPO3 version 9.
Hide a form element in certain finishers and on the summary step:
type: Form
identifier: test
prototypeName: standard
label: Test
finishers:
-
identifier: EmailToReceiver
options:
subject: Testmail
recipientAddress: tritum#example.org
recipientName: 'Test'
senderAddress: tritum#example.org
senderName: tritum#example.org
renderables:
-
type: Page
identifier: page-1
label: 'Page 1'
renderables:
-
type: Text
identifier: text-1
label: 'Text 1'
variants:
-
identifier: hide-1
renderingOptions:
enabled: false
condition: 'stepType == "SummaryPage" || finisherIdentifier in ["EmailToSender", "EmailToReceiver"]'
-
type: Text
identifier: text-2
label: 'Text 2'
-
type: SummaryPage
identifier: summarypage-1
label: 'Summary step'
The relevant part (which disables rendering of the field in the summary page, the email to sender finisher or the email to sender finisher) is
variants:
-
identifier: hide-1
renderingOptions:
enabled: false
condition: 'stepType == "SummaryPage" || finisherIdentifier in ["EmailToSender", "EmailToReceiver"]'
I have a 10.4.18 installation, on another project that works fine (which i copy to the current). In my current project they render the submit button like this:
<span class="btn-group next submit">
Absenden
</span>
There is no button and not clickable, anyone have an idea? There are no template overrides or custom configuration, form is added in template (without I get an exception) so that works.
The yaml configuration:
renderingOptions:
submitButtonLabel: Absenden
identifier: kontakt
label: Kontakt
type: Form
prototypeName: standard
finishers:
-
options:
subject: 'Kontakt über Website'
recipients:
test#test.de: 'Test Webmailer'
senderAddress: '{email}'
senderName: '{vorname}'
attachUploads: true
translation:
language: default
useFluidEmail: true
title: 'Confirmation of your message'
addHtmlPart: true
identifier: EmailToReceiver
renderables:
-
renderingOptions:
previousButtonLabel: ''
nextButtonLabel: ''
identifier: page-1
label: Kontakt
type: Page
renderables:
-
properties:
options:
Anfrage: Anfrage
Lob: Lob
Kritik: Kritik
type: SingleSelect
identifier: singleselect-1
label: 'Ihr Anliegen'
defaultValue: Anfrage
-
defaultValue: ''
identifier: vorname
label: 'Ihr Name'
type: Text
properties:
fluidAdditionalAttributes: { }
elementDescription: ''
-
defaultValue: ''
identifier: email
label: 'Ihre E-Mail-Adresse'
type: Text
properties:
fluidAdditionalAttributes:
required: required
validators:
-
identifier: NotEmpty
-
identifier: EmailAddress
-
defaultValue: ''
identifier: nachricht
label: 'Ihre Nachricht'
type: Textarea
properties:
fluidAdditionalAttributes:
required: required
elementDescription: ''
validators:
-
identifier: NotEmpty
-
properties:
pageUid: '13'
linkText: 'Datenschutzerklärung anzeigen'
fluidAdditionalAttributes:
required: required
type: LinkedCheckbox
identifier: linkedcheckbox-1
label: 'Ja, ich habe die Datenschutzerklärung zur Kenntnis genommen.'
validators:
-
identifier: NotEmpty
I have created custom finisher to call API and send data to the server. Here is the code for this.
Typoscript:
plugin.tx_form.settings.yamlConfigurations {
200 = EXT:ApiCall/Configuration/Yaml/BaseSetup.yaml
300 = EXT:ApiCall/Configuration/Yaml/FormEngineSetup.yaml
}
module.tx_form.settings.yamlConfigurations {
200 = EXT:ApiCall/Configuration/Yaml/BaseSetup.yaml
300 = EXT:ApiCall/Configuration/Yaml/FormEditorSetup.yaml
400 = EXT:ApiCall/Configuration/Yaml/FormEngineSetup.yaml
}
BaseSetup.yaml
TYPO3:
CMS:
Form:
prototypes:
standard:
finishersDefinition:
ApiCall:
implementationClassName:
'Vendor\ApiCall\Domain\Finishers\ApiCallFinisher'
FormEditorSetup.yaml
TYPO3:
CMS:
Form:
########### FORMEDITOR CONFIGURATION ###########
prototypes:
standard:
########### DEFAULT FORM ELEMENT DEFINITIONS ###########
formElementsDefinition:
Form:
formEditor:
editors:
900:
selectOptions:
60:
value: 'ApiCall'
label: 'ApiCall'
propertyCollections:
finishers:
90:
identifier: 'ApiCall'
editors:
__inheritances:
10: 'TYPO3.CMS.Form.mixins.formElementMixins.BaseCollectionEditorsMixin'
100:
label: "ApiCall"
110:
identifier: 'url'
templateName: 'Inspector-TextEditor'
label: 'url'
propertyPath: 'options.url'
propertyValidators:
10: 'NotEmpty'
### FORM ELEMENTS: INPUT ###
Text:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
Password:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
AdvancedPassword:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
Hidden:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
Textarea:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
### FORM ELEMENTS: SELECT ###
Checkbox:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
MultiCheckbox:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
MultiSelect:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
RadioButton:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
SingleSelect:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
### FORM ELEMENTS: CUSTOM ###
DatePicker:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
### FORM ELEMENTS: UPLOADS ###
FileUpload:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
ImageUpload:
formEditor:
editors:
1000:
identifier: 'ApiCallname'
templateName: 'Inspector-TextEditor'
label: 'ApiCall field name'
propertyPath: 'properties.ApiCallname'
### FINISHERS ###
finishersDefinition:
ApiCall:
formEditor:
iconIdentifier: 't3-form-icon-finisher'
label: 'A Label that seems to be never used...'
predefinedDefaults:
options:
url: ''
FormEngineSetup.yaml
TYPO3:
CMS:
Form:
prototypes:
standard:
finishersDefinition:
ApiCall:
FormEngine:
label: "When is this label used? And for what?"
elements:
# hier nochmal alle Felder
# ich habe keine Ahnung wofür diese sind aber ohne geht es nicht
# spontan würde ich behaupten das es tca configuration ist
# aber ich definiere keine Datenbank Felder ~ vielleicht ist das aber eine Option
url: {label: url, config: {type: input}}
Set finisher.
renderingOptions:
submitButtonLabel: send
type: Form
identifier: contactform
label: 'Drop us a line and we''ll get back to you ASAP! Yes, we''re fast!'
prototypeName: standard
finishers:
-
options:
subject: 'New Inquiry'
recipientAddress: example#gmail.com
recipientName: 'Admin'
senderAddress: '{email-1}'
senderName: ' {text-1}'
replyToAddress: '{email-1}'
carbonCopyAddress: ''
blindCarbonCopyAddress: ''
format: html
attachUploads: true
identifier: EmailToReceiver
-
options:
subject: 'Inquiry - sender'
recipientAddress: '{email-1}'
recipientName: '{text-1}'
senderAddress: test#gmail.com
senderName: 'Admin'
replyToAddress: test#gmail.com
carbonCopyAddress: ''
blindCarbonCopyAddress: ''
format: html
attachUploads: true
identifier: EmailToSender
-
options:
pageUid: '21'
additionalParameters: ''
identifier: Redirect
-
options:
url: 'https://api.example.com/setdata'
identifier: ApiCall
In my finisher file, I tried to debug form data, but this not working. here is my finisher file code
<?php
namespace Vendor\ApiCall\Domain\Finishers;
use TYPO3\CMS\Extbase\Utility\DebuggerUtility;
use TYPO3\CMS\Form\Domain\Finishers\AbstractFinisher;
class ApiCallFinisher extends AbstractFinisher
{
protected function executeInternal()
{
DebuggerUtility::var_dump($this);
$values = $this->finisherContext->getFormValues();
DebuggerUtility::var_dump($values);die;
}
}
both debug not showing, a form is being submitted. Can anyone tell me what's wrong?
Thanks an advance!
Your finisher must be moved before the redirect finisher.
After the redirect finisher is called, your code is being stopped to perform the redirect. ✌️
I'm using the Typo3 form-module (sysext) with two email-finishers: EmailToReceiver vs. EmailToSender. I set up a custom mailtemplate, but
HOW can I select different mailtemplates for this two different mails?
OR is there another way to send two different mails?
In addition to Mathias Brodala's correct answer, you can also use templateName and templateRootPaths inside each email finisher. It will respect the email format you set with options.format if configured like below:
finishers:
-
identifier: EmailToReceiver
options:
subject: 'E-Mail from website'
recipientAddress: your.company#example.com
recipientName: 'Your Company name'
senderAddress: '{email}'
senderName: '{lastname}'
replyToAddress: ''
carbonCopyAddress: ''
blindCarbonCopyAddress: ''
format: html
attachUploads: 'true'
templateName: '{#format}.html'
templateRootPaths:
20: 'EXT:your_extension/Resources/Private/Forms/Emails/Receiver/'
translation:
language: ''
-
identifier: EmailToSender
options:
subject: 'Your message'
recipientAddress: '{email}'
recipientName: '{lastname}'
senderAddress: your.company#example.com
senderName: 'Your Company name'
replyToAddress: ''
carbonCopyAddress: ''
blindCarbonCopyAddress: ''
format: html
attachUploads: 'true'
templateName: '{#format}.html'
templateRootPaths:
20: 'EXT:your_extension/Resources/Private/Forms/Emails/Sender/'
According to the file paths set above, the templates are then saved in
your_extension/Resources/Private/Forms/Emails/Sender/
Html.html or Plaintext.html
your_extension/Resources/Private/Forms/Emails/Receiver/
Html.html or Plaintext.html
The complete tutorial can be found here.
On GitHub is a working TYPO3 extension with several example forms, including a form with custom mail template only for the sender.
You can use the templatePathAndFilename finisher option to set a custom template for your mails. You can set this for each finisher separately:
finishers:
- identifier: EmailToReceiver
options:
# ...
templatePathAndFilename: EXT:my_site/Resources/Private/Templates/.../EmailToReceiver.html
- identifier: EmailToSender
options:
# ...
templatePathAndFilename: EXT:my_site/Resources/Private/Templates/.../EmailToSender.html
I have to validate a textbox in Neos form. I want to validate a number between 7 to 90.
Here is my code, but it is not working:
type: 'TYPO3.Form:SingleLineText'
identifier: liednummer
label: 'Die Nummer meines Lieblingsliedes'
validators:
- identifier: 'TYPO3.Flow:NotEmpty'
- identifier: 'TYPO3.Flow:NumberRange'
properties:
placeholder: 'Liednummer'
validation:
'TYPO3\Flow\Validation\Validator\NumberRangeValidator':
minimum: 7
maximum: 90
defaultValue: ''
What is wrong? Empty is working, but number and number range is not working.
Quite old question, so you have probably solved that problem, but maybe it will help someone else:
type: 'TYPO3.Form:SingleLineText'
identifier: liednummer
label: 'Die Nummer meines Lieblingsliedes'
validators:
-
identifier: 'TYPO3.Flow:NumberRange'
options:
minimum: '8'
maximum: '22'
-
identifier: 'TYPO3.Flow:NotEmpty'
properties:
placeholder: 10
defaultValue: ''