# Formatação em negrito e itálico para canais Widget e Whatsapp

{% embed url="<https://drive.google.com/file/d/1v4iB3h-FCOC2jRNcJVx5GGHq4iD-tt7C/view?usp=sharing>" %}

A maneira de inserir negrito e itálico no Whatsapp é diferente da maneira de inserir no site.

Por exemplo, no WhatsApp você formata em negrito utilizando asterisco, enquanto no site/Widget você utiliza HTML, porém o Widget não interpreta a formatação do WhatsApp e o WhatsApp não interpreta a do Widget.

Aqui vou explicar como utilizar o mesmo fluxo e ter ambas as formatações.

## Validando por qual canal o usuário entrou

1- Para sabermos por qual canal o usuário entrou, crie um filtro (antes ou depois da etapa de boas-vindas). Em campo selecione o campo **Contato - Whatsapp#**, em condição coloque **Não vazio:**

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LSnqDgLbXBccdKMOdEJ%2Fuploads%2FQ26uDiazHIZb4ATydmuA%2Fcanal%20whatsapp.gif?alt=media\&token=f4635bc3-fb8a-4888-9ef0-3e251b3194bf)

## Criando formatação de cada canal

1-Do lado sim do filtro crie uma etapa javascript, de o nome de Formatação whastapp e cole o seguinte código:

```
//Formata negrito
context.negritoInicio="*"
context.negritoFim="*"

//Formata itálico
context.italicoInicio="_"
context.italicoFim="_"
```

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LSnqDgLbXBccdKMOdEJ%2Fuploads%2Fb1TLNzDOErBmnBPYH7hI%2Fjswhatsapp.gif?alt=media\&token=64469281-c337-4579-956a-8fc26e9352b6)

2- Do lado não do filtro, crie outra etapa javascript, dê o nome Formatação web e cole o seguinte código:

```
// Formata em negrito
context.negritoInicio="<b>"
context.negritoFim="</b>"

//Formata itálico
context.italicoInicio="<i>"
context.italicoFim="</i>"
```

## Colocando a formatação na etapa de mensagem

1-Após criar a etapa javascript para o canal Widget, crie uma etapa existente que direcione a mensagem que deve ser formatada:

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LSnqDgLbXBccdKMOdEJ%2Fuploads%2FpVVWpFnYnjk8pS1IXvFH%2FFrase%20de%20teste.gif?alt=media\&token=d5dec958-5ca2-4b3d-8a1e-fdf15fc8f7a2)

2- Na mensagem que você deseja formatar em negrito, no início da frase/palavra  entre duas chaves de abertura e fechamento, insira o contexto negrito inicio, copie e cole no início da frase: {{context.negritoInicio}}

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LSnqDgLbXBccdKMOdEJ%2Fuploads%2FN5r5zAomx1SPIEvcYaY4%2Fnegrito.gif?alt=media\&token=4a9912a7-4d90-42ea-9394-97b2d7980656)

3- Ao final da frase/palavra que você deseja formatar em negrito insira entre duas chaves de abertura e fechamento o contexto negritoFim:{{context.negritoFim}}

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LSnqDgLbXBccdKMOdEJ%2Fuploads%2Fgn2gFYl6z8sO3p3ReyNR%2Fcontexto%20fim%20negrito.gif?alt=media\&token=32c52f23-0c77-4b18-a8d5-57851dd500e7)

{% hint style="info" %}
Caso queira formatar em itálico também, basta repedir o processo com o contexto  italicoInicio e italicoFim.
{% endhint %}

Pronto, agora as frases receberão a formatação correta de acordo com o canal que o cliente entrar.

![](https://1728608858-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LSnqDgLbXBccdKMOdEJ%2Fuploads%2Fl9QCWtfUoXIudUzb8YGU%2Fcomo%20fica.gif?alt=media\&token=9e55c921-f20a-4608-8228-e5a97faa076e)