Documentação do SeedProd

Documentação, Materiais de Referência e Tutoriais para SeedProd

Bloco de Compartilhamento Social

O Bloco de Compartilhamento Social adiciona um conjunto de botões de compartilhamento às suas páginas SeedProd, facilitando para os visitantes o compartilhamento do URL da sua página ou postagem em suas plataformas de mídia social favoritas. As plataformas suportadas incluem Facebook, X (Twitter), LinkedIn e Pinterest — cada uma renderizada como um botão de marca que abre a caixa de diálogo de compartilhamento da plataforma com o URL da sua página pré-preenchido.

Ao contrário do bloco de Perfis Sociais, que vincula às suas próprias contas, o bloco de Compartilhamento Social foi projetado para amplificar seu conteúdo, permitindo que seu público faça o compartilhamento. Você pode personalizar o rótulo de cada botão, adicionar opções específicas da plataforma, como uma imagem para o Pinterest ou um texto de tweet pré-preenchido para o X (Twitter), e reordenar os botões arrastando e soltando para priorizar as plataformas mais relevantes para seu público.

Bloco de Compartilhamento Social exibindo botões de compartilhamento do Facebook, Twitter, LinkedIn e Pinterest em uma página SeedProd

Requisitos: O Bloco de Compartilhamento Social está disponível em todos os nossos planos de licença.


Adicionando o Bloco de Compartilhamento Social às Suas Páginas

Siga estas etapas para adicionar um bloco de Compartilhamento Social à sua página SeedProd:

Etapa 1: Adicionar o Bloco

Em Design > Blocos, arraste e solte o bloco Compartilhamento Social na seção desejada da sua página.

Arrastando o bloco de Compartilhamento Social para uma página SeedProd

Etapa 2: Configurar as Definições de Conteúdo

Uma vez adicionado, clique no bloco de Compartilhamento Social para abrir suas configurações. Na aba Conteúdo, a seção Compartilhamento Social permite gerenciar sua lista de botões de compartilhamento e configurar opções de exibição.

Gerenciando Botões de Compartilhamento:

  • Tipo de Plataforma: Use o menu suspenso ao lado de cada entrada para selecionar a plataforma social. As opções disponíveis são Facebook, X (Twitter), LinkedIn e Pinterest.
  • Rótulo: Clique no ícone de engrenagem de configurações em qualquer entrada para expandir suas opções, em seguida, insira um rótulo personalizado para exibir ao lado do ícone de compartilhamento (por exemplo, “Compartilhar”, “Twittar”, “Pin It”).
  • Texto do Tweet (apenas X / Twitter): Quando o painel de configurações do X (Twitter) estiver aberto, insira o texto pré-preenchido do tweet que aparecerá na caixa de diálogo de compartilhamento do Twitter quando um visitante clicar no botão.
  • Imagem (apenas Pinterest): Quando o painel de configurações do Pinterest estiver aberto, selecione ou insira um URL de imagem para ser compartilhado com o pin. Você pode escolher uma imagem da sua biblioteca de mídia ou colar um URL de imagem direto no campo Origem da Imagem.
  • Reordenar: Arraste as entradas para cima ou para baixo usando a alça de arrastar (ícone de setas) para alterar a ordem de exibição dos botões de compartilhamento.
  • Duplicar / Excluir: Passe o mouse sobre qualquer entrada para revelar os botões Duplicar e Excluir para um gerenciamento rápido.
  • Adicionar Novo Compartilhamento: Clique no botão + Adicionar Novo Compartilhamento na parte inferior da lista para adicionar outro botão de plataforma.

Opções de Exibição:

  • Tamanho: Defina o tamanho geral do botão — Pequeno, Médio ou Grande.
  • Alinhamento: Defina o alinhamento horizontal da linha de botões — Esquerda, Centro ou Direita. Suporta alinhamento por dispositivo para desktop, tablet e celular.
A aba Conteúdo do bloco de Compartilhamento Social mostrando a lista de plataformas, o campo de rótulo e as opções de tamanho e alinhamento

Etapa 3: Personalizar o Design

Na aba Avançado, você pode ajustar a aparência visual do seu bloco de Compartilhamento Social e controlar sua visibilidade.

Estilos:

  • Espaço Entre: Defina o espaçamento horizontal entre cada botão de compartilhamento na linha usando o controle deslizante (1–100px).
  • Sombra: Adicione um efeito de sombra aos botões de compartilhamento. Escolha entre tamanhos predefinidos — Nenhum, Fina, Pequena, Média, Grande, X Grande e XX Grande.

Espaçamento:

  • Margem: Controle o espaçamento externo ao redor do seu bloco de Compartilhamento Social (Superior, Direita, Inferior, Esquerda). Suporta valores por dispositivo para desktop, tablet e celular.
  • Preenchimento: Ajuste o espaçamento interno do seu bloco de Compartilhamento Social (Superior, Direita, Inferior, Esquerda). Suporta valores por dispositivo para desktop, tablet e celular.

Atributos:

  • ID CSS: Exibe o identificador exclusivo gerado automaticamente para o seu bloco de Compartilhamento Social. Este ID é criado automaticamente pelo SeedProd e pode ser usado para estilização personalizada ou segmentação de JavaScript.
  • Classe Personalizada: Adicione classes CSS personalizadas para aplicar estilos específicos do seu tema ou CSS personalizado.
  • Atributos Personalizados: Adicione quaisquer atributos HTML ao elemento wrapper do bloco. Insira cada atributo em uma nova linha usando o formato: nome-do-atributo|valor (por exemplo, data-section|share).

Visibilidade do Dispositivo:

  • Ocultar no Desktop: Oculte o bloco de Compartilhamento Social em telas de desktop.
  • Ocultar no Tablet: Oculte o bloco de Compartilhamento Social em dispositivos tablet.
  • Ocultar no Celular: Oculte o bloco de Compartilhamento Social em dispositivos móveis.

Efeitos de Animação:

  • Animação de Entrada: Escolha entre vários efeitos de animação que são reproduzidos quando o bloco de Compartilhamento Social entra na tela. As opções incluem Bounce, Fade In, Zoom In, Rotate In e muitos outros.
A aba Avançado do bloco de Compartilhamento Social mostrando as configurações de Estilos, Espaçamento, Atributos, Visibilidade por Dispositivo e Efeitos de Animação

Etapa 4: Salve Suas Alterações

Depois de terminar de configurar o bloco de Compartilhamento Social e personalizar sua aparência, certifique-se de salvar seu trabalho.


Você adicionou com sucesso um bloco de Compartilhamento Social à sua página! Ao oferecer aos visitantes uma maneira simples de compartilhar seu conteúdo no Facebook, X (Twitter), LinkedIn e Pinterest com um clique, este bloco ajuda a expandir o alcance do seu conteúdo sem esforço extra. Personalize os rótulos dos botões, o tamanho e o espaçamento para combinar com o design da sua página e use os controles de alinhamento por dispositivo para garantir que os botões fiquem ótimos em todas as telas.

Artigos Relacionados