SDK JavaScript incorporável. Os clientes finais personalizam o seu próprio trabalho artístico - carregam imagens, adicionar texto, posicionar, cortar - na página do seu produto, com a sua marca. Quando guardam, o SDK devolve um URL do trabalho artístico pronto para impressão que pode ser introduzido diretamente no ponto final da encomenda. Sem iframe, sem redireccionamento, sem a marca Fabrixa visível para o cliente final.
JS INCORPORADO - TEMATIZÁVEL - GANCHOS PARA EVENTOS - AGNÓSTICO EM RELAÇÃO À ESTRUTURA
O SDK apresenta uma tela de personalização dentro de qualquer elemento DOM que lhe seja fornecido. Os clientes finais clientes finais podem carregar ficheiros de ilustrações, adicionar camadas de texto, posicionar e cortar, pré-visualizar com o produto escolhido. Quando guardado, o SDK carrega o trabalho artístico composto para Fabrixa e devolve o URL do trabalho artístico através de uma chamada de retorno - pronto a para passar para a encomenda API.
Carregamento por arrastamento de PNG, JPG, SVG, AI, PSD. Conversão automática para formato pronto a imprimir. Avisos de resolução se o trabalho artístico do cliente for demasiado baixo para o produto escolhido.
Camadas de texto editáveis com tipos de letra pré-selecionados pela marca. Seleção de cores limitada à paleta da marca, se a especificar. Suporte para idiomas RTL.
Pré-visualização em direto da arte no produto escolhido (t-shirt, capuz, almofada, etc.) através de maquetas de produtos. O cliente vê o que vai receber.
Guias visuais que mostram zonas seguras para impressão, áreas de sangria, linhas de dobragem em produtos com vários painéis, como capas de edredão. Os clientes não podem colocar trabalhos artísticos fora da área imprimível.
Ao guardar, o SDK compõe o desenho, carrega-o para o armazenamento Fabrixa e devolve um URL estável. Passe-o como arte_url no pedido de encomenda.
Retornos de chamada de evento JS para tela pronta, camada adicionada, salvar, erro, etc. Crie as suas próprias análises, testes A/B ou fluxos de integração.
Agnóstico em relação à estrutura. O SDK é JS simples - funciona em React, Vue, Svelte, HTML simples, modelos Rails renderizados no servidor, em qualquer lugar.
<script src="https://sdk.fabrixa.com/editor/v1/sdk.js"< <div id="fbx-editor" estilo="altura:600px"></div> <script> const editor = FabrixaEditor.init({ contentor: "#fbx-editor", chave_da_api: "pk_live_yourPublicKeyHere", produto_id: "prod_tee_unisex_aop", // Tema da sua marca tema: { cor_primária: "#E95121", família_de_fonte: "Inter, system-ui", raio_da_borda: "4px" }, // Chamadas de retorno on_save: (trabalho artístico) => { // artwork.url é o URL pronto para impressão - alimentar a encomenda API consola.log(artwork.url, artwork.thumbnail_url); } }); </script>
O chave_da_api aqui está o público chave - seguro para enviar no código do navegador. Apenas autoriza a tela do editor; a realização de encomendas reais requer a sua chave secreta no seu backend.
O tema é opinativo - cor primária, família de letra, raio da margem, mais alguns tons de superfície. O editor não expõe todas as variáveis CSS de propósito; a consistência entre os sítios dos clientes é mais importante do que a personalização total.
tema: { // Cores da marca cor_primária: "#E95121", // CTAs, estados activos cor de fundo: "#FFFFFF", // fundo da tela cor_da_superfície: "#F4F4F4", // painéis, lista de camadas texto_primário: "#18202D", texto_secundário: "#5C6573", // Tipografia família_de_fonte: "Inter, system-ui, sans-serif", família_de_fonte_mono: "JetBrains Mono, monoespaço", // Forma raio_da_borda: "4px", estilo_do_botão: "sólido", // "sólido" | "contorno" // Comportamento mostrar_poder_por: falso, // ocultar o rodapé "Powered by Fabrixa enable_text_layers: verdadeiro, enable_image_upload: verdadeiro, tamanho_máximo_da_tela: { largura: 4096, altura: 4096 } }
Cada alteração significativa do estado do editor emite um evento JS. Subscreva no momento da inicialização ou anexe mais tarde através de editor.on().
const editor = FabrixaEditor.init({ /* ... */ }); // Editor montado e processado editor.sobre("pronto", () => analytics.pista("editor_open")); // Camada adicionada (imagem, texto) editor.sobre("layer.added", (layer) => { análises.pista("editor_layer_added", { type: layer.type }); }); // O cliente carrega no botão guardar editor.sobre("guardar", (trabalho artístico) => { // Encaminhar para o seu backend para criar a encomenda efectiva buscar("/api/orders", { método: "POST", corpo: JSON.stringify({ artwork_url: artwork.url, product_id: "prod_tee_unisex_aop", tamanho: selectedSize }) }); }); // Erros (ficheiro demasiado pequeno, falha no carregamento, etc.) editor.sobre("erro", (err) => { // err.code é uma string estável - comute-a consola.error(err.code, err.message); });
O SDK utiliza um público que é segura para ser enviada no código do cliente. Ele pode renderizar a tela, aceitar uploads e produzir um URL de arte pronta para impressão - mas não pode fazer um pedido, consultar o faturamento da conta ou ler a arte de outros clientes. arte-final de outros clientes. A colocação de pedidos acontece no back-end com o seu segredo chave.
O acesso ao Editor SDK é ativado por conta. Depois de ter efectuado a sua primeira ordem de produção, pode solicitar o acesso ao SDK a partir do painel de controlo ou contactando um engenheiro de soluções. Fornecemos chaves públicas + secretas, além de um ambiente ambiente de sandbox para desenvolver a integração antes que ela toque em encomendas reais.
Os preços variam consoante o nível de volume do SDK. Fale com o departamento de vendas para obter informações específicas.
Fale com um engenheiro de soluções para fornecer chaves SDK, configurar o seu ambiente sandbox, e analisar quaisquer requisitos de tela personalizada. O prazo de entrega do acesso ao SDK é normalmente 24 horas após uma breve revisão.
English English 
Nederlands
Français
Deutsch
Italiano
Português
Español
Українська
