Produto de exemplo: https://customix-demo-store.myshopify.com/products/jd002-god-says-i-am-name-letter-in-bible-toile-de-jouy-style-personalized-jewelry-dish
Passo 1: Preparar os recursos de design
Para ativar a apresentação dinâmica de esquemas com base no número de caracteres, tem de preparar dois conjuntos de recursos de design. Estes recursos determinam como são apresentados os diferentes esquemas consoante os caracteres introduzidos pelos clientes.
a. Imagens do alfabeto em tamanho grande (carácter principal)
Este conjunto de recursos controla o carácter grande principal apresentado no esquema.
Estrutura da ordem dos ficheiros:
- Ficheiro 1 → Imagem vazia (marcador de posição obrigatório)
- Ficheiros 2–27 → Letras minúsculas
a–z - Ficheiros 28–54 → Letras maiúsculas
A–Z - Ficheiros 55–64 → Números
0–9(opcional)
b. Pastas de esquemas de citações
Prepare 54 pastas correspondentes aos 54 casos de caracteres, seguindo a mesma lógica da Parte 1:
- 27 pastas para letras minúsculas
a–z - 27 pastas para letras maiúsculas
A–Z
Cada pasta representa o esquema de citação para um carácter específico.
Passo 2: Adicionar elementos ao modelo
Depois de preparar todos os recursos de design, o passo seguinte é adicionar estes elementos a um modelo e configurar os esquemas.
a. Carregar os recursos para a biblioteca de Recursos
- Carregue todos os ficheiros e pastas preparados para Recursos → Imagens
- Certifique-se de que a estrutura de pastas (fundos, alfabetos, citações) é carregada corretamente
b. Criar um modelo de exemplo
Crie um novo modelo e comece a adicionar elementos; o primeiro é o Fundo com 3 cores: azul, vermelho e preto.
Em seguida, adicione 3 camadas de Alfabeto, redimensione-as e posicione-as no local pretendido do design.
Depois, adicione 3 camadas de Citação, correspondentes às mesmas 3 cores, e alinhe-as e posicione-as também em relação às camadas de alfabeto
c. Criar esquema
Selecione as 6 camadas e clique no ícone Criar esquema para as agrupar em Esquema 1.
Clique no Esquema 1 e prima a combinação de teclas Ctrl + C and Ctrl + V para duplicar o Esquema 2 com a mesma estrutura
Em seguida, expanda o Esquema 2 e selecione as 6 camadas correspondentes ao primeiro carácter; utilize também a combinação Ctrl + C and Ctrl + V para criar 6 camadas adicionais para o segundo carácter, como mostra a imagem de referência abaixo.
Guarde o modelo para manter a estrutura atual antes de passar ao passo de configuração seguinte
Passo 3: Mapeamento e lógica do conjunto de opções
Neste passo, vamos configurar os conjuntos de opções e a lógica para alternar automaticamente esquemas, alfabetos e citações com base no texto introduzido pelos clientes.
a. Adicionar uma opção Campo de texto
- Aceda a Conjuntos de opções → Adicionar → Campo de texto
- Este campo será utilizado pelos clientes para introduzirem o seu texto (por exemplo, o nome)
b. Ativar amostras por carácter
Nas definições do Campo de texto, ative Apresentar amostras por carácter e, em seguida, atribua:
- Blue Alphabet → Carácter 1
- Blue Alphabet 2 → Carácter 2
c. Ativar a alternância de esquemas consoante o comprimento do texto
Ative a funcionalidade Apresentar amostras de esquema consoante o comprimento do texto, que permite que os esquemas se ajustem automaticamente consoante o número de caracteres que o cliente introduz.
- Comprimento do texto = 1 carácter → Mostrar o Esquema 1
- Comprimento do texto = 2 caracteres → Mostrar o Esquema 2
d. Definir o ID global para a sincronização de caracteres
Agora tem de definir o ID global para todas as camadas que serão afetadas pelo primeiro carácter que os clientes introduzirem:
- Blue Alphabet
- Black Alphabet
- Red Alphabet
- Blue Quotes
- Black Quotes
- Red Quotes
⚠️ Não selecione valores de opção aninhados dentro dos conjuntos de opções Quote e defina ID global = 1
Quando Blue Alphabet mudar para o carácter A, todas as outras camadas com ID global = 1 mudam automaticamente para o valor A correspondente. Repita o mesmo processo para o segundo carácter.
e. Definir condições de apresentação por cor de fundo
Para garantir a correspondência correta das cores, selecione todas as camadas Black (Alphabet + Quotes) e adicione a condição: Mostrar apenas quando Fundo = Black
Repita a mesma configuração para os caracteres vermelhos e azuis. Isto garante que só são apresentados os recursos da cor correta, consoante o fundo selecionado.
f. Ocultar opções desnecessárias
Resultado final
Quando o cliente introduz 1 carácter (por exemplo, c), só é mostrado o Esquema 1 e são apresentados a citação e o alfabeto para C
Quando o cliente introduz 2 caracteres (por exemplo, cd), é mostrado o Esquema 2 e são apresentadas as citações e os alfabetos para C e D, respetivamente.
Atualizado em: 18/08/2026