Narrative

Narrative é um tema de boutique projetado para contar histórias visuais. O que torna o Narrative único é o que seu foco está no uso das imagens para contar uma história. Como padrão, a página inicial exibe uma apresentação de slides com largura total, uma imagem com texto e um vídeo. Esse layout proporciona um alto impacto visual e permite que você conte a história da sua marca sem o uso excessivo de texto.

Exemplo de loja virtual usando o Narrative

O tema Narrative é ideal se você deseja:

  • usar imagens e vídeos para contar a história da sua marca
  • compartilhar uma mensagem impactante sobre a visão, missão e valores da sua loja
  • destacar o design exclusivo de um determinado produto ou de um estoque pequeno.

Seções As seções são blocos personalizáveis de conteúdo que determinam o layout de sua loja virtual. Cada tema inclui seções estáticas e seções dinâmicas. ### Seções estáticas As seções estáticas estão sempre em locais específicos na sua loja virtual. Você pode editar seções estáticas, mas não pode reorganizá-las ou removê-las. Cada tipo de página na sua loja virtual inclui diferentes seções estáticas.

O Narrative inclui as seguintes seções estáticas:

  • Cabeçalho
  • Apresentação de slides
  • Rodapé
  • Páginas de produtos
  • Páginas de Coleções
  • Página da lista de coleções
  • Blog
  • posts
  • Página do carrinho

Seções dinâmicas Você pode adicionar, reorganizar e remover seções dinâmicas para personalizar o layout da sua página inicial. Cada tema tem um conjunto exclusivo de seções dinâmicas para escolher.

O Narrative inclui as seguintes seções dinâmicas:

  • Postagens no blog
  • Lista de coleções
  • Coleção em destaque
  • Galeria
  • Destaque
  • Imagem com texto
  • Imagem com sobreposição de texto
  • Produto em destaque
  • Newsletter
  • Mapa
  • Rich text
  • Depoimentos
  • Vídeo
  • Conteúdo personalizado
  • Controle deslizante para destaques

Cabeçalho

A seção Cabeçalho apresenta o conteúdo exibido na parte superior de todas as páginas da sua loja. O Narrative permite que você selecione dois menus de navegação que os clientes podem acessar clicando em um ícone de navegação:

Também é possível alterar a aparência do cabeçalho da loja, tornando-o transparente, para que ele use o mesmo fundo da seção abaixo dele:

Para personalizar a seção Cabeçalho:

  1. Clique na aba Seções.

  2. Clique em Cabeçalho.

  3. Na área Imagem do logotipo , clique em Selecionar imagem e execute uma das seguintes ações:

- Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.

  1. No campo Altura personalizada do logotipo (em pixels), insira a altura em pixels do logotipo.

  2. Na lista Ícone do carrinho de compras , selecione se você deseja exibir o ícone de uma bolsa ou de um carrinho no cabeçalho.

  3. Se você desejar tornar transparente o cabeçalho de sua loja, siga os passos abaixo:

    1. Clique em Habilitar cabeçalho transparente na página inicial.
    2. Selecione a imagem a ser exibida sobre o fundo transparente. Talvez seja preciso selecionar um logotipo diferente do escolhido anteriormente para ser exibido no cabeçalho. Por exemplo, talvez você precise de um logotipo branco para usar contra um fundo escuro.
    3. Clique na paleta de cores Ícones para cabeçalho transparente e selecione uma cor para a imagem do logotipo e para os ícones de navegação e carrinho.
  4. Na lista Navegação primária , selecione o menu primário exibido quando o cliente clicar no ícone de navegação:

  5. Na lista Navegação secundária , selecione o menu secundário:

  6. Clique em Salvar.

Apresentação de slides

Na parte superior da página inicial do Narrative, há uma apresentação de slides em tela inteira na qual os clientes podem clicar e visualizar uma seleção de imagens e vídeos. É melhor usar imagens muito grandes. Por exemplo, use imagens de 4000 x 2200 px ou maiores, desde que você não exceda os limites de envio da Shopify. É possível escolher como os botões e os textos serão exibidos na apresentação, que comporta até cinco imagens e vídeos.

Para incentivar os clientes a clicar na apresentação de slides, esse tema exibe botões na parte inferior da apresentação. É possível inserir uma etiqueta própria nesses botões e criar um título para cada slide:

Para adicionar uma apresentação de slides:

  1. Clique em Seções.

  2. Clique em Apresentação de slides.

  3. Na área Imagem , clique em Selecionar imagem e siga um destes procedimentos:

- Para selecionar uma imagem que você já enviou para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem. - Para selecionar uma imagem em seu computador local, clique na guia Biblioteca e, em seguida, clique em Fazer upload da imagem.

  1. No campo Etiquetas de botão , insira o texto que deve ser exibido nos botões da apresentação de slides.

  2. Para exibir uma sobreposição, que aplica um filtro de cor na apresentação de slides, selecione Exibir sobreposição.

  3. Clique na paleta de cores para selecionar uma Cor de sobreposição e uma Cor de texto.

  4. Na lista Opacidade , selecione um nível de transparência para a sobreposição de cor.

Para adicionar um slide de imagem:

  1. Na área Conteúdo , clique em Adicionar conteúdo.

  2. Clique em Slide de imagem.

  3. Na área Imagem , clique em Selecionar imagem e siga um destes procedimentos:

- Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.

  1. Na lista Alinhamento de imagem , selecione, entre as posições disponíveis, o alinhamento desejado para a imagem da apresentação de slides.

  2. No campo Título , insira um novo título para esse slide. Na apresentação de slides, o título aparece sobreposto à imagem.

  3. No campo Título do slide , insira o texto que será exibido como título do slide na parte inferior da apresentação.

  4. Para adicionar um link ao botão do slide, execute uma das ações a seguir:

- Para incluir um link para uma página da loja, clique no campo Link de botão e selecione uma página. - Para vincular o texto do título a uma URL, cole a URL no campo Link do botão.

  1. Clique em Salvar.

Para adicionar um slide de vídeo:

  1. Na área Conteúdo , clique em Adicionar conteúdo.

  2. Selecione Slide de vídeo.

  3. No campo Link do vídeo , insira o endereço da URL do vídeo.

  4. Para carregar uma imagem que será exibida se a reprodução automática não for compatível com o dispositivo móvel, na área Imagem , clique em Selecionar imagem e siga um destes procedimentos:

- Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.

  1. No campo Título , insira o texto que deve ser sobreposto ao vídeo. O título é atualizado com o texto fornecido por você.

  2. No campo Título do slide , insira o texto que será exibido como título do slide na parte inferior da apresentação.

  3. Para adicionar um link ao botão do slide, execute uma das ações a seguir:

- Para incluir um link para uma página da loja, clique no campo Link de botão e selecione uma página. - Para vincular o texto do título a uma URL, cole a URL no campo Link do botão. - Clique em Salvar.

Rodapé

O rodapé da sua loja é o conteúdo que sempre aparece na parte inferior de todas as páginas da sua loja:

Com o Narrative, é possível:

  • adicionar um segundo menu
  • adicionar um formulário para assinatura da newsletter
  • exibir ou ocultar os ícones de pagamento com os gateways de pagamentos aceitos
  • exibir ou ocultar os ícones de redes sociais.

Para personalizar a seção de rodapé:

  1. Clique na aba Seções.

  2. Clique na seção Rodapé.

  3. Se você deseja exibir ícones vinculados a suas contas nas redes sociais, marque Exibir ícones de redes sociais. Clique aqui para saber como disponibilizar links para suas contas nas redes sociais.

  4. Se você deseja exibir ícones de gateways de pagamento, como Mastercard ou Paypal, selecione Exibir ícones de pagamento.

  5. Se você deseja adicionar um meni ao rodapé, siga os passos abaixo:

    1. Clique em Adicionar conteúdo e, depois, em Menu.
    2. No menu Rodapé , selecione o menu que deve ser exibido.
  6. Se você deseja adicionar um link para a newsletter no rodapé, siga os passos abaixo:

    1. Clique em Adicionar conteúdo e, depois, em Newsletter.
    2. No campo Título , insira o texto que deve ser exibido. Como padrão, o texto é "Assine e receba atualizações."
    3. No campo Texto do botão , insira o texto que deve ser exibido no botão. Como padrão, o texto é "OK".
  7. Clique em Salvar.

Páginas de produtos

Na seção Páginas de produto , você pode adicionar ou remover os seguintes elementos:

  • Um seletor de quantidade
  • Etiquetas de variantes
  • A marca ou fornecedor do produto
  • Imagens de variantes
  • Um botão de checkout dinâmico
  • Botões de compartilhamento em redes sociais

Para editar as configurações das páginas de produtos:

  1. No menu suspenso da barra superior, selecione Páginas de produto.

  2. Clique em Seções.

  3. Clique em Páginas de produtos.

  4. Para mostrar um seletor de quantidade, marque Exibir seletor de quantidade.

  5. Para mostrar as etiquetas das variantes, como "Tamanho" e "Cor", marque Exibir etiquetas das variantes. As etiquetas das variantes exibidas são baseadas nos nomes das opções das variantes do produto.

  6. Para mostrar a marca ou o fornecedor do produto, marque Exibir fornecedor do produto. Para uma marca ou fornecedor aparecer, você precisa adicionar um fornecedor ao produto.

  7. Para evitar que imagens de variantes sejam exibidas na galeria localizada na parte inferior da página, marque Ocultar imagens de variantes na galeria. Ao selecionar essa opção, as únicas imagens exibidas são aquelas que não estão vinculadas a uma variante.

  8. Para mostrar um botão de checkout dinâmico, marque Mostrar botão de checkout dinâmico.

  9. Para mostrar os botões de compartilhamento em redes sociais, marque Exibir botões de compartilhamento em redes sociais.

  10. Clique em Salvar.

Páginas de Coleções

É possível configurar as páginas de coleção para permitir que os clientes filtrem e ordenem os produtos em exibição. Além disso, você pode selecionar o número de produtos exibidos.

Para definir o layout das suas páginas de coleções:

  1. Navegue até uma página de coleção no editor de temas.

  2. Clique na aba Seções.

  3. Clique em Páginas de coleções.

  4. Nas listas, selecione o número de produtos por linha e o número de linhas por página.

  5. Se você vende produtos de diferentes marcas ou fornecedores, marque Exibir fornecedor do produto para exibir o nome abaixo da imagem do produto.

  6. Se desejar exibir uma imagem da coleção na parte superior da página, marque Exibir imagem da coleção.

  7. Marque Ativar filtragem de tags para permitir que seus clientes filtrem a coleção por tag de produto.

  8. Marque Habilitar classificação de coleção para exibir o menu de classificação.

  9. Clique em Salvar.

Página do carrinho

Com o Narrative, é possível permitir que os clientes adicionem observações aos pedidos:

  1. Acesse a página do carrinho no editor de temas.

  2. Clique na aba Seções.

  3. Clique em Página do carrinho.

  4. Marque Ativar observações do carrinho.

  5. Clique em Salvar.

Coleção em destaque

Você pode destacar uma coleção na sua página inicial. Destacar coleções pode ajudar você a promover vendas e novas coleções.

Para adicionar uma coleção em destaque:

  1. Clique na aba Seções.

  2. Clique em Coleção em destaque.

  3. Na lista Coleção , selecione a coleção que deve ser exibida.

  4. Marque Habilitar espaçamento entre imagens para aumentar a distância entre as imagens.

  5. No campo Título , insira o texto que deve aparecer na parte superior dessa seção. Como padrão, o texto é "Coleção em destaque".

  6. Para exibir o nome do fornecedor ou da marca abaixo da imagem de cada produto, selecione Exibir fornecedor do produto.

  7. Para permitir que os clientes visualizem todos os produtos da coleção, marque Exibir botão "Visualizar tudo". Quando o cliente clicar nesse botão, a página da coleção é aberta com todos os produtos em exibição.

  8. Para que o botão Visualizar tudo seja transparente e com contorno sólido, marque Usar estilo de botão secundário.

  9. Na lista Produtos por linha , selecione o número de produtos a serem exibidos em cada linha.

  10. Na lista Linhas , selecione o número de linhas de produtos a serem exibidas.

  11. Clique em Salvar.

Galeria

A seção Galeria apresenta uma série de até três imagens. É possível selecionar um ícone de uma lista com 13 ícones personalizados para exibição sobreposta a cada uma das imagens. Como opção, é possível vincular cada imagem a uma página da loja ou URL.

A seção Galeria com três fotos de gatos lado a lado.

  1. Clique na aba Seções.

  2. Clique em Galeria.

  3. Na área Conteúdo , clique em Imagem.

  4. Para adicionar a imagem, na área Imagem , clique em Selecionar imagem e, em seguida, em uma das opções abaixo:

- Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.

  1. Na lista Alinhamento de imagem , selecione o alinhamento desejado para a imagem. Por exemplo, selecione "Superior-esquerdo" para colocar a imagem na área superior-esquerda da seção.

  2. Na lista Ícone , selecione um ícone para exibição sobreposto à imagem.

  3. No campo Legenda da área Texto , insira o texto que deve ser exibido em cada imagem.

  4. Para vincular uma legenda a uma página, siga os passos abaixo:

    1. Para vincular o texto a uma página da loja, clique no campo Link e selecione uma das páginas.
    2. Para vincular a um site, insira a URL do site no campo Link.
  5. Clique em Salvar.

Imagem com texto

O Narrative apresenta a seção Imagem com texto , que permite exibir uma imagem com uma mensagem personalizada para os clientes.

É possível cortar uma imagem em formato circular

ou quadrado:

Você também pode optar por não cortar a imagem. Em vez disso, selecione um alinhamento de imagem para garantir que partes importantes não sejam cortadas quando exibidas em dispositivos móveis. Por exemplo, se você deseja evitar que a parte inferior de sua imagem seja cortada, pois ela exibe o produto à venda, selecione o alinhamento Bottom center para garantir que aquela parte da imagem nunca seja cortada.

  1. Clique na aba Seções.

  2. Clique em Imagem com texto.

  3. Na lista Espaçamento de seção , selecione o tamanho desejado para a seção: Pequeno , Médio , Grande ou Extragrande.

  4. Se você deseja adicionar uma cor de fundo, clique na amostra de Cor de fundo e selecione uma das cores da paleta.

  5. Para adicionar a imagem, na área Imagem , clique em Selecionar imagem e, em seguida, em uma das opções abaixo:

- Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.

  1. Se você deseja cortar as imagens em um formato específico, selecione Circular ou Quadrado na lista Corte de imagem.

  2. Se você não deseja cortar as imagens em um formato específico, siga os passos abaixo:

    1. Na lista Corte de imagem , selecione Nenhum.
    2. Na lista Alinhamento de imagem , selecione o alinhamento desejado para a imagem. Por exemplo, selecione "Superior-esquerdo" para colocar a imagem na área superior-esquerda da seção.
  3. Para adicionar texto, siga os passos abaixo:

    1. No campo Título , digite o texto que deve ser exibido.
    2. No campo Texto , digite o texto que deve ser exibido abaixo do título.
    3. Se você deseja que o botão seja transparente e com contorno sólido, selecione Usar estilo de botão secundário.
    4. No campo Rótulo do botão , insira o texto que você deseja que apareça no botão.
    5. No campo Link de botão , cole um link para uma URL ou clique no campo para selecionar uma página da loja.

Para personalizar o layout:

  1. Na área Layout , na lista Layout para desktop , selecione se a imagem deve aparecer à esquerda ou à direita do texto quando for exibida em desktops.

  2. Na lista Layout para dispositivo móvel , selecione se a imagem deve aparecer acima ou abaixo do texto quando for exibida em um dispositivo móvel.

Imagem com sobreposição de texto

Na página inicial, é possível exibir uma mensagem personalizada. Descreva um produto, compartilhe um comunicado ou dê boas-vindas aos seus clientes.

Para personalizar a seção Imagem com sobreposição de texto:

  1. Clique na aba Seções.

  2. Clique em Imagem com sobreposição de texto.

  3. Na lista Espaçamento de seção , selecione o tamanho desejado para a seção: Pequeno , Médio , Grande ou Extragrande.

Para adicionar uma imagem de fundo

  1. Na área Imagem , clique em Selecionar imagem e siga um destes procedimentos:

- Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.

  1. Na lista Alinhamento de imagem , selecione o alinhamento desejado para a imagem. Por exemplo, selecione "Superior-esquerdo" para colocar a imagem na área superior-esquerda da seção.

Para adicionar o texto:

  1. No campo Título da área Texto , insira um título para essa seção.

  2. No campo Texto , insira o texto que deve ser exibido nessa seção.

  3. Na lista Tamanho de texto , escolha entre Médio e Grande.

Para adicionar um botão:

  1. Se você deseja que o botão seja transparente e com contorno sólido, selecione Usar estilo de botão secundário.

  2. No campo Rótulo do botão , insira o texto que você deseja que apareça no botão.

  3. No campo Link de botão , cole um link para uma URL ou clique no campo para selecionar uma página da loja.

Para aplicar uma sobreposição:

  1. Na área Sobreposição , marque Exibir sobreposição.

  2. Clique na amostra de Cor para sobreposição e selecione uma cor para sobrepor à imagem.

  3. Clique na amostra de Cor de texto para selecionar uma cor para o texto.

4. Na lista **Opacidade** , selecione um nível de transparência para a sobreposição de cor. ## Mapa É possível incluir um mapa na página inicial. Este recurso ajuda a promover a localização e o horário de funcionamento da sua loja. Para adicionar um mapa: 1. Clique na aba **Seções** e selecione **Adicionar seção**. 2. Clique em **Mapa**. 3. No campo **Título da sobreposição** , insira o texto que deve ser exibido na parte superior dessa seção. 4. No campo **Texto com endereço e horário** , insira as informações comerciais da sua empresa. 5. No campo **Endereço do mapa** , insira o endereço da empresa. 6. No campo **Chave da API do Google Maps** , insira uma [chave da API válida](/manual/using-themes/change-the-layout/theme-settings/map-section-api-key). 7. No campo **Imagem** , envie ou selecione a imagem que deve ser exibida se houver um problema com o carregamento da seção do mapa. ## Controle deslizante para destaques O controle deslizante em destaque permite a exibição de mais informações sobre produtos sem que o cliente tenha que deixar a página inicial.
É possível apresentar recursos de produtos, uma nova coleção ou variantes de um produto específico. A apresentação funciona melhor com um número pequeno de slides, já que a rolagem da página fica bloqueada durante a navegação do conjunto em desktops. Para ser aberto ou visualizado em dispositivos móveis, o controle deslizante em destaque requer um toque ou gesto de pinça. Para que os clientes em dispositivo móveis abram o controle, use uma imagem de capa chamativa e textos que "incentivem a tomada de ação". É possível adicionar até cinco slides ao controle deslizante em destaque. ### Para personalizar o controle deslizante em destaque: 1. Clique na aba **Seções**. 2. Clique em **Controle deslizante em destaque**. ### Para adicionar um slide de imagem: 1. Na área **Conteúdo** , clique em **Slide**. 2. Clique na amostra de **Cor de fundo** para selecionar uma cor da paleta. 3. Na área **Imagem** , clique em **Selecionar imagem** e siga um destes procedimentos: - Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba **Biblioteca**. - Para selecionar uma imagem da [Coleção de imagens de acervo Burst da Shopify](https://burst.shopify.com/), clique na aba **Imagens gratuitas**. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem. - Para selecionar uma imagem de seu computador local, clique na aba **Biblioteca** e, em seguida, no sinal de mais. 4. No campo **Título** , digite o texto que deve ser exibido sobreposto ao slide. 5. No campo **Etiqueta de botão** , digite o texto que deve aparecer no botão. 6. No campo **Link de botão** , cole um link para uma URL ou clique no campo para selecionar uma página da loja. ### Para personalizar as configurações do controle deslizante em destaque:
  1. Para que os botões do slide sejam transparentes e com contorno sólido, marque Usar estilo de botão secundário.

  2. Para alterar a cor do texto, clique a amostra de Cor do título do slide e selecione uma das cores da paleta.

  3. Na área Configurações de capa , escolha a capa da seção do controle deslizante em destaque clicando em Selecionar imagem e seguindo os passos abaixo:

- Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.

  1. Na lista Cabeçalho , insira o texto que deve aparecer na imagem de capa.

  2. Na lista Posição do título , selecione se o texto deve ser exibido à esquerda ou no centro da imagem de capa. Esta configuração só se aplica à visualização em desktops.

  3. Na área Sobreposição , marque Exibir sobreposição.

  4. Clique na amostra de Cor para sobreposição e selecione uma cor para sobrepor à imagem.

  5. Clique na amostra de Cor de texto para selecionar uma cor.

  6. Na lista Opacidade , selecione um nível de transparência para a sobreposição de cor.

  7. Clique em Salvar.

O Narrative inclui as seguintes configurações de tema:

  • Cores
  • Tipografia
  • Painel deslizante do carrinho
  • Redes sociais
  • Favicon
  • Checkout

Cores

Você pode escolher as cores para as diferentes partes de sua loja virtual.

  1. Clique em Configurações do tema.

  2. Clique em Cores.

  3. Para cada tipo de conteúdo, clique na amostra de cor para usar o seletor de cores:

    O seletor de cores no editor de temas

- A área Selecionadas recentemente mostra as cores que você selecionou recentemente para o seu tema. - A área Em uso mostra as cores que você está usando no momento em outras partes do seu tema.

Para definir a cor como transparente, clique em Nenhum.

  1. Clique em Salvar.

Tipografia

Você pode escolher a tipografia para o texto em sua loja virtual.

Para personalizar a tipografia:

  1. Encontre Narrative e clique em Personalizar.

  2. Clique em Configurações do tema.

  3. Clique em Tipografia.

  4. Para cada tipo de texto, clique em Alterar para usar o seletor de fontes:

    O botão 'Alterar' no seletor de fontes

  5. Explore as fontes usando o campo de pesquisa ou clicando em Carregar mais.

    Para ver todas as fontes disponíveis, confira a biblioteca de fontes da Shopify.

  6. Clique no nome da fonte que você deseja usar.

  7. Para alterar a fonte para um estilo diferente, como negrito ou itálico, clique em Regular. Em seguida, clique no estilo que você deseja usar e, em seguida, clique em Selecionar :

    Uma seleção de pesos de fonte disponíveis no seletor de fontes

  8. Clique em Salvar.

Painel deslizante do carrinho

Você tem a opção de exibir um painel lateral para o carrinho em vez de uma página inteira dedicada a ele. O painel do carrinho aparece e desaparece pelo lado direito e permite que seus clientes o visualizem sem sair da página atual. Também é possível exibir um campo onde os clientes podem deixar observações na página do carrinho.

Para definir as opções do painel deslizante do carrinho:

  1. Clique em Personalizar.

  2. Clique na guia Configurações do tema.

  3. Clique em Carrinho.

  4. Para exibir o carrinho como um painel deslizante, selecione Exibir painel deslizante do carrinho.

  5. Para permitir que seus clientes deixem observações no carrinho, selecione Exibir observações sobre o carrinho.

  6. Clique em Salvar.

Redes sociais

Você pode adicionar botões de compartilhamento social para seus produtos e postagens de blog e links para suas contas de mídias sociais.

Para personalizar as configurações de mídias sociais:

  1. Encontre Narrative e clique em Personalizar.

  2. Clique em Configurações do tema.

  3. Clique em Redes sociais.

  4. Para enviar uma imagem de compartilhamento social, na área de imagem de compartilhamento social , clique em Selecionar imagem ou Explorar imagens gratuitas.

  5. Para adicionar botões de compartilhamento social aos seus produtos e postagens de blog, na área de compartilhamento social , marque uma ou todas as caixas de seleção.

    Você pode adicionar os seguintes botões de compartilhamento:

- Compartilhar no Facebook - Tweetar - Fixar no Pinterest (não disponível para postagem no blog)

  1. Para adicionar links às suas contas de mídia social, na área Contas , insira os links para suas contas nos campos fornecidos. Insira os links completos, como https://instagram.com/shopify ou https://twitter.com/shopify.

    Os links para suas contas de mídias sociais são exibidos no rodapé de sua loja virtual.

  2. Clique em Salvar.

Obs.: Para mostrar botões de compartilhamento social em páginas de produtos e postagens de blog, você também precisa ativar os botões nas seções dessas páginas.

Favicon

É possível carregar um ícone de favoritos ou "favicon", ampliando a visibilidade da sua marca ao exibir o logotipo da loja virtual nos seguintes locais:

  • na aba do navegador da Web
  • no histórico do navegador da Web
  • nos ícones da área de trabalho
  • ao lado do nome da loja virtual após inclusão nos favoritos.

O melhor tamanho de imagem para o favicon no Narrative é 32 x 32 pixels.

Para enviar um favicon:

  1. Clique em Personalizar.

  2. Clique na guia Configurações do tema.

  3. Clique em Favicon.

  4. Na área Imagem do favicon , clique em Selecionar imagem e, em seguida, execute uma das seguintes ações:

- Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.

  1. Clique em Salvar.

Checkout

É possível personalizar a sua página de finalização de pedido para incluir o seguinte:

  • um banner com imagem personalizada na parte superior da página
  • o logotipo da sua loja
  • uma imagem de fundo ou cor na área principal de conteúdo
  • fontes de texto e cores personalizadas.

Para ver suas alterações à medida que você as aplica, vá para a sua página de checkout no editor de temas.

Para acessar as configurações da página de checkout:

  1. Clique em Personalizar.

  2. Clique na guia Configurações do tema.

  3. Clique em Checkout.

Para adicionar uma imagem de banner:

  • Na área do Banner , clique em Selecionar imagem e, em seguida, escolha um desses caminhos: - Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca.
    • Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem.
    • Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.

Para adicionar um logotipo:

  1. Na área Logotipo , clique em Selecionar imagem e siga um destes procedimentos:

- Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.

  1. Na lista Posição , selecione onde deseja que a imagem seja exibida - direita, esquerda ou centro.

  2. Na lista Tamanho do logotipo , selecione um tamanho de logotipo.

Para alterar o plano de fundo da página de checkout:

Exiba uma imagem de fundo na página de checkout ou escolha uma cor de fundo. As imagens de fundo serão exibidas em um padrão de grade.

  1. Na área Conteúdo principal , clique em Selecionar imagem e, em seguida, execute uma das seguintes ações:

- Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais. - Clique na amostra de Cor de fundo para selecionar uma nova cor em uma paleta.

  1. Na lista Campos de formulário , selecione se os campos serão brancos ou transparentes.

Para alterar o plano de fundo da página de Resumo do pedido:

  1. Na área Imagem , clique em Selecionar imagem e siga um destes procedimentos: - Para selecionar uma imagem que você já tenha carregado para o admin da Shopify, clique na aba Biblioteca.
    • Para selecionar uma imagem da Coleção de imagens de acervo Burst da Shopify, clique na aba Imagens gratuitas. Lá é possível inserir um termo para pesquisa ou navegar por categorias de imagem.
    • Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no sinal de mais.
    • Clique na amostra de Cor de fundo para selecionar uma nova cor em uma paleta.

Para definir opções de fonte:

  • Em Tipografia , selecione a fonte a ser usada para o título e o corpo do texto nas listas.

Para definir opções de cores:

  • Na área Cores , clique nas amostras de cores Destaques , Botões ou Erros para escolher uma nova cor em uma paleta.

Alterar estilo do tema

Você pode redefinir as configurações gerais do seu tema para os valores padrão. Quando você redefine o estilo do seu tema, todas as alterações feitas na guia Configurações gerais serão perdidas, mas você não perderá conteúdo, como texto e imagens.

  1. Clique na guia Configurações gerais.

  2. Clique em Alterar estilo do tema.

  3. Clique no botão abaixo de Alterar o estilo do tema. O nome desse botão geralmente é o nome do tema.

  4. Clique em Alterar estilo.

Pronto(a) para começar a vender com a Shopify?

Experimente de graça