Trata-se de módulo de opções personalizadas com editor, onde o cliente pode customizar o seu produto de várias formas:
O cliente pode escolher a cor, tamanho etc e haverá uma opção na página do produto onde ele será redirecionado para um editor.


Inserir Opções personalizadas com Preview


Para customizar a opção personalizada de um produto, ir no cadastro de  produto, selecione o produto desejado.

Clique na Aba: Opções Personalizadas


Clicar em: + Nova Opção


Em tipo de campo selecione: Custom Product Preview


Preencha as informações referente ao título, se será obrigatório o preenchimento deste campo, ordem de preferencia de exibição e o preço  desta customização.



PRODUCT TEMPLATE 


***A personalização será feita em cima da foto que selecionar aqui!


Selecione alguma imagem do produto

Clique em "Editar área imprimível" para definir a parte do seu produto que os clientes podem personalizar. Importante: se você usar o modo Popup do editor, sua imagem de modelo será exibida em tamanho real no front end.

Redimensione a imagem original para o editor pop-up. Importante: se você deixar a escala em 100%, a imagem em tamanho real aparecerá no editor pop-up.



IMAGEM


Permitir/não permitir que os clientes façam upload de suas próprias imagens.



CLIPART


Permitir/não permitir que os clientes vejam e usem cliparts predefinidos pelo administrador.

*selecione os clipart que desejar



TEXTO


Permitir/não permitir que os clientes usem o editor de texto configurado pelo administrador.

Escolha 'Campo de texto' ou 'Área de texto' como um tipo de caixa de entrada. Definir o comprimento máximo do texto.

Permitir distorção de objetos.

Caso for usar as cores predefinidas clique em Ativar seletor de cores. Permitir paleta de cores ou apenas cores predefinidas, selecione o Conjunto de Cores Predefinidas. 

Permitir texto em curva.




SHAPE MASK


Permita que os clientes apliquem uma forma personalizada ao design (por exemplo, um coração ou uma estrela) para definir a área que deve ser impressa. Selecione a categoria de mascaras e definir a área que será aplicada.

Caso for usar - clique para habilitar e selecione o grupo




Permita que os clientes usem suas fotos do Instagram em design personalizado.

Permita que os clientes usem suas fotos do Pinterest em design personalizado.

Mostre ou oculte a guia Salvar design no front end.



Configurações Adicionais


Por padrão, todos os gráficos do cliente são colocados em cima do seu modelo. No entanto, você pode optar por colocá-los atrás do modelo por padrão. Isso pode ser útil se o seu modelo contiver áreas com transparência absoluta (por exemplo, um porta-retratos).

Colocar texto, image, clipart atrás do modelo por padrão.

Converta as camadas de imagem e texto do usuário para preto e branco




Customização Pelo Cliente


Na página do produto o cliente poderá efetuar a customização do produto!





De acordo com a configuração feito no painel de cadastro do produto, irá exibir as ferramentas para o cliente editar o produto!


Poderá fazer upload de uma imagem,  ou do Instagram ou do Pinterest.




Inserir os ClipArts - 




Selecione o ClipArt desejado e clique em: Add Imagem




Inserir texto - definir o texto, a font e o estilo e a cor e curvatura



Inserir Mascara - Selecione a máscara e clique em: Add Mask



Após o cliente efetuar a personalização - clicar em aplicar


Preview no Front - End





Clicando em comprar será mostrado a personalização no carrinho


O cliente finalizando o pedido, as informações 



Inserção de Conteúdo


No editor, o cliente poderá adicionar imagens de seu dispositivo, clip arts pré estabelecidos por vocês, textos com várias fontes, máscaras e poderá posicionar  os itens como preferir e definir o tamanho desejado também. Vale ressaltar que no módulo no painel, você pode adicionar seus próprios pacotes de cliparts, fontes, etc que aparecerá no editor para o cliente.
Para quem trabalha com produtos personalizados, é uma ferramenta magnifica. As possibilidades são incontáveis!




Inserir Clipart


Será exibido a lista de Cliparts preexistentes podendo editar o nome da categoria, criar nova categoria, excluir determinada categoria ou inserir imagens em determinada categoria


Para excluir determinada categoria - selecione a referida categoria e em Ações - sete Excluir e clique em Enviar




Para editar o nome da categoria -  selecione a categoria que deseja alterar o nome e clique em editar



Nesta tela poderá alterar o nome e caso desejar inserir uma descrição e uma legenda.  Feito a alteração clique em Salvar ou em delete caso deseje excluir a categoria



Criar Nova Categoria - Clicar em Add Category



Nesta tela irá inserir o nome e caso desejar inserir uma descrição e uma legenda.  Feito a inclusão clique em Save Item.




Para inserir novas imagens nas categorias - Selecione a referida categoria - e clique em imagens



Será exibo as imagens da categoria

Caso queira alterar o nome ou a alterar a imagem clique em editar



Para inserir uma nova imagem a categoria - clique em Add Item



Insira o nome da Imagem e o arquivo e clique em Save Item




Inserir Fonts


Será exibido a lista de Fonts preexistentes podendo editar, inserir nova font, excluir ou desativar determinada Font


Para editar - na Font que deseja  alterar clique em Editar



Poderá alterar o nome da Font, ativar/desativar, selecionar a família a qual a Font será vinculada  e alterar o arquivo da Font - após o procedimento clique em Save Item


Para incluir nova Font clique em Add Item



Inclua o nome da Font, ativar/desativar, selecionar a família a qual a Font será vinculada   ou crie uma nova familia e insira o arquivo da Font - após o procedimento clique em Save Item




Gerenciamento de Fonts Familie


Poderá editar/excluir ou adicionar nova família de Font

Pode alterar/incluir o nome e inserir ou alterar arquivo de Font - no formato: Zipado ou TTF

Um arquivo zip deve incluir arquivos de fonte nomeados corretamente. Duas opções são possíveis: 1. "[font family]-[style].ttf", ou seja, "Palatino-italic.ttf".2. "style.ttf", ou seja, "italic.ttf".



Inserir Fonte de Cor


Poderá inserir , editar, alterar o status ou  excluir o conjunto de cor, bem como inserir novas cores a este conjunto

Para inserir novas cores clique em editar - e clique em Add Color e escolha a cor na paleta de cores e clique em Save Item




Inserir Mascaras


Poderá incluir  nova categoria, editar ( alterar o nome e a legenda da categoria)  ou excluir  a categoria, bem como inserir novas mascaras a categoria

Para inserir novas mascaras clique em Mask




Será exibida as máscaras da categoria, podendo editar - clique em editar , excluir ou inserir novas mascarás ( clique em Add Mask)




Defina o nome, suba a imagem ( formato .PNG) e se irá manter ou não a proporção.



Configurações Gerais


Ir em: Sistemas - Configurações - Catálogo - (Catálogo) - Custom Product Preview - General Settings


Editor Settings - Definir se o editor será aberto em editor ou na página do produto (O produto será editado diretamente na página Product Detail se o On-page Editor estiver ativado.). Defina o tipo de editor: Ícone ou Lista, permitir distorções de objeto, Permitir colocar atrás da imagem do produto



Configurações de Imagens


Irá definir o tamanho máximo da miniatura, Tamanho máximo da miniatura (integração de galeria), Tentar converter qualquer arquivo enviado por usuário não padrão e Ativar Salvar Imagens Svg Como PDF (ambos requer que o ImageMagick seja instalado)

Configurações de Texto


Resolução de texto personalizada (Px.), Permitir apenas cores predefinidas para fontes e contorno de texto, Ativar contorno de texto, Ativar sombra de texto.



Configurações de marketing


Para ativar bloco promocional da página inicial, Use a funcionalidade de compartilhamento de redes sociais, defina a largura e a altura máxima da imagem compartilhada nas redes sociais, selecione o Modelo de e-mail para enviar imagens compartilhadas.




Cron Settings


Especifique o numero de dias, o qual o sistema  automaticamente tirá excluir todas as imagens dos pedidos com status: concluído, fechar ou cancelar.



Configurações de confirmação do usuário


Exibir caixa de seleção de confirmação de qualidade de imagem (Exibir caixa de seleção de confirmação da qualidade da imagem durante o upload do arquivo de imagem; Recomendado), Texto de confirmação curto perto da caixa de seleção de confirmação de qualidade de imagem, Ative o pop-up de confirmação com o texto estendido, Título do pop-up de confirmação, Texto de confirmação estendido para o pop-up, Alinhamento do texto pop-up de confirmação. 



Visualização do produto personalizado - Configurações de estilo


Aqui poderá personalizar: cor de fundo para o editor, o estilo dos botões, dos Ícones etc.