Simple

Simple é um tema limpo e minimalista, perfeito para exibir produtos. Os recursos incluem um design responsivo de prioridade a dispositivos móveis, navegação na barra lateral, animações de imagem e zoom de imagem do produto.

Exemplo de loja virtual usando o Simple

O tema Simple é ideal se você tem:

  • Navegação lateral
  • Menus extensos
  • Mais de 5 produtos

Editor de temas

Use o editor de temas para personalizar seu tema. A barra de ferramentas do editor de temas se divide em Seções e Configurações do tema.

A barra de ferramentas do editor de temas mostrando Seções e Configurações do tema

Você pode usar seções para modificar o conteúdo e o layout das diferentes páginas da sua loja. Você pode usar as configurações de tema para personalizar as fontes e cores da sua loja e fazer alterações nos seus links de mídia social e configurações de checkout.

As seções são blocos personalizáveis que determinam o layout de diferentes páginas da sua loja virtual.

  • As seções de início apresentam recursos que você pode adicionar, reorganizar ou remover, como apresentação de slides ou área para assinatura de newsletter. Você pode ter até 25 seções em sua página inicial.

  • Cada tipo de página tem suas próprias seções. Por exemplo, a seção de página de produto estabelece o layout de cada página de produto de sua loja virtual.

  • As seções da página estão sempre em locais específicos da sua loja virtual. Você pode personalizá-las, mas não pode reorganizá-las nem removê-las.

  • Cada tema apresenta seções fixas que são exibidas em todas as páginas de sua loja virtual, como o cabeçalho e o rodapé.

Você pode saber mais sobre a seleção exclusiva de seções de e aprender a personalizá-las para se adequarem à sua empresa.

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

  • Cabeçalho
  • Menu lateral
  • Rodapé
  • Páginas de produtos
  • Páginas de Coleções
  • Página da lista de coleções
  • Páginas do artigo

Seções dinâmicas

Você pode adicionar, reorganizare removerseçõ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 Simple inclui as seguintes seções dinâmicas:

  • Posts do blog
  • Lista de coleções
  • Coleção em destaque
  • Banner em destaque
  • Imagem com texto
  • Apresentação de slides
  • Produto em destaque
  • Newsletter
  • Mapa
  • Rich text
  • Vídeo
  • HTML personalizado

Cabeçalho

É possível adicionar o logotipo de sua empresa no cabeçalho da loja. O Simple permite usar até mesmo um logotipo personalizado. O melhor formato é um arquivo .png de fundo transparente. As imagens de logotipo devem ter 450 x 200 pixels. Você pode redimensionar a imagem do logotipo ajustando a largura.

Para enviar um logotipo personalizado:

  1. Na seção Simple, clique em Personalizar.

  2. Clique na aba Seções.

  3. Clique em Cabeçalho.

  4. 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 no admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no botão de mais.

  1. No campo Largura do logotipo personalizado (em pixels), insira a largura do logotipo.

  2. Na área Slogan, adicione o texto que deve ser exibido no canto superior direito do cabeçalho.

  3. Clique em Salvar.

O Simple apresenta uma barra lateral com um menu de navegação:

  1. Na seção Simple, clique em Personalizar.

  2. Clique na aba Seções.

  3. Clique em Barra lateral.

  4. Na lista Menu, selecione um menu para a barra lateral.

  5. Clique em Salvar.

Rodapé

O tema Simple disponibiliza um rodapé onde você pode exibir um menu de navegação, uma área de texto e um formulário para assinatura de sua newsletter. Como padrão, o Simple inclui uma seção na página inicial:

  • Links contém os links do menu de navegação.

Com o Simple, é possível exibir links no rodapé da página inicial.

  1. Na seção Simple, clique em Personalizar.

  2. Clique na aba Seções.

  3. Clique em Rodapé.

  4. Clique em Links.

  5. No campo Título, digite o texto que deve ser exibido acima dos links do rodapé.

  6. Na lista Menu, selecione um menu para os links do rodapé.

  7. Clique em Salvar.

Newsletter

O Simple possibilita que você exiba um formulário para assinatura de sua newsletter na página inicial. Esse tipo de seção não inclui nenhuma opção. Se você deseja exibir um formulário de newsletter, deixe a seção como está. Se não quiser exibir um formulário de newsletter, você pode excluir a seção da sua página inicial.

Quando alguém assina uma newsletter, é adicionado à sua loja como cliente. A seção Newsletter inclui um link para sua página Clientes no seu admin. Você pode clicar nesse link para ver uma lista atualizada dos seus clientes.

  1. Na seção Simple, clique em Personalizar.

  2. Clique na aba Seções.

  3. Clique em Rodapé.

  4. Clique em Adicionar conteúdo e, depois, em Assinatura da Newsletter.

  5. Clique em Salvar.

Texto

Utilize a seção Texto para adicionar conteúdo escrito no rodapé ou para inserir páginas criadas no admin da Shopify. Por exemplo, é possível dar destaque a eventos futuros ao incorporar a página de seu blog ou exibir uma página com qualquer um dos recursos a seguir:

  1. Na seção Simple, clique em Personalizar.

  2. Clique na aba Seções.

  3. Clique em Rodapé.

  4. Clique em Adicionar conteúdo e, depois, em Texto.

  5. No campo Título, insira o texto que deve ser exibido acima do Rich Text.

  6. Para adicionar texto, insira o conteúdo desejado no campo Texto. Clique nos ícones de negrito ou itálico para formatar o texto selecionado.

  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
  • A marca ou fornecedor do produto
  • Ícones de compartilhamento social
  • Abas na descrição do produto
  • Zoom de imagem
  • Um botão de checkout dinâmico
  • Recomendações de produtos

Também é possível definir a posição da descrição do produto.

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 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.

  6. Para exibir ícones de compartilhamento em redes sociais, marque Habilitar o compartilhamento de produtos.

  7. Para definir a posição da descrição do produto, selecione À direita das imagens ou Abaixo das imagens no menu suspenso Posição.

  8. Para usar abas em sua descrição do produto, siga os passos abaixo:

    1. Marque Exibir uma aba ao lado da descrição do produto. Com isso, uma aba exibe a descrição do produto e outra apresenta o conteúdo adicional, como uma tabela de medidas ou a política de devolução.
    2. Na área Conteúdo da aba, clique em Selecionar página e escolha uma página com o conteúdo que deve ser exibido na segunda aba.
  9. Para selecionar o tipo de zoom usado na imagem em destaque, selecione Caixa de luz, Aplicar zoom ou Sem zoom no menu suspenso Tipo de zoom.

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

  11. Clique em Salvar.

Adicionar ou remover recomendações de produtos

Você pode Exibir produtos recomendados em páginas de produto para facilitar aos clientes a descoberta de outros produtos que possam interessá-los.

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

  2. Clique em Recomendações de produto.

  3. Use a caixa de seleção Mostrar recomendações dinâmicas para mostrar ou ocultar recomendações de produtos em suas páginas de produtos.

  4. Opcional: para alterar o título que aparece acima dos produtos recomendados, insira outro no campo Título.

  5. Opcional: para mostrar o fornecedor do produto nas recomendações do produto, selecione Mostrar fornecedor do produto.

  6. 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 da coleção.

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. Para exibir o nome dos fornecedores dos produtos, selecione Exibir fornecedor do produto.

  5. Selecione Habilitar classificação de coleção para exibir o menu de classificação.

  6. Selecione Ativar filtragem por tag de produto para permitir que seus clientes filtrem a coleção pelas tags dos produtos.

  7. Clique em Salvar.

Coleção em destaque

Ao usar o Simple, você pode destacar produtos de uma das suas coleções na sua página inicial. Escolha um cabeçalho e o número de fileiras a serem exibidas para a coleção em destaque na sua página inicial.

  1. Na seção Simple, clique em Personalizar.

  2. Clique na aba Seções.

  3. No campo Título, insira o texto que você deve ser exibido acima da coleção.

  4. Na lista Coleção, selecione uma coleção. A coleção selecionada exibirá até 50 produtos.

  5. Na lista Número de fileiras, selecione o número de fileiras de produtos a serem exibidas.

  6. Clique em Salvar.

Com este tema, você pode adicionar um banner para destacar uma imagem na sua página inicial. Também é possível adicionar um cabeçalho e um link de imagem:

Para adicionar um banner em destaque à sua página inicial:

  1. Na seção Simple, clique em Personalizar.

  2. Clique em Seções.

  3. Clique em Adicionar seção.

  4. Clique em Banner em destaque e, depois, em Adicionar.

  5. No campo Tútulo, insira um novo título para esse banner.

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

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

  1. No campo Link da imagem, selecione uma página na loja para onde a imagem redirecionará o cliente.

  2. Clique em Salvar.

Imagem com texto

Com o Simple, é possível adicionar uma imagem com texto exibido à direita ou à esquerda da imagem. Você também pode adicionar um botão com link para uma página da loja:

Normalmente, você usaria uma seção Imagem com texto para promover um produto ou coleção, ou levar tráfego do site para a página do seu blog.

Para adicionar uma seção de imagem com texto à sua página inicial:

  1. Na seção Simple, clique em Personalizar.

  2. Clique na aba Seções.

  3. Clique em Adicionar seção.

  4. Clique em Imagem com texto e, em seguida, em Adicionar.

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

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

  1. Na lista Layout, selecione se deseja que a imagem apareça à direita ou à esquerda do texto.

  2. Digite um novo título para esta seção no campo Título.

  3. Digite o texto que você deseja exibir abaixo do título no campo Texto.

  4. No campo Etiqueta do botão, insira o texto que deve ser exibido no botão.

  5. No campo Link do botão, selecione uma página na loja para onde o botão fará link.

  6. Clique em Salvar.

Apresentação de slides

Você pode criar uma apresentação de slides da página inicial que rode até seis imagens.

A seção de apresentação de slides no tema Simples

O tamanho recomendado para as imagens dos slides é de 1280 x 460 pixels.

A seção de apresentação de slides apresenta as seguintes configurações:

  • Altura do slide - Defina a altura da apresentação de slides. Selecione Adaptar à altura da imagem do primeiro slide para basear a altura da apresentação de slides na altura de sua primeira imagem.
  • Rotação automática de slides - defina como automática a apresentação de slides.
  • Alterar slides a cada - selecione a frequência de alteração dos slides.
  • Efeito de transição - Selecione se deseja que as imagens deslizem ou desapareçam.
  • Tamanho do texto - Defina o tamanho de seu texto de apresentação dos slides.
  • Imagem - adicione um slide de imagem à sua apresentação de slides.
  • Posição da imagem - Escolha a área mais importante da imagem para focar na apresentação de slides.
  • Opacidade da sobreposição - Defina a opacidade da sobreposição da imagem. Uma sobreposição escurece a aparência de suas imagens e pode facilitar a leitura do texto da apresentação de slides.
  • Cor do texto - Defina a cor do texto da apresentação de slides.
  • Alinhamento de texto - Alinha o texto relativo aos slides.
  • Cabeçalho - Adicione um cabeçalho ao seu slide.
  • Etiqueta do botão - Adicione um botão com uma etiqueta de texto ao seu slide.
  • Link do botão - Vincule o botão a outra parte da sua loja virtual.

Adicione uma apresentação de slides à sua página inicial:

  1. Encontre Simple e clique em Personalizar.

  2. Clique em Apresentação de slides.

  3. Utilize as configurações para personalizar a apresentação de slides.

  4. Clique em Salvar.

Newsletter

Você pode adicionar uma assinatura de newsletter à sua página inicial. Isso permite coletar endereços de e-mail de clientes para campanhas de marketing por e-mail. Saiba mais sobre marketing por e-mail no blog da Shopify.

A seção de newsletter em um site. Há um campo para os clientes inserirem um endereço de e-mail e um botão que diz

Para adicionar uma assinatura de newsletter à sua página inicial:

  1. Encontre Simple e clique em Personalizar.

  2. Clique em Seções.

  3. Clique em Adicionar seção > Newsletter.

  4. Insira um título para a assinatura de newsletter no campo Título. O título padrão é "Assine nossa newsletter".

  5. Insira um subtítulo para a assinatura de newsletter no campo Subtítulo. O texto padrão é "Promoções, novos produtos e vendas. Diretamente em sua caixa de entrada."

  6. Clique em Salvar.

Rich text

Utilize a seção Rich text para adicionar conteúdo escrito à página inicial ou para inserir páginas criadas no admin da Shopify. Por exemplo, é possível dar destaque a eventos futuros ao incorporar a página de seu blog ou exibir uma página com qualquer um dos recursos a seguir:

  1. Na seção Simple, clique em Personalizar.

  2. Clique em Seções.

  3. Clique em Adicionar seção.

  4. Clique em Rich text e, depois, em Adicionar.

  5. Se você deseja adicionar texto, clique em Rich Text e insira-o no campo Texto. Clique nos ícones de negrito ou itálico para formatar o texto selecionado.

  6. Se você deseja dar destaque para um página de sua loja, clique em Adicionar conteúdo e, em seguida, em Página. No menu suspenso, selecione uma página para destacar como sua página inicial.

  7. No campo Título, insira o texto que deve ser exibido acima do Rich Text.

  8. Clique em Salvar.

Vídeo

Você pode adicionar um vídeo hospedado no YouTube ou no Vimeo à sua página inicial. Os vídeos podem envolver seus clientes e gerar interesse em seus negócios.

Para adicionar um vídeo à sua página inicial:

  1. Encontre Simple e clique em Personalizar.

  2. Clique em Seções.

  3. Clique em Adicionar seção > Vídeo.

  4. Insira um título para o vídeo no campo Título.

  5. Insira o link de compartilhamento para o vídeo no campo Link para o vídeo.

    Os links de compartilhamento do YouTube são como este: https://youtu.be/OTJXAUZY9t0. Você pode obter informações sobre como copiar o link de compartilhamento para um vídeo do YouTube neste artigo da Ajuda do YouTube.

    Os links de compartilhamento do Vimeo são como este: https://vimeo.com/281332510. Você pode obter informações sobre como copiar o link de compartilhamento para um vídeo do Vimeo neste artigo do Centro de Ajuda do Vimeo.

  6. Clique em Salvar.

HTML personalizado

Na seção HTML personalizado, você pode usar o código HTML para criar conteúdo personalizado para sua página inicial. Por exemplo, você pode usar HTML para formatar blocos de texto, criar tabelas ou incorporar conteúdo de um site de terceiros.

Para adicionar HTML personalizado à sua página inicial:

  1. Encontre Simple e clique em Personalizar.

  2. Clique em Seções.

  3. Clique em Adicionar seção.

  4. Na área Layout avançado, clique em HTML personalizado > Adicionar.

  5. Clique em HTML personalizado e insira o código HTML que você deseja adicionar à sua página inicial.

  6. Clique em Salvar.

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

  • Cores
  • Tipografia
  • Carrinho
  • Navegação
  • Redes sociais
  • Favicon
  • Checkout

Cores

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

Personalizar suas configurações de cor

  1. Ao lado de **, clique em **Personalizar.

  2. Clique em Configurações do tema.

  3. Clique em Cores.

  4. 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

Com o Simple, é possível alterar a fonte e o tamanho do texto da loja.

Você pode definir o estilo e o tamanho da fonte para os textos de sua loja virtual.

Personalizar suas configurações de tipografia

  1. Ao lado de **, 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, consulte 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.

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 Simple 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 links às suas contas de mídia social, na área Contas sociais, insira os links para suas contas nos campos fornecidos. Insira os links completos, como https://instagram.com/shopify ou https://twitter.com/shopify.

  6. Para adicionar um Resumo de site rico ou RSS a um blog, na área Contas sociais, clique em Selecionar blog.

    Links para suas contas de mídias sociais e blog RSS são exibidos na barra lateral de sua loja virtual.

  7. Para adicionar botões de compartilhamento social aos seus produtos e postagens de blog, na área Opções de compartilhamento, 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. Clique em Salvar.

Opções de compartilhamento

Também é possível permitir que seus clientes compartilhem o conteúdo de sua loja virtual nas contas que eles têm nas redes sociais. Na seção Opções de compartilhamento, marque a caixa de seleção de cada tipo de compartilhamento em rede social que você deseja permitir:

  • Marque Compartilhar no Facebook para habilitar o botão de compartilhamento dessa rede social em produtos e posts do blog.

  • Marque Publicar no Twitter para habilitar o botão de compartilhamento dessa rede social em produtos e artigos do blog.

  • Marque Publicar no Pinterest para habilitar o botão de compartilhamento dessa rede social em produtos e artigos do blog.

Os botões

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.

Para enviar um favicon:

  1. Na seção Simple, clique em Personalizar.

  2. Clique em 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 no admin da Shopify, clique na aba Biblioteca. - Para selecionar uma imagem de seu computador local, clique na aba Biblioteca e, em seguida, no botão de mais.

  1. Clique em Salvar.

Dicas de navegação

Adicione um menu suspenso

Para adicionar menus suspensos ao Menu principal, crie menus na sua página de Navegação. Saiba como neste artigo.

Dicas de imagem

Melhor tipo de imagem de produto para o Simple

Fotos de alta resolução terão uma aparência mais sofisticada e profissional no Simple, portanto as imagens devem ter, no mínimo, 1024 x 1024 pixels. Suas imagens podem ter até 2048 x 2048 pixels. As imagens são reduzidas automaticamente quando necessário, então quanto maior a qualidade, melhor.

A melhor proporção entre a largura e a altura das fotos dos produtos é um quadrado.

O ideal é que suas fotos tenham um fundo de cor chapada ao longo das bordas. Uma cor chapada é uma cor sólida sem sombreamento ou destaque. Todas as fotos devem compartilhar a mesma cor chapada ao longo de suas bordas.

Definir uma imagem para posts de blog

A primeira imagem do post do seu blog será escolhida como a imagem em destaque para a página de destino do blog. Clique aqui para saber como você pode adicionar uma imagem a um artigo de blog.

Alterar os ícones de cartão de crédito na parte inferior das páginas

Este artigo mostrará como adicionar cartões de crédito e remover alguns ou todos eles.

Exibir miniaturas de vídeos em posts de blog

Se você tiver um vídeo no seu post de blog, adicione uma miniatura dele ao resumo do seu post e ele será exibido na página de destino do blog.

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

Experimente de graça