[{"data":1,"prerenderedAt":255},["ShallowReactive",2],{"footer-guides.pt-br":3,"posts.pt-br.como-adicionar-precos-e-logos-nas-imagens-de-anuncios-de-catalogo":13,"posts.pt-br.como-adicionar-precos-e-logos-nas-imagens-de-anuncios-de-catalogo.related":238,"image-size:\u002Fblog\u002Fintroducing-image-transformations\u002Fhero-9197c05b-1400.webp":239,"image-size:\u002Fblog\u002Fintroducing-image-transformations\u002F1665928989-d22e227d-d796-40a0-acfc-daccda5f401b.webp":242,"image-size:\u002Fblog\u002Fintroducing-image-transformations\u002F1665929019-1ee6eb4c-ff8e-4861-b31f-874aab9bc200.webp":244,"image-size:\u002Fblog\u002Fintroducing-image-transformations\u002F1665929052-7a77a604-1c48-4a66-828e-baddfc126cac.webp":246,"image-size:\u002Fblog\u002Fintroducing-image-transformations\u002F1665929079-7f82bba9-f0c3-4859-8c6c-5434a417bc54.webp":248,"image-size:\u002Fblog\u002Fintroducing-image-transformations\u002F1665929098-10c76ee0-1c81-4e6e-8928-51db2836eb6d.webp":250,"image-size:\u002Fblog\u002Fintroducing-image-transformations\u002F1665929109-41daee5d-0c39-4c6d-9526-71c5e0edc145.webp":252,"image-size:\u002Fblog\u002Fintroducing-image-transformations\u002F1665929120-4f705229-44da-4afe-8211-c2dc9feffae2.webp":253},[4,7,10],{"title":5,"path":6},"Anúncios de catálogo da Meta: guia prático para lojas virtuais","\u002Fpt-br\u002Fblog\u002Fanuncios-de-catalogo-da-meta-guia-pratico",{"title":8,"path":9},"O que é um feed de produtos?","\u002Fpt-br\u002Fblog\u002Fo-que-e-um-feed-de-produtos",{"title":11,"path":12},"Como otimizar os títulos dos seus produtos no Google Shopping","\u002Fpt-br\u002Fblog\u002Fcomo-otimizar-titulos-de-produtos-google-shopping",{"id":14,"title":15,"author":16,"body":17,"date":218,"description":219,"draft":220,"extension":221,"hero":222,"heroAlt":223,"image":224,"intro":225,"meta":226,"navigation":228,"path":229,"related":230,"seo":231,"stem":232,"tags":233,"updated":230,"__hash__":235,"slug":236,"sourcePath":237},"blog_pt_br\u002Fblog\u002Fpt-br\u002F2022-08-26-introducing-image-transformations.md","Como adicionar preços e logos nas imagens dos anúncios de catálogo","jacob-moelby",{"type":18,"value":19,"toc":206},"minimark",[20,30,33,38,48,55,59,62,65,71,75,78,84,88,94,100,104,107,126,138,144,148,151,157,161,164,184,187,193,197,200,203],[21,22,23,24,29],"p",{},"Para adicionar preços e logos nas imagens dos seus anúncios de catálogo, você cria um template e o Feedr aplica esse template em todas as imagens de produto do seu feed. Envie o seu logo, adicione o preço como um texto que é preenchido com os dados de cada produto e defina condições para que o selo de promoção só apareça nos produtos em oferta. Neste artigo, mostramos o editor que torna isso possível. Para ver o que adicionamos um mês depois do lançamento, como novos tamanhos de imagem e cores de fundo automáticas, leia a ",[25,26,28],"a",{"href":27},"\u002Fblog\u002Fimage-transformations-feature-update","atualização das transformações de imagem",".",[21,31,32],{},"Temos orgulho de apresentar o nosso novo recurso: as transformações de imagem. Com elas, você transforma as imagens dos seus produtos de forma dinâmica e com muito controle. As sobreposições de imagem atuais têm muitas limitações, então queríamos melhorar a experiência. Trabalhamos muito para criar um editor moderno que permite editar as imagens de formas mais complexas, para que os seus anúncios recebam a atenção que merecem.",[34,35,37],"h2",{"id":36},"templates","Templates",[21,39,40,41,47],{},"No Feedr, agora você encontra um novo botão na barra lateral: ",[42,43,44],"em",{},[45,46,37],"strong",{},". Nesta página, você vê um resumo dos seus templates atuais. Você pode criar templates novos ou ver todos os templates de um produto específico.",[21,49,50],{},[51,52],"img",{"alt":53,"src":54,"title":53},"Templates das transformações de imagem","\u002Fblog\u002Fintroducing-image-transformations\u002F1665928989-d22e227d-d796-40a0-acfc-daccda5f401b.webp",[34,56,58],{"id":57},"editor","Editor",[21,60,61],{},"O novo editor permite alterar as imagens dos produtos do jeito que você quiser. Ao clicar em um template, ele abre em tela cheia.",[21,63,64],{},"No centro da tela fica a área de trabalho. É aqui que você vê e edita os elementos do template. Basta arrastar os elementos ou redimensioná-los como quiser.",[21,66,67],{},[51,68],{"alt":69,"src":70,"title":69},"Editor das transformações de imagem","\u002Fblog\u002Fintroducing-image-transformations\u002F1665929019-1ee6eb4c-ff8e-4861-b31f-874aab9bc200.webp",[34,72,74],{"id":73},"camadas","Camadas",[21,76,77],{},"No lado esquerdo ficam as camadas. Aqui você vê e muda a ordem dos elementos da área de trabalho, além de renomear e excluir cada um deles.",[21,79,80],{},[51,81],{"alt":82,"src":83,"title":82},"Painel de camadas das transformações de imagem","\u002Fblog\u002Fintroducing-image-transformations\u002F1665929052-7a77a604-1c48-4a66-828e-baddfc126cac.webp",[34,85,87],{"id":86},"configurações","Configurações",[21,89,90,91,93],{},"Você também pode selecionar ",[42,92,87],{}," na barra lateral para mudar o tamanho da imagem final ou renomear o template. Ali você também vê os atalhos de teclado disponíveis.",[21,95,96],{},[51,97],{"alt":98,"src":99,"title":98},"Configurações das transformações de imagem","\u002Fblog\u002Fintroducing-image-transformations\u002F1665929079-7f82bba9-f0c3-4859-8c6c-5434a417bc54.webp",[34,101,103],{"id":102},"propriedades","Propriedades",[21,105,106],{},"No lado direito fica o painel de propriedades, onde você edita a aparência do elemento selecionado. Ele tem opções como",[108,109,110,114,117,120,123],"ul",{},[111,112,113],"li",{},"Posição",[111,115,116],{},"Cor",[111,118,119],{},"Borda",[111,121,122],{},"Sombra",[111,124,125],{},"...e mais",[21,127,128,129,133,134,137],{},"Ao inserir um texto, você tem controle total. Dá para misturar texto dinâmico e estático usando tags especiais como ",[130,131,132],"code",{},"@PRICE@"," ou ",[130,135,136],{},"@TITLE@",". Você também decide como os números aparecem: arredondamento, casas decimais e separador decimal.",[21,139,140],{},[51,141],{"alt":142,"src":143,"title":142},"Conteúdo dinâmico nas transformações de imagem","\u002Fblog\u002Fintroducing-image-transformations\u002F1665929098-10c76ee0-1c81-4e6e-8928-51db2836eb6d.webp",[34,145,147],{"id":146},"condições","Condições",[21,149,150],{},"Para cada elemento, você pode aplicar condições que definem se ele aparece na imagem final. Por exemplo, você pode usar condições para mostrar elementos especiais quando o produto está em promoção.",[21,152,153],{},[51,154],{"alt":155,"src":156,"title":155},"Condições de camada nas transformações de imagem","\u002Fblog\u002Fintroducing-image-transformations\u002F1665929109-41daee5d-0c39-4c6d-9526-71c5e0edc145.webp",[34,158,160],{"id":159},"barra-de-ferramentas","Barra de ferramentas",[21,162,163],{},"Na barra de ferramentas, você insere novos elementos no editor. Por enquanto, dá para escolher entre:",[108,165,166,169,172,175,178,181],{},[111,167,168],{},"Retângulos",[111,170,171],{},"Elipses (círculos)",[111,173,174],{},"Texto",[111,176,177],{},"Polígonos",[111,179,180],{},"Imagens que você envia",[111,182,183],{},"A imagem do produto",[21,185,186],{},"No lado direito, você pode fechar o editor, escolher um produto aleatório, buscar um produto específico e salvar o template.",[21,188,189],{},[51,190],{"alt":191,"src":192,"title":191},"Barra de ferramentas das transformações de imagem","\u002Fblog\u002Fintroducing-image-transformations\u002F1665929120-4f705229-44da-4afe-8211-c2dc9feffae2.webp",[34,194,196],{"id":195},"agora-é-com-você","Agora é com você!",[21,198,199],{},"O editor ainda está em beta, então algumas coisas podem não funcionar direito.",[21,201,202],{},"Isso também significa que provavelmente vamos mudar algumas coisas antes da versão final. Adoraríamos receber a sua opinião. Está sentindo falta de algum recurso, tem algo que poderia ser melhor ou encontrou algum erro? Conte para a gente! Você pode falar com a gente pelo chat ou mandar um e-mail.",[21,204,205],{},"Vamos continuar trabalhando para deixar o editor melhor e mais poderoso. No futuro, as novas transformações de imagem vão substituir as antigas sobreposições.",{"title":207,"searchDepth":208,"depth":208,"links":209},"",2,[210,211,212,213,214,215,216,217],{"id":36,"depth":208,"text":37},{"id":57,"depth":208,"text":58},{"id":73,"depth":208,"text":74},{"id":86,"depth":208,"text":87},{"id":102,"depth":208,"text":103},{"id":146,"depth":208,"text":147},{"id":159,"depth":208,"text":160},{"id":195,"depth":208,"text":196},"2022-08-26T00:34:15+02:00","Adicione preços, selos de promoção e o seu logo em todas as imagens dos seus anúncios de catálogo com um único template e escolha onde cada elemento aparece.",false,"md","\u002Fblog\u002Fintroducing-image-transformations\u002Fhero-9197c05b-1400.webp","Ilustração da imagem de um fone de ouvido para um anúncio de catálogo, com uma etiqueta de preço NOW €89 e o logo de uma marca","\u002Fblog\u002Fintroducing-image-transformations\u002Fhero-9197c05b-1200.png","Crie um único template para adicionar preços, selos de promoção e o seu logo em todas as imagens de produto dos seus anúncios de catálogo. Veja como funciona o editor de templates.",{"source_hash":227},"acb95e8060ea",true,"\u002Fpt-br\u002Fblog\u002Fcomo-adicionar-precos-e-logos-nas-imagens-de-anuncios-de-catalogo",null,{"title":15,"description":219},"blog\u002Fpt-br\u002F2022-08-26-introducing-image-transformations",[234,36],"catalog-ads","BnRAZB3a1iNrymL-9gs4P4401cqkctYmRpy0FWIaeNw","como-adicionar-precos-e-logos-nas-imagens-de-anuncios-de-catalogo","\u002Fblog\u002Fintroducing-image-transformations",[],{"width":240,"height":241},1400,788,{"width":240,"height":243},757,{"width":240,"height":245},708,{"width":240,"height":247},758,{"width":240,"height":249},760,{"width":240,"height":251},756,{"width":240,"height":249},{"width":240,"height":254},100,1794325392129]