O cliente queria usar o módulo E-mail Optin do Divi, mas com o formulário e o botão na mesma linha. Por padrão, o botão de inscrição fica abaixo do formulário. Achei esse post ensinando a fazer um Optin mais slim: https://divilover.com/slim-divi-optin-form-module-layout/. Nesse link, tem instruções para caso o formulário tenha um, dois ou três campos. No meu caso, era apenas o campo de e-mail. Adicionei a classe “optin-slim” ao módulo, adaptei o código para as minhas necessidades e ele ficou assim:
.optin-slim .et_pb_newsletter_footer {
flex-basis: 100%;
margin-top: 0;
font-size: 12px;
}
.optin-slim .et_pb_newsletter_field {
flex-basis: 69%
}
.optin-slim .et_pb_newsletter_button_wrap {
flex-basis:29%;
}
@media (max-width:980px) {
.et_pb_column_4_4 .optin-slim {
display:block;
}
.optin-slim .et_pb_newsletter_form {
width: 100%;
padding: 0;
}
.optin-slim .et_pb_newsletter_footer {
text-align:center;
}
}
@media (max-width:479px) {
.optin-slim .et_pb_newsletter_field,
.optin-slim .et_pb_newsletter_button_wrap {
flex-basis:100%;
}
}Além disso, também alterei o placeholder de “E-mail” para “Digite seu e-mail” com jQuery:
jQuery(function($){
$("#et_pb_signup_email").attr("placeholder", "Digite seu e-mail");
});Aqui abaixo está toda a seção com o módulo de download do e-book. Não há nenhuma lista de e-mail marketing selecionada, então o botão não realiza nenhuma ação.
Esse guia definitivo reúne as bases de todas as minhas estratégias de marketing para alavancar vendas ou criar um negócio 100% digital do zero.
