Shopify has a default contact page option to add a contact form where your visitor can fill out the form and submit it to send a message. But if you want to add a contact form to a product page in your store then It’s will be hard before following this tutorial.

A contact form is a short web-based form published on a website. Any visitor can fill out the form and submit it to send a message to the site owner.

In this Shopify video tutorial, I am going to show you How to add a contact form to a product page in Shopify without hiring any developer.

Don’t worry, You do need to learn to code or write any code for that. I make this video super easy and cool for you. Just follow this video and use the code below by copying and pasting.

Step: 1 Open Sections Folder

Step 2: Find product-template.liquid file and open it

Step 3: Add the following code to this file.

      
<div class="contact-form form-vertical pcf-ui">
        {%- 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>

          <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 %}">

          <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>

Bonus: Tips for designing a great product page on Shopify:

1. Use high-quality images: Your product images should be clear, high-resolution, and show the product from multiple angles. Use a white background and consistent lighting to create a professional look.
2. Include product details: Provide all the necessary details about the product, including dimensions, materials, and care instructions. Use bullet points and headings to make it easy to read.
3. Use a clear and concise product title: Your product title should be descriptive, and concise, and include the most important information about the product.
4. Make the product price prominent: The product price should be easy to find and clearly displayed. Use a larger font size or bold text to make it stand out.
5. Use customer reviews: Include customer reviews and ratings on the product page to provide social proof and build trust with potential customers.
6. Include a clear call-to-action: Use a prominent and clear call-to-action (CTA) button, such as “Add to Cart” or “Buy Now”, to encourage visitors to make a purchase.
7. Make it mobile-friendly: Ensure that your product page is optimized for mobile devices, as more and more customers are using their smartphones to shop online.
8. Use a consistent design: Use a consistent design throughout your website to create a professional look and make it easier for customers to navigate.
9. Highlight related products: Use the product page to highlight related products, such as accessories or complementary items, to encourage customers to make additional purchases.
10. Optimize for SEO: Use relevant keywords in the product title, description, and meta tags to improve your SEO and help your product page rank higher in search engine results.

By following these tips, you can create a well-designed and effective product page that encourages visitors to make a purchase and helps you increase sales on your Shopify store.