# Customize the try-on in your store > Tutorial to make the virtual try-on match your store. Apply a kit, adjust the button and its animation, set up the invitation, check the preview and publish. Canonical: https://provei.ai/ajuda/en/tutoriais/personalizar-o-provador/ Last updated: 2026-10-23 Translation (pt-BR): https://provei.ai/ajuda/tutoriais/personalizar-o-provador.md In this tutorial you make the try-on match your store: apply a style kit, adjust the button on the product page and its animation, set up the invitation (pop-up) and publish. Everything changes in the live preview first, and your store only gets the changes in the last step. ## Before you start - The Provei code must be in your store. See [Install the virtual try-on in your store](https://provei.ai/ajuda/en/instalacao/). - Open the dashboard on a computer. On a phone, the editor works, but the preview hides behind **Ver prévia** (See preview). - Some settings depend on your plan and show a lock. See [Features that depend on your plan](https://provei.ai/ajuda/en/experiencia-na-loja/#features-that-depend-on-your-plan). ## 1. Open the editor In the side menu, click **Experiência na loja** (In-store experience). The four areas, **Estilo** (Style), **Elementos** (Elements), **Regras** (Rules) and **Marca** (Brand), are on the left. The live preview of a product page is on the right. ![The Experiência na loja editor with the Estilo, Elementos, Regras and Marca areas on the left and the live preview on the right](https://provei.ai/ajuda/_astro/editor.C0z1HIJS_ZSPE4f.webp) At the top of the preview, choose **Computador** (Computer) or **Celular** (Phone). Check both screens as you go. ## 2. Apply a style kit 1. Open **Estilo**. 2. Under **Kits prontos** (Ready-made kits), look at the thumbnails. The first ones match your store type and carry a tag such as **Para moda** (For fashion), **Para óticas** (For eyewear) or **Para casa** (For home). 3. Click **Aplicar** (Apply) on the kit that best fits your store. The preview changes right away. 4. Under **Ajustes globais** (Global settings), change the **Cor da marca** (Brand color) to your store’s color and, if you like, the **Cantos** (Corners), **Sombra** (Shadow) and **Fonte** (Font). These settings apply to the button, invitation, window and links together. See every option in [Store style, kits and global settings](https://provei.ai/ajuda/en/experiencia-na-loja/estilo/). ## 3. Adjust the button on the page 1. Open **Elementos › Botão na página** (Elements › Button on the page). Another way: click the button in the preview, on **Editar botão** (Edit button). 2. Under **Onde aparece** (Where it appears), choose **Junto ao botão de comprar** (Next to the buy button, recommended), **Flutuante no canto** (Floating in the corner) or **Sobre a foto do produto** (On the product photo). For the first and last, click **Escolher na minha página** (Pick on my page) and mark the spot on a real page of your store. 3. Under **Conteúdo** (Content), write a short, direct **Texto do botão** (Button text) and choose the **Ícone** (Icon). 4. Under **Aparência** (Appearance), keep **Padrão** (Default) to use the try-on’s look, or change any setting so the button switches to **Personalizado** (Custom). ## 4. Pick an animation for the button On the same tab, under **Animação** (Animation), choose the **Movimento do botão** (Button motion): **Nenhuma** (None), **Pulsar** (Pulse), **Brilho** (Shine) or **Balançar** (Wobble). The preview shows the motion. ![The Animação section with the Nenhuma, Pulsar, Brilho and Balançar options](https://provei.ai/ajuda/_astro/botao-animacao.DCyNn5Ej_Z29JEU2.webp) The motion stops when the customer hovers over the button, and people who asked their device for less motion see a still button. With the button **Sobre a foto do produto**, there’s no animation. See [Button on the product page](https://provei.ai/ajuda/en/experiencia-na-loja/botao/#turn-on-an-animation). ## 5. Set up the invitation (pop-up) The invitation reminds customers to try on, a few seconds after they land on the product page. 1. Open **Elementos › Convite (pop-up)** (Elements › Invitation) and turn on **Mostrar convite** (Show invitation). 2. Under **Conteúdo** (Content), write the **Título** (Title), the **Mensagem** (Message) and the **Texto do botão** (Button text), and choose the **Imagem** (Image). 3. Under **Layout**, choose **Cartão** (Card), **Barra** (Bar) or **Bolha** (Bubble), and the **Animação de entrada** (Entrance animation). 4. Under **Quando aparece** (When it appears), set **Aparece depois de (seg.)** (Appears after, in seconds), **No máximo em (seg.)** (At most after, in seconds) and **Com que frequência** (How often). **Uma vez por visita** (Once per visit) avoids showing the invitation again to someone who has seen it. 5. Under **Onde aparece** (Where it appears), choose the **Canto** (Corner) and the **No celular** (On phones) behavior. 6. In the preview, choose the **Convite** (Invitation) moment and click **Ver de novo** (See again) to watch the entrance. ![The Layout section with the Cartão, Barra and Bolha options and the Animação de entrada](https://provei.ai/ajuda/_astro/convite-layout.CXdib1oh_Z1SiIV2.webp) The details of each option are in [Pop-up invite to try on](https://provei.ai/ajuda/en/experiencia-na-loja/convite-pop-up/). ## 6. Check the window and the brand - In **Elementos › Janela do provador** (Elements › Try-on window), choose how the window opens in your store. In the preview, use the **Provador aberto** (Try-on open) moment. See [Try-on window](https://provei.ai/ajuda/en/experiencia-na-loja/janela-do-provador/). - In **Marca** (Brand), check the logo and the name shown in the try-on. See [Your store’s brand in the try-on](https://provei.ai/ajuda/en/experiencia-na-loja/marca/). > **Tip:** Can’t find a setting? Use **Procurar ajuste…** (Search settings) at the top of the editor. Type, for example, “sombra” or “WhatsApp”, and the editor opens the right area and highlights the setting. ## 7. Publish and check your store 1. In the bottom bar, check how many changes are left to publish. Areas with changes have a colored dot. 2. Click **Publicar alterações** (Publish changes). When it finishes, the bar shows **Tudo publicado** (All published). 3. Open a product page of your store in a private window and check the button, the animation and the invitation. Reload the page if it was already open. If a part isn’t published, the notice shows **Corrigir em …** (Fix in …) and takes you straight to the field with the problem. If your store still looks the same, see [Published changes not showing in the store](https://provei.ai/ajuda/en/solucao-de-problemas/mudancas-nao-aparecem/). ## Frequently asked questions ### Do changes go to my store while I edit? No. Everything shows in the preview first. Your store only changes when you click Publicar alterações (Publish changes). ### Can I go back to what I had before? Before publishing, click Descartar (Discard) to return to what's published. After publishing, use Restaurar padrão (Restore default) on each setting or apply a kit again. ### I can't find a setting. Where is it? Use the Procurar ajuste… (Search settings) box at the top of the editor. It opens the right area and highlights the setting. ## See also - [In-store experience editor](https://provei.ai/ajuda/en/experiencia-na-loja/) - [Store style, kits and global settings](https://provei.ai/ajuda/en/experiencia-na-loja/estilo/) - [Button on the product page](https://provei.ai/ajuda/en/experiencia-na-loja/botao/) - [Pop-up invite to try on](https://provei.ai/ajuda/en/experiencia-na-loja/convite-pop-up/)