FROM CACHE - pt-br_header

Letras em degrade

Kennyd1
Viajante
30 2 6

Como colocar letras gradientes como essas em uma determinada página.

Kennyd1_0-1649333479206.png

 

site: Gerador de gradiente de texto (textgradients.com)

Esta é a página do meu site onde gostaria de colocar https://hman.com.br/products/carteira-inteligente 

 

Ja tentei colocar este código na parte inferior da base.css mas nao funcionou. 

8 RESPOSTAS 8
Amalia
Shopify Staff
Shopify Staff
608 237 76

Olá @Kennyd1,

 

Entendi que você pretende ter mais opções para estilizar o texto na sua loja - certo?  Como alternativa de alterar o código que, por vezes pode tornar-se um pouco complicado, encontrei algumas apps na nossa AppStore que poderá facilitar esse processo e elas são as seguintes;

 

- Font Picker 
- Unlimited Fonts 

 

A app de Font Picker é grátis e a app Unimited Fonts oferece um plano gratuito e vale a pena explorar os recursos de ambas apps. Essas apps também seriam útil se pretende modificar outros textos no seu site. 

 

Gostaria de saber mais sobre a sua visão para esse design no seu site.  Você pretende usar a gradiente no texto somente nessa pagina ou em outras paginas do seu site também?  Pergunto isso porque, notei que o estilo geral do seu site e masculino, limpo e que puxa mais para tons terrosos que acho que se encaixe bem com a sua marca e oferta de produtos. Houve algum motivo em particular pelo qual optou por cores mais vibrantes no gradiente de texto como compartilhou no seu exemplo acima?

 

Avise-me se alguma dessas apps funcionou para você!  Qualquer outra dúvida, só deixe um comentário aqui.  Até já!

Amalia | Social Care @ Shopify 
 - A minha resposta foi útil? Clique em Curtir para me dizer! 
 - Sua dúvida foi respondida? Clique em Aceitar Solução
 - Para saber mais visite nossa Central de Ajuda Shopify ou nosso Shopify Blog

Kennyd1
Viajante
30 2 6

Muito obrigado pela gentileza, instalar aplicativos é sempre complicado, mas este me parece ser leve e simples. Só um detalhe, nele não encontrei a opção de deixar a letra em degrade, sei que para isso precisa de um codigo que faz o "corte" entre o fundo e a letra. 
Mas mesmo colocando na parte css, não funcionou. 

  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;

 

Amalia
Shopify Staff
Shopify Staff
608 237 76

 

O prazer e todo meu, @Kennyd1!
 
Houve algo em particular que você achou complicado com instalar apps?  Fico feliz em esclarecer, pois, as apps existem para facilitar a gestão de uma loja virtual para você poder desfrutar esse recurso.  
 
Qual é a app que decidiu instalar? Adoraria ajudar com a configuração da app porém, como a app é desenvolvida por terceiros, nos não temos conhecimento sobre como funciona.  Por esse motivo, eu sugiro contatar o desenvolvedor da app diretamente e eles poderão ajudar com quaisquer questões.  Para documentação de suporte, informação de contato do desenvolvedor e para receber suporte, na página da app, clique na aba "Atendimento";

 

11-05-14799-43219

Espero que os desenvolvedores da app podem te ajudar a alcançar esse objetivo.  Caso não, poderá sempre tentar por modificar o código como já fez.  Vale a pena lembrar que a nossa equipe não é especializado no código e por isso, cai fora do nosso escopo de atendimento.  Como alternativa, encontrei este post na nossa Comunidade Inglesa aqui onde um lojista fez um pergunta comparada a sua e pode ajudar com essa questão.  Quando estiver a fazer modificações ao código, é sempre boa pratica fazer quaisquer ajustes numa copia do tema primeiro no caso que precisar de começar de novo e dessa forma não está a modificar o seu tema atual.

 

Até mais,

Amalia | Social Care @ Shopify 
 - A minha resposta foi útil? Clique em Curtir para me dizer! 
 - Sua dúvida foi respondida? Clique em Aceitar Solução
 - Para saber mais visite nossa Central de Ajuda Shopify ou nosso Shopify Blog

Kennyd1
Viajante
30 2 6

Ola, 

 

Eu instalei o FontPicker, bem fácil de usar, mas abaixou a nota do site em velocidade 5 pontos. 

Como o meu objetivo é fazer a letra em degrade, acabei removendo novamente. 

 

 

Kennyd1
Viajante
30 2 6

@Amalia encontrei que o próprio shopify já tem a opção do fundo gradiente. 

Só falta eu conseguir da o comando para o fundo recortar em volta da letra. 

 

-webkit-background-clip: text;
-moz-background-clip: text;
-webkit-text-fill-color: transparent;
-moz-text-fill-color: transparent;

 

Mas não esta funcionando ainda. 

Amalia
Shopify Staff
Shopify Staff
608 237 76

Que bom saber que gostou do FontPicker, @Kennyd1

 

Entendo completamente como a velocidade do seu site é uma preocupação. Qualquer código de tema, apps, vídeos e imagens, todos ocupam recursos para serem publicados no seu site. Mas é importante considerar o equilíbrio de ter um site eficiente além de ter as funções necessárias para o seu negócio.  Notou uma diferença na velocidade do seu site ou foi o resultado do teste de velocidade que o levou a decidir remover a app? Uma coisa que recomendo aqui é, fazer uma auditoria ao seu site de vez em quando e fazer um teste de velocidade e navegar no seu site para ver como é a experiência geral. Se achar a velocidade é lenta, depois poderá rever os elementos do seu site para garantir que estão atualizados e eliminar o que não precisa. Consulte o nosso guia de ajuda aqui que tem algumas boas dicas para manter o seu site super eficiente.

 

Na sua última mensagem, acredito que está se referindo as opções de cores nas configurações do tema - Configurações do tema >Cores;

 

 

 

As opções de cores disponíveis variam entre os temas e alguns podem ter opções para gradientes.  No meu exemplo acima, essas são as opções de cores disponíveis no tema Dawn e eu configurei uma gradiente como o fundo da pagina. Aqui, notara que tem uma opção para gradiente mas, só é aplicável a certos elementos designados do seu tema.    Para configurar gradientes para títulos específicos, teria que alterar o código ou utilizar uma app para ajudar com isso.   Vale a pena lembrar que nos do suporte da Shopify não somos especialistas em código então nessa parte sobre o código especificamente, não consigo aconselhar.  

 

Qual é o tema que está a usar no momento?  Pergunto isso porque, outra possibilidade que poderá considerar é usar o recurso de 60 minutos de tempo para design incluído em temas desenvolvidos pela Shopify.  Com este recurso, os nossos designers podem te ajudar a fazer pequenas modificações ao seu tema. Para te dar uma ideia dos tipos de modificações que poderá fazer, dê uma olhada neste documento aqui. Se estiver a usar um tema desenvolvido pela Shopify e pretende desfrutar este recurso, basta entrar em contato com a nossa equipe aqui e inclui uma descrição detalhada da alteração que pretende fazer além de um exemplo da modificação (tal como você compartilhou aqui na sua primeira mensagem neste fio aqui), para que eles possam analisar a solicitação mais a fundo.

 

Espero ter esclarecido!  Por favor avise-me se tiver qualquer outra dúvida.

Amalia | Social Care @ Shopify 
 - A minha resposta foi útil? Clique em Curtir para me dizer! 
 - Sua dúvida foi respondida? Clique em Aceitar Solução
 - Para saber mais visite nossa Central de Ajuda Shopify ou nosso Shopify Blog

Kennyd1
Viajante
30 2 6

Estou usando o tema padrão dawn do shopify versão 4.0.0

Amalia
Shopify Staff
Shopify Staff
608 237 76

Olá @Kennyd1,

 

Ótimo que está a usar o tema Dawn!  Nesse caso, eu recomendaria o recurso de Design Time que sugeri acima.  Basta enviar a sua questão detalhada para nossa equipe para que eles possam analisar se poderemos ajudar com essa modificação ao seu tema. 

 

Espero que isso ajude! 

Amalia | Social Care @ Shopify 
 - A minha resposta foi útil? Clique em Curtir para me dizer! 
 - Sua dúvida foi respondida? Clique em Aceitar Solução
 - Para saber mais visite nossa Central de Ajuda Shopify ou nosso Shopify Blog