Para começar é preciso que o Gadget "Formulário de Contato" nativo do Blogger seja acionado ao seu Blog.
Faça assim:
Acesse a Aba Layout e clique em adicionar um Gadget. Dentre as opções escolha Formulário de Contato, Salve, Arraste para o fim da sidebar e Salve, agora vamos ocultá-lo.
Acesse a Aba Tema do seu Blog e clique em editar HTLM dentro da caixa do código fonte tecle Ctr+F e na barra de busca que expandir digite ]]></b:Skin> e tecle Enter para localizar.
Acima de ]]></b:Skin> cole este código:
orm1 {display: non#ContactFe! Important;}
e salve, depois vá até o Painel de seu Blog e clique em Páginas.
Clique Nova Página, coloque o título na página, depois clique em HTLM, no alto do Editor do lado esquerdo da Página clique em modo HTLM.
Coloque aí o código abaixo mencionado, em seguida clique em Publicar, pronto está feito.
Depois poderás mudar as côres de acôrdo com o seu gosto, mudando os códigos de Côr e também poderás colocar na coluna sidebar ao lado de seu blog, ficando na escolha do freguês.
(Obs: Na página final de meu Blog do Romero, clique em "Contate-nos" e vai ver como ficará igual)
A honra vai para o Blog: https://www.elainegaspareto.com
<style type="text/css">
.widget.ContactForm{z-index:1}
.contact-form-widget{
margin-left:auto;
margin-right:auto;
width:600px;
max-width:100%;
padding:25px 0;
background:#EBEBE3;
-webkit-border-radius:2%;
-moz-border-radius:2%;
border-radius:2%}
.contact-form-widget .form{width:91%;margin:0 auto}
.ribbon{
font:16px Arial;
text-shadow:0 1px 2px rgba(0,0,0,0.25);
position:relative;
background:#14ccc9;
color:#fff;
text-align:center;
padding:1em 2em;
margin:0 -16px}
.ribbon:before,.ribbon:after{
content:"";
position:absolute;
display:block;
bottom:-1em;
border:1.5em solid #cc1473;
z-index:-1}
.ribbon:before{
left:-1.7em;
border-right-width:1.2em;
border-left-color:transparent}
.ribbon:after{
right:-1.7em;
border-left-width:1.2em;
border-right-color:transparent}
.ribbon .ribbon-content:before,.ribbon .ribbon-content:after{
content:"";
position:absolute;
display:block;
border-style:solid;
border-color:#880b4b transparent transparent;
bottom:-1em}
.ribbon .ribbon-content:before{left:0;border-width:1em 0 0 1em}
.ribbon .ribbon-content:after{right:0;border-width:1em 1em 0 0}
.contactf-name,.contactf-email,.contactf-message{
text-align:left;
margin-top:25px;
color:#a1937b;
font-size:13px;
}
.contactf-name,.contactf-email{float:left;width:100%}
.contact-form-name,.contact-form-email,.contact-form-email-message,.contact-form-name:hover,.contact-form-name:focus,.contact-form-email:hover,.contact-form-email:focus,.contact-form-email-message:hover,.contact-form-email-message:focus{
width:100%;
max-width:100%;
margin:10px 0 0;
padding:10px;
font-size:12px;
color:#aaa;
border-color:#DBD6D1;
border-width:1px;
box-shadow:none;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px}
.contact-form-name,.contact-form-email{height:35px}
.contact-form-email-message{height:100px}
.contact-form-button-submit,.contact-form-button-submit:hover{
margin-top:25px;
width:100%;
height:37px;
font:normal 12px Arial;
outline:none;
letter-spacing:1px;
color:#fff;
text-align:center;
cursor:pointer;
color:#ffffff;
border:1px solid #cc1473;
background:#cc1473;
}.contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;height:11px !important;width:11px !important;}
</style>
<div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><h2 class="ribbon"><b class="ribbon-content">Fale com a gente!</b></h2><div class="form"><form name="contact-form"><div class="contactf-name">Seu nome:<input class="contact-form-name" id="ContactForm1_contact-form-name" name="Nome" onblur="if (this.value == "") {this.value = "Nome";}" onfocus="if (this.value == "Nome") {this.value = "";}" size="30" type="text" value="Nome" /></div><div class="contactf-email">E-mail:<input class="contact-form-email" id="ContactForm1_contact-form-email" name="Seu endereço de e-mail aqui" onblur="if (this.value == "") {this.value = "Seu endereço de e-mail aqui";}" onfocus="if (this.value == "Seu endereço de e-mail aqui") {this.value = "";}" size="30" type="text" value="Seu endereço de e-mail aqui:" /></div><div style="clear: both;"></div><div class="contactf-message">Mensagem:<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Digite sua mensagem aqui..." onblur="if (this.value == "") {this.value = "Digite sua mensagem aqui...";}" onfocus="if (this.value == "Digite sua mensagem aqui...") {this.value = "";}" rows="5" value="Digite sua mensagem aqui..."></textarea><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Enviar e-mail" /><div class="contact-form-error-message" id="ContactForm1_contact-form-error-message"></div><div class="contact-form-success-message" id="ContactForm1_contact-form-success-message"></div></div></form></div></div></div>
Deus abençoe sempre a vossa vida e família.
Pastor Antonio Romero Filho
Post Comentários:
0 comentários: