Customer Register - Identify Existing Email - shopify

I'm trying on Shopify when a user is trying to create an account, to verify if the email that the user picked already exists, the theme I'm using is Debut. So far I've had 0 success with this.
<div class="page-width">
<div class="grid">
<div class="grid__item medium-up--one-half medium-up--push-one-quarter">
<div class="input-form form-vertical">
{% form 'create_customer' %}
<h1 class="text-center">{{ 'customer.register.title' | t }}</h1>
{%- if form.errors -%}
<div class="form-message form-message--error">
{{ form.errors | default_errors }}
</div>
{%- endif -%}
<label for="FirstName">{{ 'customer.register.first_name' | t }}</label>
<input type="text" name="customer[first_name]" id="FirstName" {% if form.first_name %}value="{{ form.first_name }}"{% endif %} autofocus>
<label for="LastName">{{ 'customer.register.last_name' | t }}</label>
<input type="text" name="customer[last_name]" id="LastName" {% if form.last_name %}value="{{ form.last_name }}"{% endif %}>
<label for="Email">{{ 'customer.register.email' | t }}</label>
<input type="email" name="customer[email]" id="Email" class="{% if form.errors contains 'email' %} input--error{% endif %}" {% if form.email %} value="{{ form.email }}"{% endif %} autocorrect="off" autocapitalize="off">
<label for="CreatePassword">{{ 'customer.register.password' | t }}</label>
<input type="password" name="customer[password]" id="CreatePassword" class="{% if form.errors contains 'password' %} input--error{% endif %}">
<label for="CreatePassword2">Repeat Password</label>
<input type="password" name="customer[password]" id="CreatePassword2" class="{% if form.errors contains 'password' %} input--error{% endif %}">
<p class="text-center">
<input type="submit" value="{{ 'customer.register.submit' | t }}" class="btn">
</p>
{% endform %}
</div>
</div>
</div>
</div>
I thought that the part of
{{ form.errors | default_errors }}
Would return an error when the email is duplicate but it does nothing and the user just gets redirected to the main page. Any idea of how this can be accomplished? Thank you

Related

Contact form not submitting anywhere (shopify liquid custom build)

I'm working with someone else's code in shopify, and though the contact form looks nice and appears to work, it doesn't actually send the message to my email.
I just can't figure out where to input the email I want the form mapped to. I've tried entering it in various places, and no dice.
{%- 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 %}">
</div>
<div class="grid__item medium-up--one-half">
<label for="{{ formId }}-email">{{ 'contact.form.email' | t }} <span aria-hidden="true">*</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>
{{ 'contact.form.phone' | t }}
-->
<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>
</div>

How to add custom fields in contact page in shopify?

I want to add a "Subject" field in the contact form. This is the form code for it:
{%- form 'contact', id: 'ContactForm' -%}
<div class="contact__fields">
<div class="field">
<input class="field__input" autocomplete="name" type="text" id="ContactForm-name" name="contact[{{ 'templates.contact.form.name' | t }}]" value="{% if form.name %}{{ form.name }}{% elsif customer %}{{ customer.name }}{% endif %}" placeholder="{{ 'templates.contact.form.name' | t }}">
<label class="field__label" for="ContactForm-name">{{ 'templates.contact.form.name' | t }}</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>
<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 }}">
<label class="field__label" for="ContactForm-phone">{{ 'templates.contact.form.phone' | t }}</label>
</div>
<div class="field">
<input class="field__input" autocomplete="subject" type="text" id="ContactForm-subject" name="contact[{{ templates.contact.form.subject | t }}]" value="{% if form.name %}{{ form.subject }}{% elsif customer %}{{ customer.subject }}{% endif %}" placeholder="Subject">
<label class="field__label" for="ContactForm-subject">{{ 'templates.contact.form.subject' | t }}</label>
</div>
{%- endform -%}
This is en.default.json:-
"templates": {
"contact": {
"form": {
"name": "Name",
"email": "Email",
"phone": "Phone number",
"subject": "Subject",
"comment": "Comment",
"send": "Send",
....
}
}
}
When I submit the form an email is sent to me. But in the message of the email the subject appears as:
Contact.Form.Subject
I want the subject to appear as:
Subject
What can I do?

the pk=request i have some errors in it. i cant seems to link my reserve to another page because of this error

def reserve(request):
if request.method=="POST":
user=User.objects.get(pk=request.POST['user'])
**book = Book.objects.get(pk=request.POST['book'])**
book.isAvailable=True
book.save()
reservation=Reserve(dateLoaned=datetime.now(),book=book, user=user)
reservation.save()
reservations=Reserve.objects.all()
return redirect('/library/reservations/')
else:
user=User.objects.all()
book=Book.objects.all()
return render(request, 'reserve.html',{"users":user, "book":book})
There is some error in my book = Book.objects.get(pk=request.post[book'])
Im doing a project that needs to be submitted on Monday. PLS HELP!
reserve.html
{% extends 'base.html' %}
{% load static %}
{% block title %}
Reserve
{% endblock %}
{% block maincontent %}
<form action="../reserve/" method="post">
{% csrf_token %}
<br>
<div class="table">
<input value="{{ book.title }}" class="form-control"
id="exampleFormControlInput1" enabled>
</div>
<div class="form-group">
<td>
<img src = "{{ book.cover }}" height="150" width="100"/>
</td>
</div>
<div class="form-group">
<br>
<label for="FormControlSelect1">Select Users</label>
<select class="form-control" id="FormControlSelect1" required
name="user">
{% for user in users %}
<option value="{{ user.pk }}">{{ user }}</option>
{% endfor %}
</select>
</div>
<div class="form-group">
<button type="submit" class="btn btn-success btn-block">Reserve</button><br>
</div>
<input type="hidden" value="{{ book.pk }}" name="book" />
</form>
{% endblock %}
My reserve html might have some error. it should link my reserve to another page. but it didnt.
Error in the above image MultiValueDictKeyError. You have to replace the below code
reservation = Reserve.objects.get(pk=request.POST['reservation'])
to
reservation = Reserve.objects.get(pk=request.POST.get('reservation'))

Why can't I search spaces in shopify what do I do?

UPDATE
Ok I know what the problem is, but not how to solve it.
vendor:cow horn OR title:cow horn doesn't work
title:cow horn OR vendor:cow horn does.
Spaces are causing the additional prefixes to break where "OR" isn't properly working in my search results.
vendor:cow OR title:cow works
But the moment I put a space in the search then the title won't be searched.
I have a search bar, and I set it to search for an items tag, vendor & title.
Problem is this code prevents me from being able to use spaces in my search term, and if I append "*" I'm unable to use ampersands. Here's the code.
<form method="get" action="/search" id="search-home">
<button type="submit" value="search"></button>
<input type="hidden" name="type" value="product" />
<input type="hidden" name="q" class="searchtext" />
<input type="text" name="original" placeholder="Search"/>
</form>
<script>
$(document).on('submit','#search-home',function(){
var searchtext = $('input[name="original"]').val();
$('.searchtext').val("vendor:"+searchtext+" OR tag:"+searchtext+" OR title:"+searchtext);
});
</script>
If you need to see the search.liquid here it is.
<div id="impact-grid-header" class="collections-page">
<h1 id="regular-title">Search Results for: "{{ search.terms[1] | replace: 'vendor:', '' | replace: 'tag:', '' | replace: 'title:', '' | replace: '*', '' | strip | escape}}"</h1>
</div>
<div id="product-content" class="full-bleed">
<div class="content">
{% paginate search.results by 20 %}
<!-- Begin collection info -->
<div class="row">
<!-- End sort collection -->
<div class="column inventory-items">
{% include 'search-bar' %}
<div id="inventory" class="span12 content-grid">
<!-- Begin no products -->
{% if search.results.size == 0 %}
<div class="row">
<div class="span12 expanded-message">
<p>That's a great idea but unfortunately we don't have that item.<br/>Try again?</p>
</div>
</div>
{% endif %}
<div class="row products">
{% for item in search.results limit: settings.pagination_limit %}
{% if item.variants.first.inventory_quantity >= 0 %}
<div class="item product" data-tags="{% for tag in item.tags %}{{ tag | downcase }}, {% endfor %}">
<a href="{{ item.url }}">
<div class="product-pic">
<div class="inner-pic">
<img src="{{ item.featured_image | product_img_url: 'large' }}" alt="{{ item.title | escape }}"/>
</div>
<!-- Box that appears upon hover -->
<div class="view-product bg-black">
<i class="icon-search"></i>
<span>View</span>
</div>
</div>
</a>
<div class="description">
<span class="product-name">{{ item.title }}</span>
<span class="brand">{{ item.vendor }}</span>
<span class="price">
{% if item.available %}
{% if item.compare_at_price_max > item.price %}
<del>{{ item.compare_at_price | money }}</del>
{% endif %}
{% if item.price_varies %}
<em>from</em>
{% endif %}
<span>{{ item.price | money }}</span>
{% else %}
<span>
{{ item.price | money }} Sold Out
</span>
{% endif %}
</span>
<span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>
</div>
</div>
{% endif %}
{% endfor %}
</div>
{% include 'pagination' %}
{% endpaginate %}
<!-- End no products -->
</div>
</div>
</div>
</div>

Using Shopify how can I capture the customer address on registration and have it saved as the default address for billing and shipping?

I am creating a shopify website and I am trying to customize it so when a user / customer registers they can put their address information in at the time and have it saved as their default address. Shopify currently has it so you register then it takes you to an account page where you have the option of adding the address in.
I have tried making form elements on the register page which works as in they show up and get data.
But I don't know how to make the form submit the address data to the default address data locations.
In other words I don't know how to make it store the address as the default address.
I have looked at the code for the actual address page and tried plugin in the id's names and form values in the registration section with no luck. I have tried using id's and names associated with the api customer reference with no luck as well. I can't really find documentation on the subject. There is a section on capturing additional information at registration but its capture as "Notes" not as an address.
Any help is greatly appreciated thank you.
I created a second account page (customers/account.new-address.liquid) with the address registration form:
{% assign formID = "" %}
{% if formInfo.id %}
{% assign formID = formInfo.id | prepend: "_"%}
{% endif %}
{% form 'customer_address', formInfo %}
<div class="input-wrapper">
<label for="customer_addresses_first_name{{ formID }}">{{ 'customer.addresses.first_name' | t }}</label>
<input type="text" name="address[first_name]" value="{{form.first_name}}" id="customer_addresses_first_name{{ formID }}" />
</div>
<div class="input-wrapper">
<label for="customer_addresses_last_name{{ formID }}">{{ 'customer.addresses.last_name' | t }}</label>
<input type="text" name="address[last_name]" value="{{form.last_name}}" id="customer_addresses_last_name{{ formID }}" />
</div>
<div class="input-wrapper">
<label for="customer_addresses_company{{ formID }}">{{ 'customer.addresses.company' | t }}</label>
<input type="text" name="address[company]" value="{{form.company}}" id="customer_addresses_company{{ formID }}" />
</div>
<div class="input-wrapper">
<label for="customer_addresses_address1{{ formID }}">{{ 'Street Address' }}</label>
<input type="text" name="address[address1]" value="{{form.address1}}" id="customer_addresses_address1{{ formID }}" />
</div>
<div class="input-wrapper">
<label for="customer_addresses_address2{{ formID }}">{{ 'Suburb' }}</label>
<input type="text" name="address[address2]" value="{{form.address2}}" id="customer_addresses_address2{{ formID }}" />
</div>
<div class="input-wrapper">
<label for="customer_addresses_city{{ formID }}">{{ 'customer.addresses.city' | t }}</label>
<input type="text" name="address[city]" value="{{form.city}}" id="customer_addresses_city{{ formID }}" />
</div>
{% if isNew %}
<div class="input-wrapper">
<label for="address-country">{{ 'customer.addresses.country' | t }}</label>
<div class="select-wrapper">
<div class="selected-text"></div>
<select id="address-country" name="address[country]" data-default="{{form.country}}">{{ country_option_tags }}</select>
</div>
</div>
<div class="input-wrapper" id="address-province-container" style="display:none">
<label for="address-province">{{ 'customer.addresses.province' | t }}</label>
<div class="select-wrapper">
<div class="selected-text"></div>
<select id="address-province" class="new-address-province" name="address[province]" data-default="{{form.province}}"></select>
</div>
</div>
{% else %}
<div class="input-wrapper">
<label for="address-country-{{form.id}}">{{ 'customer.addresses.country' | t }}</label>
<div class="select-wrapper">
<div class="selected-text"></div>
<select id="address-country-{{form.id}}" name="address[country]" data-default="{{form.country}}">{{ country_option_tags }}</select>
</div>
</div>
<div class="input-wrapper" id="address-province-container-{{ address.id }}" style="display:none">
<label for="address-province-{{ address.id }}">{{ 'customer.addresses.province' | t }}</label>
<div class="select-wrapper">
<div class="selected-text"></div>
<select id="address-province-{{ address.id }}" name="address[province]" data-default="{{form.province}}"></select>
</div>
</div>
{% endif %}
<div class="input-wrapper">
<label for="customer_addresses_zip{{ formID }}">{{ 'customer.addresses.zip' | t }}</label>
<input type="text" name="address[zip]" value="{{form.zip}}" id="customer_addresses_zip{{ formID }}" />
</div>
<div class="input-wrapper">
<label for="customer_addresses_phone{{ formID }}">{{ 'customer.addresses.phone' | t }}</label>
<input type="text" name="address[phone]" value="{{form.phone}}" id="customer_addresses_phone{{ formID }}" />
</div>
<div class="inline-input-wrapper">
{% capture defaultAddressID %}
{% if isNew %}
address_default_address_new
{% else %}
address_default_address{{ formID }}
{% endif %}
{% endcapture %}
<label for="{{ defaultAddressID | strip_newlines | strip}}">
{{ form.set_as_default_checkbox }}
<span class="inline-label">
{{ 'customer.addresses.set_as_default' | t }}
</span>
</label>
</div>
<div class="input-wrapper cta-container">
<input class="button" type="submit" id="submit{{ formID }}" value="{{ 'general.general.submit' | t }}">
{% unless isNew %}
<button class="cancel-edit button secondary">{{ 'customer.general.cancel' | t }}</button>
{% endunless %}
{% if customer.addresses.size > 0 and isNew %}
<button class="toggle-new-address button secondary">{{ 'customer.general.cancel' | t }}</button>
{% endif %}
</div>
{% endform %}
and then added the following code to the top of the account page (customers/account.liquid) so when a customer accesses the account page after registering and they have 0 addresses on their profile they are redirected to add an address:
{% if customer.addresses.size == 0 %}
<meta content="0; url=/account?view=new-address" http-equiv="refresh" />
{% endif %}
The ?view=new-address is the link to the alternative account page we created above.
This can't be done on the registration form without the use of a third-party app. The solution provided by Muaaz above is the only workaround I'm aware of, and it's a good solution if you're okay with using 2 forms.
You can follow Shopify's tutorial to collect address fields (or other custom fields), but these fields are saved only to the customer note. Address fields will not save as the default address.
The Customer Fields app allows you to collect address fields and save that data as the customer's default address. This is available on the Lite plan, which allows you to collect any standard Shopify fields during registration.