Com o tema Dawn, adicionar um atributo de produto personalizado ou caixa de texto foi simplificado. Você pode adicionar vários elementos de IU do Shopify, apenas certifique-se de que o nome e o ID sejam únicos. Siga as instruções abaixo.
Se você tiver temas GRATUITOS do Shopify 2.0, por favor, use a ferramenta gratuita de geração de campos aqui.
Observação: Se você tiver a página de produto Dawn-Debut, isso também funcionará.
Se você tiver um tema diferente. Isso não será aplicável, mas é possível. Envie-me uma mensagem se precisar de ajuda.
1. Vá para gerador de elementos de IU do Shopify.
2. Escolha o line-item-property. Certifique-se de clicar em "mostrar no checkout" se desejar que as informações sejam exibidas no momento do checkout. Clique em "copiar para a área de transferência"
3. Vá para sua Loja online > Temas > Ações > Editar código
4. Vá para a pasta de Seção e abra o main-product.liquid
5. Encontre este código abaixo. Deve estar sob o "{%- when 'buy_buttons' -%}
Para Dawn versão 8.0 e acima, abra o buy-buttons.liquid na pasta Snippet e encontre o mesmo código.
6. Cole o código após {% form ...... %}. Veja a imagem abaixo, onde colar.
Veja o código personalizado para estilo personalizado.
Adicione o código em azul ao seu código de Elemento de IU do Shopify
Para texto-curto (veja a imagem abaixo de como fica):
Para texto-longo (veja a imagem abaixo de como fica):
Para dropdown (veja a imagem abaixo de como fica):
Adicionar um carregador de arquivos.
Para tornar os campos obrigatórios. Você precisa encontrar o código abaixo:
Em seguida, exclua `novalidate: 'novalidate'`. Depois adicione o atributo `required` ao seu campo de entrada.
Exemplo:
Adicionar um carregador de arquivos.
Para tornar os campos obrigatórios. Você precisa encontrar o código abaixo:
Em seguida, exclua `novalidate: 'novalidate'`. Depois adicione o atributo `required` ao seu campo de entrada.
Exemplo:
Outra maneira é usar o bloco Liquid personalizado usando o editor de temas.
1. Acesse sua loja online > Temas > Personalizar
2. Vá para o modelo de produto. Em informações do produto, clique em "adicionar bloco" e encontre "Liquid personalizado".
3. Na caixa de texto, coloque o código que você tem para o campo de texto, mas adicione o código abaixo na área de texto ou entrada. Certifique-se de adicionar o código antes de ">", veja o exemplo abaixo
Veja o exemplo abaixo e o código adicionado está em negrito
Isso é tudo (",)
Copied!
33 comentários
Please make sure to use the enhanced Shopify UI element tool https://made4uo.com/blogs/journey-to-awesome-shopify-website/enhanced-shopify-ui-elements-generator-tool
I followed your tutorial for Dawn 13.0 and made it “Required field” for proceeding to add it to cart.
But it doesn’t work for Buy Now button, can you help me? I don’t want customers to proceed without selecting the required fields.
Its working perfect for add to cart but users can directly click on “Buy Now” without filling in the required options
Hi ALLIE HEMMINGS,
You need to create a product template and edit that template. Please check our video tutorial on how https://youtu.be/bg7l0lZcyOU?si=4KJ9Hdub0NxPuOns
I’m wanting to add a line item property to one product only, and don’t want it to appear on other product pages. How would I go about doing this? Thanks so much for your awesome tutorials!
Hi Nadia,
We had posted an answer in Shopify community similar to your problem. You can check the solution on the link provided.
https://community.shopify.com/c/online-store-and-theme/custom-liquid-field-in-product-form/td-p/2314479