Widget Deslizador de Antes e Depois para seu site

Show visual transformations with an interactive comparison slider. Jotform's Before and After Slider widget lets you add image pairs, choose horizontal or vertical reveal direction, set drag or hover interaction, add labels and captions, enable fullscreen viewing, and embed the result on your website without code.

Como criar um widget Before and After Slider

Add image pairs

Add image pairs

Paste before and after image URLs, then write clear labels and captions for each comparison.

Customize the reveal

Customize the reveal

Choose horizontal or vertical direction, set the initial divider position, and use drag, click, or hover interaction.

Embed it on your website

Incorpore ao seu site

Adjust size, ratio, colors, fullscreen behavior, and display rules before publishing the widget.

Show transformations with a comparison widget that fits your page

Compare before and after images

Place two images in one frame so visitors can instantly understand renovation, design, beauty, repair, or product changes.

Compare before and after images

Use horizontal or vertical reveal

Switch the divider direction to match the subject matter and let visitors inspect changes with drag, click, or hover movement.

Use horizontal or vertical reveal

Create a small transformation gallery

Add up to three image pairs and enable carousel navigation so visitors can browse multiple project stages or case studies.

Create a small transformation gallery

Alinhe o widget ao estilo do seu site

Control width, image ratio, corner radius, divider size, colors, labels, captions, custom CSS, fullscreen mode, and mobile visibility.

Match your website style

How to embed your Before and After Slider into WordPress

1Get your embed code

After customizing your Jotform website widget, click Try it on your website for free, and copy the generated embed code.

2Open the page editor

Go to the WordPress post or page where you want to display the widget, then add a new block.

3Add a Custom HTML block

Select Custom HTML and paste your Jotform website widget embed code into the HTML field.

4Update and view

Click Update or Publish, then open the page to check your embedded widget.

Por que os Widgets para Sites Jotform se destacam

Os widgets da Jotform tornam seu site mais interativo e aumentam as conversões. Há diversas opções disponíveis, desde avaliações com estrelas e deslizadores de depoimentos até pop-ups de prova social e incorporações de mídia. Adicione widgets aos seus formulários ou landing pages para coletar dados, exibir provas sociais e capturar leads — tudo sem precisar programar.

Incorpore widgets sem precisar programar

Adicione widgets da Jotform ao seu site com um simples código de incorporação. Personalize o widget, veja uma prévia de como ele ficará e cole-o em qualquer página que aceite HTML personalizado ou blocos de incorporação, sem precisar de um desenvolvedor.

Crie páginas mais interativas

Use os Widgets para Sites Jotform para coletar leads, exibir avaliações de clientes, expor provas sociais, incorporar mídia ou adicionar ferramentas úteis às suas páginas. Cada widget ajuda os visitantes a interagir com sua empresa diretamente no site.

Receba suporte sempre que precisar

Se precisar de ajuda para configurar, personalizar, incorporar ou solucionar problemas com o seu widget, a equipe de suporte Jotform está disponível 24h. Assim, você pode seguir em frente com confiança, sabendo que terá ajuda sempre que precisar.

Where to use your Before and After Slider widget

Add the widget anywhere a visual comparison helps visitors trust the result, understand quality, or make a decision faster.

Renovation and interior design pages to show completed project transformations.

Beauty, wellness, and fitness sites to compare visible client or treatment progress.

Product pages to highlight upgrades, restorations, edits, or feature improvements.

Portfolio and case study pages to make results more tangible than text alone.

Real estate listings to compare staging, repairs, landscaping, or remodel work.

Creative service pages to show retouching, mockups, design revisions, or brand refreshes.

Converta leads em clientes pagantes com o Criador de Formulários Jotform

Transforme engajamento em ação usando Jotform. Crie formulários poderosos para captar leads, receber pagamentos e automatizar respostas, tudo em um só lugar. Cada envio chega à sua Caixa de Envios Jotform, onde você pode fazer o acompanhamento ou conectar seus apps favoritos.

Comece jáé grátis!
Convert leads into customers

Perguntas Frequentes

  • What is a Before and After Slider widget?

    A Before and After Slider widget displays two related images in one interactive frame. Visitors move a divider to reveal more of the before or after image and compare the transformation.

  • Can I choose the slider direction?

  • How can visitors move the divider?

  • Can I set the initial divider position?

  • Can I show more than one comparison?

  • Can I add labels and captions?

  • Does the widget support fullscreen viewing?

  • Does it work on mobile?

  • Preciso escrever código?