Line item properties in Dawn Theme

gunnar-1 · ‎08-04-2021

Hi There,

I'm currently switching my shop to the new Dawn theme and my original theme was based on Debut. It seems that the Dawn theme uses an Ajax cart to submit an add to cart action, but I'm unable to add the chosen line item properties. Can anybody help me with the code I need to change, or add to the product-form.js file to achieve this?

Thank you in advance.

LamQSolutions · ‎08-04-2021

Hi,

To add the line in the Dawn theme, you can follow these steps below

1. Go to file sections/main-product.liquid, find <div class="product-form__input product-form__quantity"> and insert the following under that line

<div>
   <style>
      .product__info-container--sticky {
      position: static !important;
      }
   </style>
   <label class="form__label" for="pinfel-select">Pinfel pack</label>
   <div class="select" id="pinfel-select">
      <select required class="select__select required" id="pinfel">
         <option class="fruta" value="Fruta">{{ 'products.product.fruit' | t }}</option>
         <option class="jogos" value="Jogos">{{ 'products.product.games' | t }}</option>
         <option class="rock" value="Rock">Rock</option>
         <option class="espaco" value="Espaço">{{ 'products.product.space' | t }}</option>
      </select>
      {% render 'icon-caret' %}
   </div>
</div>
</div>

2. Go to the file assets/product-form.js, find const body = JSON.stringify({ and add the following code under that line

properties: { Pinfel: $('#pinfel-select select').val() },

Found my answer helpful? Please LIKE or Accept Solutions.
You may be interested in our apps
Scrolly Telling - Create scroll-based animations visually.
Ultimate Sections - Slideshow, Gallery, Collection, FAQs, Brand, Info box, Testimonial and more

View solution in original post

Line item properties in Dawn Theme

Community Blog Articles

Shopify Community

Support

Shopify

Quick Links