Skip to main content

Configurar um componente e fazer upload de ativos de conteúdo

Objetivos de aprendizagem

Após concluir esta unidade, você estará apto a:
  • Descrever como a visibilidade da página funciona com componentes.
  • Listar três atributos que Brandon usa em seu componente.
  • Explicar por que renomear uma pasta no Media Manager pode causar problemas.
  • Explicar como fazer upload de arquivos de ativo de conteúdo.

Fazer uma página melhor

Brandon entrou no ritmo. Ele criou uma nova página do Page Designer, adicionou um componente e configurou quem pode vê-lo e quando. Agora ele quer adicionar um segundo componente com mais complexidade. Ele também quer entender como o B2C Commerce descobre quais componentes exibir. E ele pode fazer upload de alguns grandes novos ativos de conteúdo.

Adicionar outro componente

Brandon quer adicionar um segundo componente mais complicado que exibe um carrossel. Veja como ele adiciona o componente carrossel e, em seguida, os componentes individuais de bloco que o carrossel exibe.

  1. No Business Manager, abra o Page Designer.
  2. Selecione a página: Página inicial da Cloud Kicks
  3. Clique no ícone Estrutura da página Ícone Estrutura da página.. No Page Designer, adicione outro componente à estrutura da página.
  4. Clique no sinal de adição ao lado da Região principal.
  5. Selecione Carrossel na seção Layouts do Commerce. Ou arraste e solte o componente do painel Componentes. O novo componente aparece no painel direito. No Page Designer, configure o componente de carrossel.
  6. Digite o título do carrossel que aparece na página da loja.
  7. Selecione os indicadores, controles e número de slides (1, 2 e 3) a serem mostrados em cada um dos tamanhos: telefone, tablet e desktop.
  8. Adicione os slides ao carrossel.
    1. Clique no ícone Estrutura da página Ícone Estrutura da página.. No Page Designer, adicione slides ao componente de carrossel.
    2. Clique no sinal de adição ao lado de Slides e selecione o componente Imagem com texto. Esse componente permite que você mostre vários produtos. O comprador clica no link no bloco e navega até o que você quer que eles vejam, por exemplo, uma página específica de produto ou categoria.
    3. Com esse componente, você pode:
      • Selecionar uma imagem.
      • Adicionar uma sobreposição de texto.
      • Criar um link para um produto, categoria, termo de pesquisa ou site externo.
      • Digitar texto que aparece abaixo da imagem.
    4. Depois de inserir ou selecionar os detalhes para esse slide, clique em Adicionar à página. O novo componente é exibido no painel central.
    5. Clique no ícone Estruturas da página Ícone Estrutura da página..
    6. Clique no sinal de adição ao lado de Slides para adicionar mais dois slides, pois você especificou três slides para a visualização de desktop. Adicione sempre o maior número de slides que você configurou a um componente de carrossel. Dessa forma, cada slide para uma exibição pode ser diferente.

Quando Brandon fica satisfeito com a aparência de sua página, ele clica em Publicar para torná-la disponível online.

Depois que ele cria algumas páginas, algumas de suas primeiras tentativas podem não ser exatamente o que ele quer. Tudo bem! Para excluir uma página, ele simplesmente seleciona-a no Page Designer e clica em Excluir.

Como funciona a visibilidade?

Brandon precisa saber como o Page Designer decide quais componentes mostrar para que ele não tenha surpresas. O Page Designer começa no topo da lista na Estrutura de página e verifica as regras de visibilidade de cada componente.

Estrutura de página do Page Designer.

O Page Designer mostra o primeiro componente, por exemplo, o Banner principal, que corresponde às regras de data, hora e grupo de cliente. Se ele verificar todos os componentes em ordem e não encontrar correspondência, ele exibirá o componente na parte inferior da lista, por exemplo, o terceiro componente Imagem com texto. Na lista de estrutura de página, os componentes abaixo de um componente que não tem regras aplicadas a ele não aparecem porque o componente acima dele sem regra é sempre uma correspondência.

Por exemplo, Brandon cria uma página inicial com cinco componentes.

  • Banner1
  • Carrossel
    • Imagem com texto1
    • Imagem com texto2
  • Banner 2

Brandon esqueceu de adicionar regras ao componente Carrossel, então os componentes Imagem com texto e o componente Banner2 não aparecem.

Você pode arrastar os componentes ao redor para alterar a ordem em que eles são listados na janela Estrutura de página.

Gerenciar ativos de conteúdo

Brandon quer que suas páginas tenham conteúdo incrível que destaque seus produtos incríveis. Aqui estão os passos que ele segue para fazer upload de conteúdo e gerenciar seus arquivos.

  1. No Business Manager, abra o Page Designer.
  2. Clique no ícone Media Manager Ícone do Media Manager.. Janela Gerenciar arquivos do Page Designer.
  3. Expanda as pastas para ver seu conteúdo. Você pode fazer upload de uma grande variedade de tipos de arquivos e estruturá-los como quiser.
  4. Clique nos três pontos à direita do nome de uma pasta. Você pode:
    • Criar uma pasta.
    • Renomear a pasta. Pense duas vezes antes de fazer isso, pois isso desvincula os arquivos na pasta de todas as páginas onde os arquivos são usados. De repente seus lindos gráficos não aparecem mais!
    • Excluir a pasta.
  5. Para fazer upload de arquivos locais:
    1. Selecione uma pasta onde fazer upload.
    2. Clique em Carregar arquivos e selecione ou arraste arquivos para a janela Gerenciar arquivos.
  6. Para excluir arquivos da biblioteca de conteúdo:
    1. Selecione o ícone de lixo de um arquivo ou selecione um ou mais arquivos.
    2. Clique em Excluir.
  7. Clique em Concluído para sair do Media Manager.

Resumindo

Nesta unidade você acompanhou com Brandon conforme ele adicionou um componente em sua página. Com isso, você aprendeu que cada tipo de componente tem seus próprios atributos e complexidades. Você também aprendeu a carregar seus fabulosos ativos de conteúdo no Page Designer.

Agora faça o teste e ganhe um emblema incrível!

Compartilhe seu feedback do Trailhead usando a Ajuda do Salesforce.

Queremos saber sobre sua experiência com o Trailhead. Agora você pode acessar o novo formulário de feedback, a qualquer momento, no site Ajuda do Salesforce.

Saiba mais Continue compartilhando feedback