### [Como Personalizar o Link de Guardar e Continuar](https://wpforms.com/developers/how-to-customize-the-save-and-resume-link/)
**Publicado:** 5 de janeiro de 2024
**Autor:** Equipa Editorial
**Resumo:** Este trecho de CSS irá guiá-lo sobre como personalizar o link de Guardar e Continuar para aparecer como um botão.
**Conteúdo:**
## Visão Geral
Gostaria de personalizar o link de guardar e continuar? Usando um pequeno trecho de CSS, pode facilmente converter o link de texto que aparece quando o **addon Guardar e Continuar** está ativado para que apareça como um botão. Vamos começar!
## Adicionar o trecho de CSS
Para efeitos desta documentação, vamos presumir que já criou o seu formulário e ativou o **addon Guardar e Continuar**.
No entanto, caso necessite de alguma assistência para ativar este addon para o seu formulário, [consulte este guia útil](https://wpforms.com/docs/how-to-install-and-use-the-save-and-resume-addon-with-wpforms/ "Addon Guardar e Continuar").
Assim que o seu formulário estiver criado e o addon ativado, basta adicionar este CSS ao seu site e personalizar as cores, a família de fontes, o tamanho da fonte, etc., como desejar.
Se precisar de ajuda sobre como e onde adicionar trechos de CSS ao seu site, [consulte este tutorial](https://wpforms.com/developers/how-to-add-custom-css-styles-for-wpforms/ "Como Adicionar Estilos CSS Personalizados para WPForms").
#### Estilização para todos os formulários
```
a.wpforms-save-resume-button {
padding: 10px;
text-decoration: none !important;
background-color: #e27730;
border-radius: 3px;
color: #ffffff !important;
font-family: 'Roboto' !important;
font-size: 17px !important;
border: 1px solid #e27730;
transition: all 0.3s ease-out;
}
a.wpforms-save-resume-button:hover {
color: #e27730 !important;
background-color: #ffffff;
}
```
#### Estilização para formulários específicos
Se quisesse aplicar esta alteração apenas a um formulário específico, use este CSS em vez disso.
```
form#wpforms-form-999 a.wpforms-save-resume-button {
padding: 10px;
text-decoration: none !important;
background-color: #e27730;
border-radius: 3px;
color: #ffffff !important;
font-family: 'Roboto' !important;
font-size: 17px !important;
border: 1px solid #e27730;
transition: all 0.3s ease-out;
}
form#wpforms-form-999 a.wpforms-save-resume-button:hover {
color: #e27730 !important;
background-color: #ffffff;
}
```
Note que terá de atualizar o ID do formulário no seu CSS de **999** para corresponder ao seu próprio ID de formulário. Se precisar de ajuda para encontrar o seu ID de formulário, [reveja este guia útil](https://wpforms.com/developers/how-to-locate-form-id-and-field-id/ "Como Localizar o ID do Formulário e o ID do Campo").
E agora, ao visualizar o formulário, poderá ver imediatamente a diferença!
Gostaria também de personalizar a linha de assunto do e-mail para este addon quando as notificações são enviadas? Dê uma vista de olhos ao nosso tutorial sobre [Como Alterar o Assunto do E-mail nas Notificações de E-mail de Guardar e Continuar](https://wpforms.com/developers/how-to-change-the-email-subject-on-save-and-resume-email-notifications/ "Como Alterar o Assunto do E-mail nas Notificações de E-mail de Guardar e Continuar").
**Categorias:** Trechos
**Tags:** CSS, Guardar e Continuar
---