How can I add a custom contact form to my homepage?

Rlmps11
Visitor
3 0 0

Hello everyone,

 

I customized my contact form and I try to add it in my homepage:

I past this code in section - custom-content.liquid before than {% schema %}

 

Click to expand...

<div class="contact-form form-vertical">
<div class="contact-form form-vertical">
{%- assign formId = 'ContactForm' -%}
{% form 'contact', id: formId %}
{% include 'form-status', form: form, form_id: formId %}

<div class="grid grid--half-gutters">
<div class="grid__item medium-up--one-half">
<label for="{{ formId }}-name">{{ 'contact.form.name' | t }} *</label>
<input type="text" id="{{ formId }}-name" name="contact[{{ 'contact.form.name' | t }}]" value="{% if form[name] %}{{ form[name] }}{% elsif customer %}{{ customer.name }}{% endif %}" required>
</div>
<div class="grid__item medium-up--one-half">
<label for="{{ formId }}-email">{{ 'contact.form.email' | t }} <span aria-hidden="true" required>*</span></label>
<input
type="email"
id="{{ formId }}-email"
name="contact[email]"
autocorrect="off"
autocapitalize="off"
value="{% if form.email %}{{ form.email }}{% elsif customer %}{{ customer.email }}{% endif %}"
aria-required="true"
{%- if form.errors contains 'email' -%}
class="input--error"
aria-invalid="true"
aria-describedby="{{ formId }}-email-error"
{%- endif -%}
>
{%- if form.errors contains 'email' -%}
<span id="{{ formId}}-email-error" class="input-error-message">
<span class="visually-hidden">{{ 'general.accessibility.error' | t }} </span>
{% include 'icon-error' %}
<span>{{ form.errors.translated_fields['email'] | capitalize }} {{ form.errors.messages['email'] }}.</span>
</span>
{%- endif -%}
</div>
</div>

<label>Cognome *</label>
<input type="text"required />

<label for="{{ formId }}-phone">{{ 'contact.form.phone' | t }}*</label>
<input type="tel" id="{{ formId }}-phone" name="contact[{{ 'contact.form.phone' | t }}]" pattern="[0-9\-]*" value="{% if form[phone] %}{{ form[phone] }}{% elsif customer %}{{ customer.phone }}{% endif %}" required>


<label>Città*</label>
<input type="text" required />


<label>Provincia*</label>
<input type="text" required />

<label><a style="color:blue;" href="https://www.amministrazionicomunali.it/docs/pdf/categorie_catastali.pdf" target="_blank">Categoria Catastale</a> (es A1-A9 residenziale, A10 uffici; premi nel link per visionare tutte le categorie)*</label>
<input type="text" required />

<label>Fogli Catastali* <a style="color:blue;" href="https://geoportale.cartografia.agenziaentrate.gov.it/age-inspire/srv/ita/catalog.search#/home?pg=" target="_blank">Geoportale</a> <a style="color:blue;" href="https://www.formaps.it/" target="_blank">Formaps</a></label>
<input type="text" required />

<label>Dati da erogare</label>
<select>
<option>Mappatura</option>
<option>Mappatura + Numeri Fissi</option>
<option>Mappatura + Cellulari</option>
<option>Mappatura + Numeri Fissi + cellulari</option>
</select>


<label>Do il consenso al trattamento dei dati personali*</label>
<input type="radio" name="contact[discovery]" value="none" required />
<a href="https://www.realmaps.eu/policies/privacy-policy" target="_blank">Informativa sulla Privacy</a>



<label for="{{ formId }}-message">{{ 'contact.form.message' | t }}</label>
<textarea rows="10" id="{{ formId }}-message" name="contact[{{ 'contact.form.message' | t }}]">{% if form.body %}{{ form.body }}{% endif %}</textarea>

<input type="submit" class="btn" value="{{ 'contact.form.submit' | t }}">

{% endform %}
</div>

 

 

 

 But so I can't add other customize content because contact form appear everywhere.

 

How can I solve?

Ty 

Reply 1 (1)

Rlmps11
Visitor
3 0 0

I solved:

 

I create a new section

It needs this code at the end of page for works

Click to expand...
{% schema %}
{
"name": "Section Name",
"settings": [],
"presets": [
{
"name": "Section Name",
"category": "ADVANCED LAYOUT"
}
]
}
{% endschema %}
{% stylesheet %}
{% endstylesheet %}
{% javascript %}
{% endjavascript %}