✎ INFOWEB-IVEC

1 - Para inserir um formulário de contato em uma página estática do Blog, vá ao painel de controle do Blogger e acesse a aba Layout e em Inserir Gadget, busque e acrescente um formulário de contato. Arraste o formulário inserido para a parte inferior do layout.

2 - Agora precisamos ocultar o formulário adicionado. Para esta tarefa, abra o editor de HTML do seu blog e procure pela tag ]]></b:skin>.

Acima dela cole o seguinte código e salve:

 #ContactForm1 {display: none! Important;}

3 - Agora, crie a nova página para o formulário de contato e cole nela o seguinte código de formulário padrão:

 <center>  
 <form name='contact-form'>  
 <div>Seu Nome:</div>  
 <input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>  
 <br/><br/>  
 <div>Seu E-mail: <em>(obrigatório)</em></div>  
 <input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>  
 <br/><br/>  
 <div>Sua mensagem: <em>(obrigatório)</em></div>  
 <textarea class='contact-form-email-message' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>  
 <p></p>  
 <input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Enviar Mensagem'/>  
 <div style='text-align: center; max-width: 450px; width: 100%'>  
 <p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>  
 <p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>  
 </div>  
 </form>  
 </center>

Caso queira um formulário com estilos e cores personalizadas, utilize os códigos abaixo:

 <style type="text/css">  
 .contact-form-widget{  
 margin-left:auto;  
 margin-right:auto;  
 width:100%;  
 max-width:100%;  
 padding:0;  
 }  
 hr{  
 position:relative;  
 height:.75em;  
 border:0;  
 overflow:hidden;  
 margin:0;  
 }  
 hr:before{  
 content:"";  
 display:block;  
 position:absolute;  
 top:0;left:0;  
 height:.75em;  
 width:5.1em;  
 background:#C4DD83;  
 box-shadow:5em 0 0 0 #F4FCC9,10em 0 0 0 #FDCD78,15em 0 0 0 #ED786F,20em 0 0 0 #D99DBF,25em 0 0 0 #C39EDC,30em 0 0 0 #679DE2,35em 0 0 0 #62C2E3,40em 0 0 0 #F4FCC9,45em 0 0 0 #FDCD78,50em 0 0 0 #ED786F,55em 0 0 0 #D99DBF,60em 0 0 0 #C39EDC; /* CORES DO TOPO */  
 }  
 .contactf-name,.contactf-email{float:left;width:49.25%}  
 .contactf-name{margin-right:1.5%}  
 .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:25px 0 0;  
 padding:10px;  
 font-size:15px; /* TAMANHO DA FONTE DOS CAMPOS PREENCHÍVEIS */  
 color:#cccccc; /* COR DA FONTE DOS CAMPOS PREENCHÍVEIS */  
 border-color:#E8E8E8; /* COR DA BORDA DOS CAMPOS PREENCHÍVEIS */  
 border-width:2px 2px 4px;  
 -webkit-box-shadow:none;  
 -moz-box-shadow:none;  
 box-shadow:none;  
 }  
 .contact-form-name,.contact-form-email{height:40px}  
 .contact-form-email-message{height:100px}  
 .contact-form-button-submit,.contact-form-button-submit:hover{  
 margin-top:25px;  
 width:100%;  
 height:40px;  
 font-size:15px; /* TAMANHO DA FONTE DO BOTÃO ENVIAR MENSAGEM*/  
 color:#ffffff; /* COR DA FONTE DO BOTÃO ENVIAR MENSAGEM */  
 text-align:center;  
 text-shadow:0 1px 2px rgba(0,0,0,0.25);  
 background:#35617d; /* COR DO BOTÃO ENVIAR MENSAGEM */  
 border:0;  
 border-bottom:2px solid #1c4c6a; /* COR DA BORDA DO BOTÃO ENVIAR MENSAGEM */  
 outline:none;  
 cursor:pointer;  
 -webkit-box-shadow:inset 0 -2px #1c4c6a; /* COR DA BORDA DO BOTÃO ENVIAR MENSAGEM */  
 box-shadow:inset 0 -2px #1c4c6a; /* COR DA BORDA DO BOTÃO ENVIAR MENSAGEM */  
 }  
 .contact-form-button-submit:active{top:1px;outline:none;-webkit-box-shadow:none;box-shadow:none}  
 .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">  
 <hr />  
 <div class="form">  
 <form name="contact-form">  
 <div class="contactf-name">  
 <input class="contact-form-name" id="ContactForm1_contact-form-name" name="Nome" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Nome&quot;;}" onfocus="if (this.value == &quot;Name&quot;) {this.value = &quot;&quot;;}" size="30" type="text" value="Nome" /></div>  
 <div class="contactf-email">  
 <input class="contact-form-email" id="ContactForm1_contact-form-email" name="Endereço de e-mail" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Endereço de e-mail&quot;;}" onfocus="if (this.value == &quot;Endereço de e-mail&quot;) {this.value = &quot;&quot;;}" size="30" type="text" value="Endereço de e-mail" /></div>  
 <div style="clear: both;">  
 </div>  
 <div class="contactf-message">  
 <textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Type your message here..." onblur="if (this.value == &quot;&quot;) {this.value = &quot;Digite sua mensagem aqui...&quot;;}" onfocus="if (this.value == &quot;Digite sua mensagem aqui...&quot;) {this.value = &quot;&quot;;}" rows="5" type="text" value="Digite sua mensagem aqui..."></textarea><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Enviar mensagem" /><br />  
 <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>

 <style type="text/css">  
 .contact-form-widget{  
 margin-left:auto;  
 margin-right:auto;  
 width:600px;  
 max-width:100%}  
 .contactf-name,.contactf-email{float:left;width:50%}.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:0 0 15px;  
 padding:10px;  
 font-size:14px;  
 color:#777;  
 background:#f4f4f4;  
 border:1px solid #eeeeee;  
 -webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;  
 -webkit-border-radius:20px;  
 -moz-border-radius:20px;  
 border-radius:20px}  
 .contact-form-name,.contact-form-email{height:33px}  
 .contact-form-email-message{height:130px}  
 .contactf-message{position:relative}  
 .contactf-message:after,.contactf-message:before{  
 border-bottom:50px solid transparent;  
 border-left:80px solid #f4f4f4;  
 bottom:-32px;  
 content:'';  
 position:absolute;  
 right:50%;  
 margin-right:-100px}  
 .contactf-message:before{  
 border-left:80px solid #eeeeee;  
 bottom:-34px;  
 right:50.3%;  
 margin-right:-101px}  
 .cbluebutton{  
 margin-top:25px;  
 width:30%;  
 height:35px;  
 float:right;  
 font-size:15px;  
 color:#fff;  
 display:inline-block;  
 text-align:center;  
 background:linear-gradient(to bottom,#FF0073 0%,#B70052 100%);  
 box-shadow:0 1px 1px rgba(255,0,115,0.5);  
 border:0;  
 -webkit-border-radius:20px;  
 -moz-border-radius:20px;  
 border-radius:20px}  
 .cbluebutton span .contact-form-button-submit{  
 background:linear-gradient(to bottom,#FF0073 0%,#B70052 100%);  
 font:bold 16px "Helvetica Neue",sans-serif;  
 height:35px;  
 width:100%;  
 color:#ffffff;  
 display:inline-block;  
 cursor:pointer;  
 outline:none;  
 -webkit-border-radius:20px;  
 -moz-border-radius:20px;  
 border-radius:20px}  
 .contact-form-button-submit:active{top:1px;outline:none;-webkit-box-shadow:none;box-shadow:none}  
 .contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;width:11px !important;height:11px !important;}  
 </style>  
 <div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget"><div class="form"><form name="contact-form"><div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Message" rows="5" value="Digite sua mensagem aqui" onblur='if (this.value == "") {this.value = "Digite sua mensagem aqui";}' onfocus='if (this.value == "Digite sua mensagem aqui") {this.value = "";}'></textarea>  
 </div>  
 <div class="cbluebutton"><span><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Enviar" /></span></div><div class="contactf-name"><input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="Nome" onblur='if (this.value == "") {this.value = "Nome";}' onfocus='if (this.value == "Nome") {this.value = "";}' /></div><div class="contactf-email"><input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="E-mail" onblur='if (this.value == "") {this.value = "E-mail";}' onfocus='if (this.value == "E-mail") {this.value = "";}'/></div><div style="clear:both"></div><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>

 <style type="text/css">  
 .contact-form-widget{  
 margin-left:auto;  
 margin-right:auto;  
 width:600px;  
 max-width:100%;  
 padding:25px;  
 background:#fff;  
 }  
 .contact-title{  
 text-align:center;  
 font:41px fantasy;  
 color:#121212;  
 margin-bottom:25px}  
 .contactf-name,.contactf-email{  
 float:left;width:47%}  
 .contactf-name{margin-right:6%}  
 .name-icon img,.email-icon img{background:transparent!important;border:medium none!important;box-shadow:none!important;padding:11px 0!important;width:16px !important;height:16px !important;}  
 .name-icon,.email-icon{position:absolute;z-index:1}  
 .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:0 0 25px;  
 padding:10px 10px 10px 25px;  
 font:bold 16px cursive;  
 text-shadow:0 1px 2px #ddd;  
 color:#121212;  
 background:transparent!important;  
 border-color:#121212;  
 border-width:0 0 2.5px;  
 -webkit-box-shadow:none;  
 -moz-box-shadow:none;box-shadow:none}  
 .contact-form-name,.contact-form-email{height:40px}.contact-form-email-message,.contact-form-email-message:hover,.contact-form-email-message:focus{padding:10px!important}  
 .contact-form-email-message{height:150px;border-width:2.5px!important}  
 .contact-form-button-submit,.contact-form-button-submit:hover{  
 background:#121212!important;  
 width:30%;  
 height:37px;font:bold 13px "Lucida Grande";  
 letter-spacing:2px;  
 color:#fff;  
 text-align:center;  
 border:medium none;cursor:pointer;display:block;margin:0 auto;outline:none}  
 .contact-form-cross{border:medium none!important;box-shadow:none!important;padding:0!important;width:11px !important;height:11px !important;}  
 </style>  
 <div class="widget ContactForm" id="ContactForm22"><div class="contact-form-widget">  
 <div class="form"><form name="contact-form"><div class="contactf-name"><input class="contact-form-name" id="ContactForm1_contact-form-name" name="Name" size="30" type="text" value="Name" onblur='if (this.value == "") {this.value = "Name";}' onfocus='if (this.value == "Name") {this.value = "";}' /></div><div class="contactf-email"><input class="contact-form-email" id="ContactForm1_contact-form-email" name="Endereço de e-mail" size="30" type="text" value="Endereço de e-mail" onblur='if (this.value == "") {this.value = "Endereço de e-mail";}' onfocus='if (this.value == "Endereço de e-mail") {this.value = "";}'/></div><div style="clear:both"></div><div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Escreva sua mensagem aqui..." rows="5" value="Escreva sua mensagem aqui..." onblur='if (this.value == "") {this.value = "Escreva sua mensagem aqui...";}' onfocus='if (this.value == "Type your message here...") {this.value = "";}'></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>

 <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:#cc1473;  
 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"><strong class="ribbon-content">Fale com a gente!</strong></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" size="30" type="text" value="Nome" onblur='if (this.value == "") {this.value = "Nome";}' onfocus='if (this.value == "Nome") {this.value = "";}' /></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" size="30" type="text" value="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 = "";}'/></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..." rows="5" value="" placeholder="Digite sua mensagem aqui..." value="Digite sua mensagem aqui..." onblur='if (this.value == "") {this.value = "Digite sua mensagem aqui...";}' onfocus='if (this.value == "Digite sua mensagem aqui...") {this.value = "";}'></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>

 <style type="text/css">  
 .contact-form-widget{  
 margin-left:auto;  
 margin-right:auto;  
 width:600px;  
 max-width:100%;  
 padding:40px 0}  
 .contactf-name,.contactf-email{float:left;width:48.25%}  
 .contactf-name{margin-right:3.5%}  
 .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:0 0 20px;  
 padding:10px 15px;  
 font-size:14px;  
 letter-spacing:1px;  
 color:#444;  
 background:#F3F3F3;  
 border:medium none;  
 -webkit-box-shadow:none;  
 -moz-box-shadow:none;  
 box-shadow:none}  
 .contact-form-name,.contact-form-email{height:37px}  
 .contact-form-email-message{height:170px}  
 .contact-form-button-submit,.contact-form-button-submit:hover{  
 width:19%;  
 height:30px;  
 font:normal 14px Arial;  
 letter-spacing:1px;  
 color:#fff;  
 display:block;  
 outline:none;  
 margin-bottom:20px;  
 text-align:center;  
 background:#35617d;  
 border:0;cursor:pointer}  
 .contact-form-button-submit:active{outline:none;-webkit-box-shadow:none;box-shadow:none}  
 .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">  
 <div class="form">  
 <form name="contact-form">  
 <div class="contactf-name">  
 <input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="Seu nome aqui" onblur='if (this.value == "") {this.value = "Seu nome aqui";}' onfocus='if (this.value == "Seu nome aqui") {this.value = "";}' />  
 </div>  
 <div class="contactf-email">  
 <input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="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 = "";}'/></div>  
 <div style="clear:both"></div>  
 <div class="contactf-message"><textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5" value="Mensagem aqui" onblur='if (this.value == "") {this.value = "Mensagem aqui";}' onfocus='if (this.value == "Mensagem aqui") {this.value = "";}'></textarea></div><input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Enviar" /><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></form></div></div></div>

 <style>  
 .tb-contact-form-widget{  
 background-color:#444;  
 color:#ffffff;  
 padding:25px;  
 }  
 .srbtn{display:inline-block;}  
 .cform-button, .btn-reset{  
 background-color:#f1f1f1;  
 padding:5px 30px;  
 }  
 .cform-button:hover {  
 background-color: #35617d;  
 color: #fff;  
 }  
 .btn-reset:hover {  
 background-color: #8b0a00;  
 color: #fff;}  
 .tb-contact-form-widget h3{  
 text-align:center;  
 margin:20px 0;  
 padding:10px 0;  
 border-top: 1px dotted #f5f5f5;  
 }  
 .c-form-name, .c-form-email {  
 width: 50%;  
 max-width: 50%;  
 margin-bottom: 10px;  
 padding: 10px;  
 border: 1px solid #CCC;  
 border-radius: 5px;  
 -moz-border-radius: 5px;  
 -webkit-border-radius: 5px;  
 -moz-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;  
 -webkit-box-shadow: 0 1px 1px #CCC inset, 0 1px 0 #FFF;  
 box-shadow: 0 1px 1px #CCC inset, 0 1px 0 #FFF;  
 }  
 .c-form-email-message {  
 width: 95%;  
 max-width: 95%;  
 margin-bottom: 10px;  
 padding: 10px;  
 border: 1px solid #CCC;  
 border-radius: 5px;  
 box-shadow: 0 1px 1px #CCC inset, 0 1px 0 #FFF;  
 -moz-border-radius: 5px;  
 -webkit-border-radius: 5px;  
 -moz-box-shadow: 0 1px 1px #ccc inset, 0 1px 0 #fff;  
 -webkit-box-shadow: 0 1px 1px #CCC inset, 0 1px 0 #FFF;  
 }  
 .c-form-name, .c-form-email, .c-form-email-message input:focus{  
 background-color: #FFF;  
 box-shadow: 0 0 0 1px #ccc inset;  
 border-color: #ccc;  
 outline: none;  
 -moz-box-shadow: 0 0 0 1px #cccc inset;  
 -webkit-box-shadow: 0 0 0 1px #ccc inset;}  
 .b-social-buttons{list-style-type:none;text-align:center;}  
 .b-social-buttons li{  
 display:inline-block;  
 padding:15px;  
 background-color:#f5f5f5;  
 border-radius:5px;  
 }  
 .b-social-buttons li a{  
 color:#333;  
 text-decoration:none;  
 }  
 #ContactForm1_contact-form-success-message, #ContactForm1_contact-form-error-message{  
 width:100%;  
 margin-top:35px;  
 }  
 </style>  
 <div class="tb-contact-form-widget"> <form name="contact-form"> <div class="form-name"><span><i class="fa fa-pencil-square-o"></i> Seu nome: </span><br /><input class="c-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" /></div> <div class="form-email"><span><i class="fa fa-envelope-o"></i> Endereço de e-mail: </span><br /><input class="c-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" /></div><div style="clear: both;"></div><div class="form-message"> <span><i class="fa fa-keyboard-o"></i> Mensagem:</span><br /> <textarea class="c-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea><div class="srbtn"><input class="cform-button" id="ContactForm1_contact-form-submit" type="button" value="Enviar" /><input type="reset" class="btn-reset" value="Limpar" /></div><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>  
 <h3>Redes sociais</h3>  
 <ul class="b-social-buttons">  
 <li><a href="ENDEREÇO DO SEU INSTAGRAM" class="btn-lg"><i class="fa fa-instagram"><span class="network-name">Instagram</span></i></a></li>  
 <li><a href="ENDEREÇO DO SEU FACEBOOK" class="btn-lg"><i class="fa fa-facebook"> <span class="network-name">Facebook</span></i></a></li>  
 <li><a href="ENDEREÇO DO SEU TWITTER" class="btn-lg"><i class="fa fa-twitter"><span class="network-name">Twitter</span></i></a></li>  
 <li><a href="ENDEREÇO DO CANAL YOUTUBE" class="btn-lg"><i class="fa fa-youtube-play"><span class="network-name">Youtube</span></i></a></li>  
 </ul>  
 </div>  
 </form>  
 </div>

LEIA MAIS >>

Abra o painel de edição do seu blog, procure o menu lateral "layout" clique em "adicionar um gadget" e em seguida escolha escolha "HTML/JavaScript" - No quadro aberto cole o código abaixo. Deixe o espaço para título em branco. Abra o blog e veja o rodapé.

Altere (a seu critério) o numero de paginas exibidas por vez no rodapé e o número de postagens a serem exibidas em cada página.

var numshowpage=2;

var postperpage =4;

 <style type="text/css">  
 #blog-pager{  
 padding:10px 0;  
 font:13px 'poppins' !important;  
 clear:both;}  
 .showpageArea{  
 font-family:'poppins', arial,helvetica;  
 color:#000;  
 font:13px 'poppins' !important;  
 margin:10px}  
 .showpageArea a{  
 color:#000}  
 .showpageNum a{  
 padding:3px 8px;  
 margin:0 2px;  
 text-decoration:none;  
 border:1px solid #e7e7e7;  
 background:#fff;  
 color:#222;}  
 .showpageNum a:hover{  
 border:1px solid #F76C96;  
 color: #fff !important;  
 background:#8B0000}  
 .showpageOf{  
 margin:0 2px 0 0;  
 padding:3px 8px;  
 margin:0 2px;  
 text-decoration:none;  
 border:0px solid transparent;  
 color: #000!important;  
 background:transparent}  
 .showpagePoint{  
 color:#fff;  
 padding:3px 8px;  
 margin:2px;  
 border:1px solid #F76C96;  
 background:#8B0000;   
 text-decoration:none}  
 </style>  
 <br />  
 <script style='text/javascript'>  
 var numshowpage=2;  
 var postperpage =4;  
 var upPageWord="◄";  
 var downPageWord="►";  
 var home_page="/";  
 var urlactivepage=location.href;  
 </script><br />  
 <script>  
 eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('6 I;6 i;6 g;6 n;1f();C 1g(15){6 5=\'\';J=K(N/2);4(J==N-J){N=J*2+1}A=g-J;4(A<1)A=1;d=K(15/j)+1;4(d-1==15/j)d=d-1;D=A+N-1;4(D>d)D=d;5+="<3 7=\'1z\'>1A "+g+\' 1B \'+d+"</3>";6 16=K(g)-1;4(g>1){4(g==2){4(i=="o"){5+=\'<3 7="e"><a 9="\'+B+\'">\'+O+\'</a></3>\'}b{5+=\'<3 7="e"><a 9="/r/s/\'+n+\'?&c-k=\'+j+\'">\'+O+\'</a></3>\'}}b{4(i=="o"){5+=\'<3 7="e"><a 9="#" v="L(\'+16+\');w x">\'+O+\'</a></3>\'}b{5+=\'<3 7="e"><a 9="#" v="M(\'+16+\');w x">\'+O+\'</a></3>\'}}}4(A>1){4(i=="o"){5+=\'<3 7="e"><a 9="\'+B+\'">1</a></3>\'}b{5+=\'<3 7="e"><a 9="/r/s/\'+n+\'?&c-k=\'+j+\'">1</a></3>\'}}4(A>2){5+=\' ... \'}1h(6 l=A;l<=D;l++){4(g==l){5+=\'<3 7="1C">\'+l+\'</3>\'}b 4(l==1){4(i=="o"){5+=\'<3 7="e"><a 9="\'+B+\'">1</a></3>\'}b{5+=\'<3 7="e"><a 9="/r/s/\'+n+\'?&c-k=\'+j+\'">1</a></3>\'}}b{4(i=="o"){5+=\'<3 7="e"><a 9="#" v="L(\'+l+\');w x">\'+l+\'</a></3>\'}b{5+=\'<3 7="e"><a 9="#" v="M(\'+l+\');w x">\'+l+\'</a></3>\'}}}4(D<d-1){5+=\'...\'}4(D<d){4(i=="o"){5+=\'<3 7="e"><a 9="#" v="L(\'+d+\');w x">\'+d+\'</a></3>\'}b{5+=\'<3 7="e"><a 9="#" v="M(\'+d+\');w x">\'+d+\'</a></3>\'}}6 17=K(g)+1;4(g<d){4(i=="o"){5+=\'<3 7="e"><a 9="#" v="L(\'+17+\');w x">\'+1i+\'</a></3>\'}b{5+=\'<3 7="e"><a 9="#" v="M(\'+17+\');w x">\'+1i+\'</a></3>\'}}5+=\'<1j 7="1D-1E"><a 9="1F://1G.1H.1I" 1J="1K-1L: 1M; 1N: 1O; 1P: 1Q;" 1R="1S"></a></1j>\';6 E=y.1W("E");6 18=y.1X("1Y-1Z");1h(6 p=0;p<E.P;p++){E[p].1k=5}4(E&&E.P>0){5=\'\'}4(18){18.1k=5}}C 1a(Q){6 R=Q.R;6 1l=K(R.21$22.$t,10);1g(1l)}C 1f(){6 h=u;4(h.f("/r/s/")!=-1){4(h.f("?S-c")!=-1){n=h.F(h.f("/r/s/")+14,h.f("?S-c"))}b{n=h.F(h.f("/r/s/")+14,h.f("?&c"))}}4(h.f("?q=")==-1&&h.f(".5")==-1){4(h.f("/r/s/")==-1){i="o";4(u.f("#G=")!=-1){g=u.F(u.f("#G=")+8,u.P)}b{g=1}y.1m("<m T=\\""+B+"U/V/W?c-k=1&X=Y-Z-m&11=1a\\"><\\/m>")}b{i="s";4(h.f("&c-k=")==-1){j=20}4(u.f("#G=")!=-1){g=u.F(u.f("#G=")+8,u.P)}b{g=1}y.1m(\'<m T="\'+B+\'U/V/W/-/\'+n+\'?X=Y-Z-m&11=1a&c-k=1" ><\\/m>\')}}}C L(H){12=(H-1)*j;I=H;6 13=y.1n(\'1o\')[0];6 z=y.1p(\'m\');z.1q=\'1r/1s\';z.1t("T",B+"U/V/W?1u-1v="+12+"&c-k=1&X=Y-Z-m&11=1b");13.1w(z)}C M(H){12=(H-1)*j;I=H;6 13=y.1n(\'1o\')[0];6 z=y.1p(\'m\');z.1q=\'1r/1s\';z.1t("T",B+"U/V/W/-/"+n+"?1u-1v="+12+"&c-k=1&X=Y-Z-m&11=1b");13.1w(z)}C 1b(Q){1c=Q.R.24[0];6 1x=1c.1y.$t.F(0,19)+1c.1y.$t.F(23,25);6 1d=26(1x);4(i=="o"){6 1e="/r?S-c="+1d+"&c-k="+j+"#G="+I}b{6 1e="/r/s/"+n+"?S-c="+1d+"&c-k="+j+"#G="+I}27.9=1e}',62,132,'|||span|if|html|var|class||href||else|max|maksimal|showpageNum|indexOf|nomerhal|thisUrl|jenis|postperpage|results|jj|script|lblname1|page|||search|label||urlactivepage|onclick|return|false|document|newInclude|mulai|home_page|function|akhir|pageArea|substring|PageNo|numberpage|nopage|nomerkiri|parseInt|redirectpage|redirectlabel|numshowpage|upPageWord|length|root|feed|updated|src|feeds|posts|summary|alt|json|in||callback|jsonstart|nBody||banyakdata|prevnomer|nextnomer|blogPager||hitungtotaldata|finddatepost|post|timestamp|alamat|halamanblogger|loophalaman|for|downPageWord|div|innerHTML|totaldata|write|getElementsByTagName|head|createElement|type|text|javascript|setAttribute|start|index|appendChild|timestamp1|published|showpageOf|♦|DE|showpagePoint|w2b|pagenav|||||style|font|size|7pt|float|right|margin|10px|target|_blank||||getElementsByName|getElementById|blog|pager||openSearch|totalResults||entry|29|encodeURIComponent|location'.split('|'),0,{}))  
 </script>

LEIA MAIS >>

PESQUISAR NESTE SITE

ARQUIVO DO BLOG

MAIS LIDAS

FALE CONOSCO!