product customization

Solved
Highlighted
New Member
3 0 0

Hi everyone,

 

I run a gift shop and want to give my customers an option of getting an a gift-card with a personal message-right on the product page.

Screenshot 2019-09-19 at 01.06.56.png

 

For that i need to add a customization form on my product page template and i'm following this tutorial: https://help.shopify.com/en/themes/customization/products/features/get-customization-information-for...

 

I got to the moment in your instructions where i have to find " type="submit" " in my code and rewrite something. The problem is i can't find this code in my product page code!

Has anybody have this problem before or has an idea, where else this part of code might be?

 

Thank you in advance, Daria

0 Likes

Success.

Hi Daria, in some themes the product-template.liquid section will reference a snippet of code for the product form that's in another file. In your case, it's likely that your snippet (or maybe section) is called product-form.liquid and that's where you'll find "type="submit"

 

Good luck!

Making Shopify Tasks Straight Forward

Website: https://theshoptinkerers.com/
0 Likes

hi,@swank_ch

hope you doing good

 

Please Follow the Instruction we definitely help you

https://help.shopify.com/en/themes/customization/products/features/get-customization-information-for...

 

if you face any issue feel free to reach out

Thanks & Regards
Perennial Solution

Would like to add new functionality or customize an existing one, please hire us.
If helpful then please Like and Accept Solution .
Email: infoperennialsolution@gmail.com
Skype: infoperennialsolution
0 Likes
New Member
3 0 0

@Perennial wrote:

hi,@swank_ch

hope you doing good

 

Please Follow the Instruction we definitely help you

https://help.shopify.com/en/themes/customization/products/features/get-customization-information-for...

 

if you face any issue feel free to reach out



thanks, this is exactly the tutorial that i've been following :-)

0 Likes
New Member
3 0 0

@TheShopTinkerer wrote:

Hi Daria, in some themes the product-template.liquid section will reference a snippet of code for the product form that's in another file. In your case, it's likely that your snippet (or maybe section) is called product-form.liquid and that's where you'll find "type="submit"

 

Good luck!



oh thanks so much, you saved me, this is exactly what worked!

perfect, thank you!

0 Likes

hi,@swank_ch

- Like and Mark as an Accepted Solution if reply helpful

- Feel free to contact me on infoperennialsolution@gmail.com regarding any help

Thanks & Regards
Perennial Solution

Would like to add new functionality or customize an existing one, please hire us.
If helpful then please Like and Accept Solution .
Email: infoperennialsolution@gmail.com
Skype: infoperennialsolution
0 Likes
New Member
12 0 0

Hello, 

 

I'm facing the same issue but I have no such page as product-form.liquid :(

For info I'm using Wokiee theme.

 

I've somehow manage to tweak the thing a little bit to display a text box on the product page where I want but then I cannot retrieve this information when an order is placed :/

 

So if someone could help me locate the file where to fond the "type="submit", that would be great !

0 Likes
New Member
12 0 0

Here is a detail if what I did, if someone could help me that would be great cause I have the feeling there's not too much missing ! 

For information, I'm using the theme "Wokiee" (which appears to be a sectionned theme).

 

So I've followed the Shopify tutorial "Get customization information for products" here : https://help.shopify.com/en/themes/customization/products/features/get-customization-information-for...

 

Everything is OK until I arrived to the part where I should locate "type="submit" in the product-customizable-template.liquid

I can't find this, it's not existing in this file.

 

Then I ran into this other tutorial : https://www.envision.io/blogs/ecommerce-pulse/95036801-how-to-create-customizable-products-in-shopif...

 

So I've tried to combined both tutorial and here's what I've done : 

  • I've created a new template named "product.customizable.liquid" (and didn't change anything in it compared to the original template "product.liquid")
  • Then I went into the Snippets section and edit this file "product_page_1_description.liquid", which is the one I edit usually to make change to the product page template. I've added this piece of code : 

 

{% if template contains 'product.customizable' %}

<p class="line-item-property__field">
  <label for="personnalisation">PERSONNALISATION</label>
  <input id="personnalisation" type="text" name="properties[PERSONNALISATION]">
  </br>
  <label for="image">IMAGE</label>
  <input id="image" type="file" enctype="multipart/form-data" name="properties[IMAGE]">
</p>

{% endif %}

As you can see it doesn't look so bad as I can see the 2 fields I want : a text field and an image upload button.

 

You can see the result on this product page : https://gourde-morning.com/products/bouteille-rose-noir

Or on this image : 

Capture d’écran 2019-10-14 à 08.21.52.png

 

I was pretty happy but here is the trick : I can't retrieve the information entered in the text field and the image uploaded.

 

I've edited the email template that I receive for each order by replacing this

{{ line.title }}

by

{{ line.title }}{% for p in line.properties %}{% unless p.last == blank %} - {{ p.first }}: {{ p.last }}{% endunless %}{% endfor %}

I also edited the one the customer receives and I made 4 or 5 test orders (with the bogus gateway) but I've never seen the information entered during the order appeared :

Capture d’écran 2019-10-14 à 08.26.18.png

 

I couldn't neither see this information in the order admin panel of Shopify (which should be doable from what I've read)

Capture d’écran 2019-10-14 à 08.28.45.png

 

If anyone could help me to retrieve this information, that would be great ! 

0 Likes

Hi @GourdeMorning,

 

Is this something you are looking for? Please confirm.

https://perennialsolution.myshopify.com/products/personalized-product

Thanks & Regards
Perennial Solution

Would like to add new functionality or customize an existing one, please hire us.
If helpful then please Like and Accept Solution .
Email: infoperennialsolution@gmail.com
Skype: infoperennialsolution
0 Likes