Voltar para o suporte Conteúdo e mídia Blocos Bloco de slideshow

Bloco de slideshow

Este guia vai mostrar como usar o bloco de slideshow para adicionar um slideshow de imagens interativo em um post ou página.

Ficará assim no site:

Adicionar o bloco de slideshow

Para adicionar o bloco de slideshow, clique no ícone Inserção de bloco (+) e pesquise “slideshow”. Clique no bloco para adicioná-lo ao post ou à página.

Captura de tela mostrando como adicionar o bloco de slideshow com o botão de inserção de blocos que fica na parte superior esquerda no editor de blocos.
Adicione um bloco novo e procure Slideshow.

💡

Usando o teclado, você também pode digitar /slideshow em uma nova linha e pressionar Enter para adicionar rapidamente um novo bloco de slideshow.

Captura de tela mostrando como adicionar um bloco de slideshow digitando / e slideshow em um novo bloco na área principal do editor.
Digite /slideshow em um novo bloco.

Para mais informações, consulte as instruções detalhadas em Como adicionar blocos.

Adicionar imagens

Quando você adiciona um bloco de slideshow pela primeira vez, você tem duas opções: Fazer upload e Selecionar imagens.

Exemplo de como fazer upload ou adicionar imagens da biblioteca de mídia, Google Fotos ou fotos gratuitas do Pexels ou imagens do Openverse no bloco de slideshow.
Como fazer upload ou selecionar imagens em um bloco de slideshow.

Fazer upload permite que você envie uma nova imagem ou várias imagens do seu computador para seu site.

A opção Selecionar imagens permite que você selecione imagens enviadas anteriormente para a biblioteca de mídia ou imagens do Google Fotos, da biblioteca de fotos gratuitas do Pexels ou do Openverse.

Adicionar imagens extras

Você pode adicionar mais imagens após criar o slideshow. Para isso, use a opção Fazer upload de imagem abaixo do slideshow:

Captura de tela mostrando como adicionar imagens extras ao slideshow com a opção Fazer upload de imagem.
Adicionar imagens extras ao slideshow.

Editar slideshow

Você pode usar o botão Editar slideshow da barra de ferramentas para adicionar ou remover imagens ou alterar a ordem em que elas aparecem.

Captura de tela mostrando a opção Editar slideshow na barra de ferramentas do bloco de slideshow.
Botão Editar slideshow na barra de ferramentas do bloco.

Reordenar imagens

As imagens são incluídas no slideshow na ordem selecionada no momento da criação do slideshow. Você poder reordenar as imagens usando a opção Editar slideshow. Ao editar o slideshow, você verá um número ao lado de cada imagem ao selecioná-la. Esse número indica a ordem em que a imagem aparecerá no bloco de slideshow.

Como reordenar imagens em um bloco de slideshow.

Barra de ferramentas do bloco

Ao clicar no bloco, aparecerá acima uma barra de ferramentas com opções:

Captura de tela mostrando a barra de ferramentas do bloco de slideshow
Barra de ferramentas do bloco de slideshow

A barra de ferramentas do bloco de slideshow oferece as seguintes opções:

Configurações do bloco

Ao clicar no bloco, serão exibidas configurações adicionais na barra lateral direita. Se você não estiver vendo a barra lateral, clique no ícone ⚙️ (engrenagem) no canto superior direito para exibir as configurações.

Captura de tela mostrando as configurações do bloco de slideshow na barra lateral direita.
Clique no ícone ⚙️ para abrir as configurações do bloco.

bloco de slideshow conta com diversas configurações que podem ser ajustadas na barra lateral Configurações do bloco.

Configurações do bloco de slideshow
Reprodução automática

Ative essa opção para que as imagens avancem automaticamente no slideshow.

Quando a opção estiver ativada, o slideshow incluirá um botão de pausa para que os visitantes possam pausá-lo. Também é possível selecionar a duração (em segundos) da transição automática:

Captura de tela mostrando a alternância de reprodução automática e o botão de pausa no bloco d slideshow definir a duração entre as transições.
Botão de pausa no bloco de slideshow com a reprodução automática ativada.
Efeitos

Na guia Efeitos, você pode escolher entre os efeitos deslizar e suavizar para a transição de slides.

Captura de tela mostrando os efeitos de transição deslizar e suavizar no bloco de slideshow.
Efeitos de transição no bloco de slideshow.
Configurações da imagem

Na guia Configurações de imagem, você pode escolher os tamanhos das imagens para o bloco de slideshow entre essas opções: miniatura, médio, grande e tamanho original.

Captura de tela mostrando as configurações de imagem do bloco de slideshow.
Tamanho das imagens no bloco de slideshow.
Avançado

Avançado

Na guia Avançado, você adiciona uma classe CSS ao seu bloco, permitindo a gravação de CSS personalizado e a estilização do bloco conforme você julgar melhor.

A seção Avançado permite que você adicione uma classe CSS ao seu bloco.
A seção Avançado permite que você adicione uma classe CSS ao seu bloco.
Copied to clipboard!