Personalized checkout and custom promotions with Shopify Scripts
Hello guys
I created a seperated page template for a partnership contact form on my website, the problem is that most of the custom fields is not shown when i receive the email notification from the submitted form (the fields is required)
How can i display ALL the fields in the email notification to check all the fields the customer filled?
Below is the custom code
{{ 'section-contact-form-partnership.css' | asset_url | stylesheet_tag }}
{%- style -%}
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top | times: 0.75 | round: 0 }}px;
padding-bottom: {{ section.settings.padding_bottom | times: 0.75 | round: 0 }}px;
}
@media screen and (min-width: 750px) {
.section-{{ section.id }}-padding {
padding-top: {{ section.settings.padding_top }}px;
padding-bottom: {{ section.settings.padding_bottom }}px;
}
}
{%- endstyle -%}
<div class="color-{{ section.settings.color_scheme }} gradient">
<div class="contact page-width page-width--narrow section-{{ section.id }}-padding">
{%- if section.settings.heading != blank -%}
<h2 class="title title-wrapper--no-top-margin {{ section.settings.heading_size }}">{{ section.settings.heading | escape }}</h2>
{%- else -%}
<h2 class="visually-hidden">{{ 'templates.contact.form.title' | t }}</h2>
{%- endif -%}
{%- form 'contact', id: 'ContactForm', class: 'isolate' -%}
{%- if form.posted_successfully? -%}
<h2 class="form-status form-status-list form__message" tabindex="-1" autofocus>{% render 'icon-success' %} {{ 'templates.contact.form.post_success' | t }}</h2>
{%- elsif form.errors -%}
<div class="form__message">
<h2 class="form-status caption-large text-body" role="alert" tabindex="-1" autofocus>{% render 'icon-error' %} {{ 'templates.contact.form.error_heading' | t }}</h2>
</div>
<ul class="form-status-list caption-large" role="list">
<li>
<a href="#ContactForm-email" class="link">
{{ form.errors.translated_fields['email'] | capitalize }} {{ form.errors.messages['email'] }}
</a>
</li>
</ul>
{%- endif -%}
<div class="fsSectionHeader">
<h2 class="fsSectionHeading" style="text-align:center;">Στοιχεία Επικοινωνίας</h2>
</div>
<div class="personal__fields">
<div class="field">
<input class="field__input" autocomplete="given-name" type="text" id="fname" name="fname[{{ 'templates.contact.form.name' | t }}]" value="{% if form.name %}{{ form.name }}{% elsif customer %}{{ customer.name }}{% endif %}" placeholder="{{ 'templates.contact.form.name' | t }}" required>
<label class="field__label" for="fname">Όνομα *</label>
</div>
<div class="field">
<input class="field__input" autocomplete="family-name" type="text" id="lname" name="lname[{{ 'templates.contact.form.name' | t }}]" value="{% if form.name %}{{ form.name }}{% elsif customer %}{{ customer.name }}{% endif %}" placeholder="{{ 'templates.contact.form.name' | t }}" required>
<label class="field__label" for="lname">Επίθετο *</label>
</div>
</div>
<div class="field">
<input class="field__input" autocomplete="organization-title" type="text" id="ContactForm-job-title" name="contact[job-title]" placeholder="Job Title" required>
<label class="field__label" for="ContactForm-job-title">Θέση Εργασίας *</label>
</div>
<div class="field field--with-error">
<input
autocomplete="email"
type="email"
id="ContactForm-email"
class="field__input"
name="contact[email]"
spellcheck="false"
autocapitalize="off"
value="{% if form.email %}{{ form.email }}{% elsif customer %}{{ customer.email }}{% endif %}"
aria-required="true"
{% if form.errors contains 'email' %}
aria-invalid="true"
aria-describedby="ContactForm-email-error"
{% endif %}
placeholder="{{ 'templates.contact.form.email' | t }}"
>
<label class="field__label" for="ContactForm-email">{{ 'templates.contact.form.email' | t }} <span aria-hidden="true">*</span></label>
{%- if form.errors contains 'email' -%}
<small class="contact__field-error" id="ContactForm-email-error">
<span class="visually-hidden">{{ 'accessibility.error' | t }}</span>
<span class="form__message">{% render 'icon-error' %}{{ form.errors.translated_fields['email'] | capitalize }} {{ form.errors.messages['email'] }}</span>
</small>
{%- endif -%}
</div>
<div class="field">
<input type="tel" id="ContactForm-phone" class="field__input" autocomplete="tel" name="contact[{{ 'templates.contact.form.phone' | t }}]" pattern="[0-9\-]*" value="{% if form.phone %}{{ form.phone }}{% elsif customer %}{{ customer.phone }}{% endif %}" placeholder="{{ 'templates.contact.form.phone' | t }}" required>
<label class="field__label" for="ContactForm-phone">Τηλέφωνο Επικοινωνίας *</label>
</div>
<div class="fsSectionHeader">
<h2 class="fsSectionHeading" style="text-align:center;">Στοιχεία Επιχείρησης</h2>
</div>
<div class="field">
<input class="field__input" autocomplete="organization" type="text" id="ContactForm-organization" name="contact[organization]" placeholder="Company Title" required>
<label class="field__label" for="ContactForm-organization">Τίτλος Επιχείρησης *</label>
</div>
<div class="field">
<input class="field__input" autocomplete="address-level2" type="text" id="ContactForm-address-level1" name="contact[address-level1]" placeholder="Address Level 1" required>
<label class="field__label" for="ContactForm-address-level1">Πόλη *</label>
</div>
<div class="field">
<input class="field__input" autocomplete="street-address" type="text" id="ContactForm-address-line" name="contact[street-address]" placeholder="Street Address" required>
<label class="field__label" for="ContactForm-address-line">Διεύθυνση *</label>
</div>
<div class="field">
<input class="field__input" autocomplete="postal-code" type="number" id="zip-code" name="zip" inputmode="numeric" pattern="[0-9]*" placeholder="Zip Code" required>
<label class="field__label" for="zip-code">Ταχυδρομικός Κώδικας *</label>
</div>
<div class="fields">
<div class="field">
<input class="field__input" autocomplete="url" type="url" id="url" name="url" placeholder="https://example.com" pattern="https://.*" size="50" minlength="10" maxlength="80">
<label class="field__label" for="url">Ιστότοπος Επιχείρησης</label>
</div>
<div class="field" required>
<textarea
rows="5"
id="ContactForm-body"
class="text-area field__input"
name="contact[{{ 'templates.contact.form.comment' | t }}]"
placeholder="{{ 'templates.contact.form.comment' | t }}"
>
{{- form.body -}}
</textarea>
<label class="form__label field__label" for="ContactForm-body">Περιγράψτε την κύρια δραστηριότητα της επιχείρησης σας *</label>
</div>
<div class="employee-radio">
<form>
<legend>Μέγεθος Επιχείρησης *</legend>
<div>
<input type="radio" id="1-4 εργαζόμενοι" name="drone" value="1-4"checked required>
<label for="1-4 εργαζόμενοι">1-4 εργαζόμενοι</label>
</div>
<div>
<input type="radio" id="5-9 εργαζόμενοι" name="drone" value="5-9">
<label for="5-9 εργαζόμενοι">5-9 εργαζόμενοι</label>
</div>
<div>
<input type="radio" id="10-14 εργαζόμενοι" name="drone" value="10-14">
<label for="10-14 εργαζόμενοι">10-14 εργαζόμενοι</label>
</div>
<div>
<input type="radio" id="14-19 εργαζόμενοι" name="drone" value="14-19">
<label for="14-19 εργαζόμενοι">14-19 εργαζόμενοι</label>
</div>
<div>
<input type="radio" id="20+ εργαζόμενοι" name="drone" value="20+">
<label for="20+ εργαζόμενοι">20+ εργαζόμενοι</label>
</div>
</form>
</div>
<div class="fsSectionHeader">
<h2 class="fsSectionHeading" style="text-align:center;">Μέσα Κοινωνικής Δικτύωσης</h2>
</div>
<div class="fb-followes-radio">
<form>
<legend>Τρέχων # Ακολούθων Στο Facebook *</legend>
<div>
<input type="radio" id="< 1.000" name="drone" value="< 1.000" checked required>
<label for="< 1.000">< 1.000</label>
</div>
<div>
<input type="radio" id="1.001 - 5.000" name="drone" value="1.001 - 5.000">
<label for="1.001 - 5.000">1.001 - 5.000</label>
</div>
<div>
<input type="radio" id="5.001 - 10.000" name="drone" value="5.001 - 10.000">
<label for="5.001 - 10.000">5.001 - 10.000</label>
</div>
<div>
<input type="radio" id="10.001 - 50.000" name="drone" value="10.001 - 50.000">
<label for="10.001 - 50.000">10.001 - 50.000</label>
</div>
<div>
<input type="radio" id="50.001 - 100.000" name="drone" value="50.001 - 100.000">
<label for="50.001 - 100.000">50.001 - 100.000</label>
</div>
<div>
<input type="radio" id="100.001 - 500.000" name="drone" value="100.001 - 500.000">
<label for="100.001 - 500.000">100.001 - 500.000</label>
</div>
<div>
<input type="radio" id="> 500.000" name="drone" value="> 500.000">
<label for="> 500.000"> 500.000</label>
</div>
<div>
<input type="radio" id="Μη ενεργή στο Facebook" name="drone" value="Μη ενεργή στο Facebook">
<label for="Μη ενεργή στο Facebook">Μη ενεργή στο Facebook</label>
</div>
</form>
</div>
<div class="field">
<input class="field__input" autocomplete="url" type="url" id="url" name="url" placeholder="https://example.com" pattern="https://.*" size="50" minlength="10" maxlength="80">
<label class="field__label" for="url">Σύνδεσμος στο προφίλ του Facebook</label>
</div>
<div class="instagram-followers-radio">
<form>
<legend>Τρέχων # Ακολούθων Στο Instagram *</legend>
<div>
<input type="radio" id="< 1.000" name="drone" value="< 1.000" checked required>
<label for="< 1.000">< 1.000</label>
</div>
<div>
<input type="radio" id="1.001 - 5.000" name="drone" value="1.001 - 5.000">
<label for="1.001 - 5.000">1.001 - 5.000</label>
</div>
<div>
<input type="radio" id="5.001 - 10.000" name="drone" value="5.001 - 10.000">
<label for="5.001 - 10.000">5.001 - 10.000</label>
</div>
<div>
<input type="radio" id="10.001 - 50.000" name="drone" value="10.001 - 50.000">
<label for="10.001 - 50.000">10.001 - 50.000</label>
</div>
<div>
<input type="radio" id="50.001 - 100.000" name="drone" value="50.001 - 100.000">
<label for="50.001 - 100.000">50.001 - 100.000</label>
</div>
<div>
<input type="radio" id="100.001 - 500.000" name="drone" value="100.001 - 500.000">
<label for="100.001 - 500.000">100.001 - 500.000</label>
</div>
<div>
<input type="radio" id="> 500.000" name="drone" value="> 500.000">
<label for="> 500.000"> 500.000</label>
</div>
<div>
<input type="radio" id="Μη ενεργή στο Instagram" name="drone" value="Μη ενεργή στο Instagram">
<label for="Μη ενεργή στο Instagram">Μη ενεργή στο Instagram</label>
</div>
</form>
</div>
<div class="field">
<input class="field__input" autocomplete="url" type="url" id="url" name="url" placeholder="https://example.com" pattern="https://.*" size="50" minlength="10" maxlength="80">
<label class="field__label" for="url">Σύνδεσμος στο προφίλ του Instagram</label>
</div>
<div class="fsSectionHeader">
<h2 class="fsSectionHeading" style="text-align:center;">Περισσότερες Πληροφορίες</h2>
</div>
<div class="field">
<div class="select">
<select class="field__input select select" name="contact[reason]" id="ContactForm-reason" style="font-size: inherit; padding-top: 0.8rem;" class="field__input select__select" required>
<option selected disabled required value>Επιλέξτε τομέα συνεργασίας *</option>
<option value="Χονδρική Πώληση B2B">Χονδρική Πώληση B2B</option>
<option value="Dropshipping">Dropshipping</option>
<option value="Brand Ambassador">Brand Ambassador</option>
</select>
<svg aria-hidden="true" focusable="false" viewBox="0 0 10 6" style="width: 20px; height: 10px; margin-top: 20px; margin-right: 10px;">
<use href="#icon-caret"></use>
</svg>
</div>
<label for="ContactForm-reason" style="visibility: hidden;" class="field__label">Επιλέξτε έναν από τους παρακάτω λόγους:</label>
</div>
<svg style="display: none">
<symbol id="icon-caret" viewBox="0 0 10 6">
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.354.646a.5.5 0 00-.708 0L5 4.293 1.354.646a.5.5 0 00-.708.708l4 4a.5.5 0 00.708 0l4-4a.5.5 0 000-.708z" fill=#4E4E4E>
</path>
</symbol>
</svg>
<div class="field" required>
<textarea
rows="10"
id="ContactForm-body"
class="text-area field__input"
name="contact[{{ 'templates.contact.form.comment' | t }}]"
placeholder="{{ 'templates.contact.form.comment' | t }}"
>
{{- form.body -}}
</textarea>
<label class="form__label field__label" for="ContactForm-body">Γράψτε μας το μήνυμα σας ή κάτι άλλο που θα θέλατε να μοιραστείτε *</label>
</div>
<div style="margin-bottom: 2rem; align-items: center; justify-content: center; text-align: center;">
<input type="checkbox" name="contact[terms and conditions]" value="agree" required>
<label for="terms and conditions" style="color: black;">Έχω διαβάσει και αποδέχομαι τους <a href="https://saketistore.com.gr/policies/terms-of-service" style="color: blue">Όρους Χρήσης *</a></label>
</div>
<div class="contact__button">
<button type="submit" class="button">
{{ 'templates.contact.form.send' | t }}
</button>
</div>
{%- endform -%}
</div>
</div>
{% schema %}
{
"name": "t:sections.contact-form.name",
"tag": "section",
"class": "section",
"settings": [
{
"type": "text",
"id": "heading",
"default": "Contact Form Partnership",
"label": "Heading"
},
{
"type": "select",
"id": "heading_size",
"options": [
{
"value": "h2",
"label": "t:sections.all.heading_size.options__1.label"
},
{
"value": "h1",
"label": "t:sections.all.heading_size.options__2.label"
},
{
"value": "h0",
"label": "t:sections.all.heading_size.options__3.label"
}
],
"default": "h1",
"label": "t:sections.all.heading_size.label"
},
{
"type": "select",
"id": "color_scheme",
"options": [
{
"value": "accent-1",
"label": "t:sections.all.colors.accent_1.label"
},
{
"value": "accent-2",
"label": "t:sections.all.colors.accent_2.label"
},
{
"value": "background-1",
"label": "t:sections.all.colors.background_1.label"
},
{
"value": "background-2",
"label": "t:sections.all.colors.background_2.label"
},
{
"value": "inverse",
"label": "t:sections.all.colors.inverse.label"
}
],
"default": "background-1",
"label": "t:sections.all.colors.label"
},
{
"type": "header",
"content": "t:sections.all.padding.section_padding_heading"
},
{
"type": "range",
"id": "padding_top",
"min": 0,
"max": 100,
"step": 4,
"unit": "px",
"label": "t:sections.all.padding.padding_top",
"default": 36
},
{
"type": "range",
"id": "padding_bottom",
"min": 0,
"max": 100,
"step": 4,
"unit": "px",
"label": "t:sections.all.padding.padding_bottom",
"default": 36
}
],
"presets": [
{
"name": "t:sections.contact-form.presets.name"
}
]
}
{% endschema %}
Starting a B2B store is a big undertaking that requires careful planning and execution. W...
By JasonH Sep 23, 2024By investing 30 minutes of your time, you can unlock the potential for increased sales,...
By Jacqui Sep 11, 2024We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024