#formulários de contatos - FDC -

óculos

2014-07-15T19:21:00.000-07:00

Seja nosso parceiro!

2014-07-10T15:05:00.001-07:00

. . Parcerias:
banner
120x60

nosso banner ▼

. .

contact

2014-07-10T14:48:00.005-07:00

Preencha os campos abaixo para entrar em contato.
Não esqueça de preencher o campo com seu e-mail para respondermos, se for necessário.

Os campos marcados com "*" são obrigatórios.

ou
através de
email:
envialinks.noticias@gmail.com
-ou-
edihitt@gmail.com

Adicionar manualmente um gadget Disqus para o Blogger

2014-07-10T14:15:00.000-07:00

Adicionar manualmente um gadget Disqus para o Blogger

Se o instalador do aparelho Disqus não está funcionando, você tem a opção de instalar manualmente o gadget em seu site Blogger.

Isso exigirá a edição do seu modelo "HTML" Blogger,

por isso não vai trabalhar com dinâmicas Visualizações modelos.

Adicionar um novo gadget

Vá para a sua seção Blogger "Layout" e clique em Adicionar um gadget na barra lateral
No Adicionar um Gadget pop-up, role para baixo para encontrar o HTML / Javascript no botão gadget e clique em +
Digite o Disqus como o título, e, para o conteúdo, o código a seguir:
```
  <- Disqus gadget de comentários ->
```
Clique em Salvar e fechar a janela
Clique em Salvar arranjo no visualizador de layout

"Adicione o código Disqus ao seu modelo"

Vá até o seu blog Template seção, clique em "Editar HTML" ~~e clique no botão "Editar modelo"~~
Clique dentro da área de texto e pesquisa para o widget que você acabou de criar no seu modelo de HTML, pressionando Ctrl-F (Command-F em OSX), em seguida, digitando Disqus . Você deve encontrar a seguinte linha:
```
  <b:widget id='HTML1' locked='false' title='Disqus' type='HTML'>
```
Altere essa linha para adicionar = móveis 'sim' para carregar Disqus no seu modelo de celular. Ele vai ficar assim quando estiver pronto:
```
  <b:widget id='HTML1' locked='false' mobile='yes' title='Disqus' type='HTML'>
```

Abaixo disso localizar e APAGAR o seguinte código logo antes da tag de fechamento. A seção que você está excluindo deve ficar assim:

  id='main'> <b:includable
  <- Único título de exibição, se é não-vazio ->
  <b:if cond='data:title != ""'>
    <h2 class='title'> <data:title/> </ h2>
  </ B: if>
  <div class='widget-content'>
    <data:content/>
  </ Div>
  <b:include name='quickedit'/>
</ B: includable>

Antes do fechamento </ b: Widget> tag, adicione o seguinte código Disqus (lembre-se de substituir " EXEMPLO "com o seu nome abreviado fórum e não se esqueça de deixar'' 'na frente do seu nome abreviado e''; 'depois).:

  id='main'> <b:includable
            <script type='text/javascript'>
                var disqus_shortname = 'Exemplo';
                var disqus_blogger_current_url = "<data:blog.canonicalUrl/>";

                if (disqus_blogger_current_url.length!) {
                    disqus_blogger_current_url = "<data:blog.url/>";
                }

                var disqus_blogger_homepage_url = "<data:blog.homepageUrl/>";
                var disqus_blogger_canonical_homepage_url = "<data:blog.canonicalHomepageUrl/>";
            </ Script>

            <b:if cond='data:blog.pageType == "item"'>
                <style type='text/css'>
                    # comments {display: none;}
                </ Style>

                <script type='text/javascript'>
                    (Function () {
                        var bloggerjs = document.createElement ('script');
                        bloggerjs.type = 'text / javascript';
                        bloggerjs.async = true;
                        bloggerjs.src = 'http://' + disqus_shortname + '.disqus.com / blogger_item.js';
                        (Document.getElementsByTagName ('head') [0] | | document.getElementsByTagName ('body') [0]) appendChild (bloggerjs).;
                    }) ();

                </ Script>
            </ B: if>
                <style type='text/css'>
                    . Pós-comment-link {visibility: hidden; }
                </ Style>

                <script type='text/javascript'>
                (Function () {
                    var bloggerjs = document.createElement ('script');
                    bloggerjs.type = 'text / javascript';
                    bloggerjs.async = true;
                    bloggerjs.src = 'http://' + disqus_shortname + '.disqus.com / blogger_index.js';
                    (Document.getElementsByTagName ('head') [0] | | document.getElementsByTagName ('body') [0]) appendChild (bloggerjs).;
                }) ();

            </ Script>
</ B: includable>

Clique em Salvar modelo . Assumindo que não há erros, Disqus deve mostrar corretamente em seu site agora.
(Opcional) Verifique se as meta tags em seu Blogger Template não forçar o Internet Explorer para carregar usando padrões IE7. Para mais informações, consulte Solução de problemas Disqus no Internet Explorer 8/9/10

Aprendendo: ...como "Mudar o estilo" de "Formulário de Contato para blogger"

2014-02-01T04:16:00.002-08:00

Aprendendo:

...como "Mudar o estilo" de "Formulário de Contato para blogger"

..." agora temos um novo gadget que vem com o Blogger."

Este é um
"Gadget" "formulário Contato" para Blogger.

◄Este é um formulário de contato que permiteenviar uma mensagem para o administrador do blog.

"Mudando o estilo, de seu formulário de contato no blogger"

...para ver , demonstração,

do novo estilo gerado

para o

modelo mudado, de formulário de contato:

►clica aqui◄

Tutorial:

Primeiro passo:

"Instale em uma página estática, o código do formulário de contato do blogger"

"É muito básico, porque, pelo menos por enquanto, não permite incorporar arquivosou enviar qualquer coisa diferente de texto simples."

"Isto significa que se você já está pensando em um modelo ou código de enviar ao redor"...

..."seu formato é tão simples ...

..."como a forma de instalá-lo."

Tal como acontece com outros dispositivos,

... só precisa ir para o

Design►

Adicionar gadget

e no

pop-out,

selecione :

"Formulário de Contato."
..."ele está na segunda seção do menu à esquerda em

Mais Gadgets"

Aprendendo:

...como "Mudar o estilo"

"Formulário de Contato."

Como o fundo é transparente, o formulário irá integrar-se bem ao template blogger.

..." esteticamente falando,
mas, no entanto,
é facilmente modificados usando
Style Sheets (CSS)
para os seletores apropriados.

Aqui está um exemplo (que testei) ▼

Código de "Exemplo de formulário" com estilo básico:

/* Contenedor general */
.contact-form-widget {
width: 500px;
max-width: 100%;
margin: 0 auto;
padding: 10px;
background: #ddd;
color: #000;
}
/* Cajas para insertar datos y botón de envío */
.contact-form-name, .contact-form-email, .contact-form-email-message, .contact-form-button-submit {
width: 100%;
max-width: 100%;
margin-bottom: 10px;
}
.contact-form-button-submit {
border-color: #fff;
background: #000;
color: #fff;
}

o código acima
deve ser colado acima de
]]></b:skin>

e depois

Salve!

A grande dica

deste tutorial:

...adicionar o gadget,
...cortar o pedaço de código
e,
em seguida,
deve
adicionar o mesmo código
em uma página, no blogger, aonde você posta.

O primeiro adicionar o gadget
e
depois cancelá-lo parcialmente
é porque se Blogger não encontrou o gadget (original) em algum lugar, não carrega o JavaScript que executa.

Como esta dica
quedepois de executar os passos insicdos, neste tutorial,
não   carregá-lo,
mais o form. de contato
em seu local natural (que você colocou antes em seu lay-out).

Então o

primeiro passo

é
adicionar o
gadget (de design)

e
segunda passo

no  modelo (HTML)
para remover ,
a maior parte do gadget

Tendo que:

... procurar a seqüência :

"ContactForm"

implantar o widget
clicando na seta preta
à esquerda (mesmo com o includable)
e exclua
os que você ve na cor
cinza.
no código a seguir de exemplo aqui:


<b:widget id='ContactForm1' locked='false' title='Contacta' type='ContactForm'>
    <b:includable id='main'>
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='contact-form-widget'>
    <div class='form'>
      <form name='contact-form'>
        <p/>
        <data:contactFormNameMsg/>
        BLA, BLA, BLA
        <p/>
        <div style='text-align: center; max-width: 222px; width: 100%'>
          <p class='contact-form-error-message' expr:id='data:widget.instanceId + &quot;_contact-form-error-message&quot;'/>
          <p class='contact-form-success-message' expr:id='data:widget.instanceId + &quot;_contact-form-success-message&quot;'/>
        </div>
      </form>
    </div>
  </div>
  <b:include name='quickedit'/>
</b:includable>
  </b:widget>

Isto é o que deverá ser excluído:
<b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
</b:if>
<div class='contact-form-widget'>
    <div class='form'>
      <form name='contact-form'>
        <p/>
        <data:contactFormNameMsg/>
        <br/>
        <input class='contact-form-name' expr:id='data:widget.instanceId + "_contact-form-name"' name='name' size='30' type='text' value=''/>
        <p/>
        <data:contactFormEmailMsg/> <span style='font-weight: bolder;'>*</span>
        <br/>
        <input class='contact-form-email' expr:id='data:widget.instanceId + "_contact-form-email"' name='email' size='30' type='text' value=''/>
        <p/>
        <data:contactFormMessageMsg/> <span style='font-weight: bolder;'>*</span>
        <br/>
        <textarea class='contact-form-email-message' cols='25' expr:id='data:widget.instanceId + "_contact-form-email-message"' name='email-message' rows='5'/>
        <p/>
        <input class='contact-form-button contact-form-button-submit' expr:id='data:widget.instanceId + "_contact-form-submit"' expr:value='data:contactFormSendMsg' type='button'/>
        <p/>
        <div style='text-align: center; max-width: 222px; width: 100%'>
          <p class='contact-form-error-message' expr:id='data:widget.instanceId + "_contact-form-error-message"'/>
          <p class='contact-form-success-message' expr:id='data:widget.instanceId + "_contact-form-success-message"'/>
        </div>
      </form>
    </div>
</div>
<b:include name='quickedit'/>

...Agora
...Salva!

"No final ..
... não terá  reproduzido  "o todo",
porque deixareis
os dois primeiros códigos

&lt;b:widget id='ContactForm1' locked='false' title='Contacta' type='ContactForm'&gt;
    &lt;b:includable id='main'&gt;

e os dois últimos códigos:

&lt;/b:includable&gt;
  &lt;/b:widget&gt;

...e serão serão suficientes.

"O problema é que,
para o código do
gadget nos ajude a todos,
o tem-se incluídos
as variáveis 
cujos valores Blogger e controles
podem ser acessados somente
se incluirmos essas variáveis
no modelo (antes/primeiro)



... assim,
os dados personalizados
para cada blog
são
reduzidos a zero,
..."pelo menos os mais importantes"

Então,
...substitua ,
os dados
para os
necessários dados seus,

Abreviado só um pouco:

...em uma nova página em branco ,
...com o título que você quiser,
para fazer o trabalho de forma ...

depois...
...cole
esse código:

<div class="widget ContactForm" id="ContactForm1">
<div class="contact-form-widget">
<div class="form">
<form name="contact-form">
<span style="color: blue;"><span style="font-size: x-large;"><b><span style="font-family: Arial,Helvetica,sans-serif;">Seu Nome:</span></b></span></span><br />
<b><span style="font-family: Arial,Helvetica,sans-serif;"><input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="30" type="text" value="" /></span></b><span style="color: red;">
        </span><br />
<span style="color: red;"><span style="font-size: x-large;"><b><span style="font-family: Arial,Helvetica,sans-serif;">Seu email</span></b></span></span><br />
<b><span style="font-family: Arial,Helvetica,sans-serif;">(não será divulgado*)</span></b><br />
<b><span style="font-family: Arial,Helvetica,sans-serif;">
        <span style="color: #274e13;"><span style="font-size: x-large;"><input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="30" type="text" value="" />
        </span></span></span></b><span style="color: #274e13;"><span style="font-size: x-large;"><b><span style="font-family: Arial,Helvetica,sans-serif;"> </span></b></span></span><br />
<span style="color: #274e13;"><span style="font-size: x-large;"><b><span style="font-family: Arial,Helvetica,sans-serif;">Mensagem *</span></b></span></span><br />
<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="email-message" rows="5"></textarea>
        <input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Enviar" />
        <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>
<br /></form>
</div>
</div>
</div>

Nota:
troque no código acima que está nas cores :
vermelha
azul e
verde
com seus dados preferidos!

"E para verificá-la, veja como ficou, nesta página "aonde eu fiz um teste."

É uma conta que não usa, então não espere resposta."

►clica aqui◄
vepara ver o "modelo mudado":

"Se ocorrerem mudanças no código , este "gadget dica"...pode parar de trabalhar,

...mas pode valer

para sempre "

fonte de consulta:
oloblogger

Novidade!..."blogger"..."Introduzido um novo "Formulário de contato" " widget "

2013-05-17T08:25:00.002-07:00

Introduzido um novo "Formulário de contato"
" widget " .

Se um leitor entra em um

nome válido,

endereço de e-mail

e mensagem no formulário,

o proprietário do blog

vai receber a mensagem

através do seu e-mail de registro.

Para instalar o "widget" do Blogger

... dashboard,

...selecione:

Layout>

adicionar um gadget.

O Widget de formulário de contato

está localizado na aba

"Mais Gadgets".

Formulário de contato Novidade!
Adicione um widget de formulário de contato a seu blog.
Por Blogger

Compartilhada publicamente -

por

Blogger

Sobre o novo gadget

... não é configurável

... segue as cores predominantes do template.

Para adicionar

novo gadget

"formulário de contato" ->

...no "lay-out"

...clicar em

"adicionar gadget".

- Escolha mais gadgets

...clicar em

formulário de contato.

...Salvar.

Fill out my form!

2013-05-12T13:33:00.000-07:00

Fill out my form!

fale conosco

2013-05-12T12:56:00.006-07:00

fale conosco:

Powered byEMF Online Form

modelo de menu horizontal para blogger:testesdemenusesubmenus

2013-05-10T20:26:00.001-07:00

modelo de menu horizontal para blogger:testesdemenusesubmenus

Já viram/visitaram?

2013-05-02T19:52:00.001-07:00

Já viram/visitaram?

contato, contacte-nos, dúvidas, sugestões

2013-05-02T18:54:00.000-07:00

formulario de contactos en html5

HTML5 Form

ou
email:
envialinks.noticias@gmail.com

fale conosco

2013-05-02T18:53:00.000-07:00

fale conosco - FDC

-ou-

email:

envialinks.noticias@gmail.com

aguinha para a pyxy

2013-02-28T20:51:00.001-08:00

http://pyxylindynha.blogspot.com.br/

O formulário de contato para seu website com proteção anti-spam integrada!

2012-07-03T16:08:00.000-07:00

você está em>>Home>>website, anti-spam integrada ,formulário de contato simples, dicas, blog, blogger

brfoxyform

O formulário de contato para seu website com proteção anti-spam integrada!

faça um para você colocar em seu blog/site,com antispam

▼

clique aqui

Você escolhe seu modelo!

* O nosso formulário de contato ficou assim:

formulário de contato

Responder Comentário Padrão do Blogger em "templates personalizados"...saiba como ativar opção

2012-01-16T04:51:00.000-08:00

Responder Comentário

Padrão

do Blogger

"templates personalizados"

...saiba como ativar opção...

Nos templates padrão, antigo blogger, e/ou templates personalizados...

Veja os passos a seguir:

"Opção de respostas nos "comentários de blogs" do "blogger"

template (inglês)=modelo (potuguês)

Em Blogs mais antigos, para que essa função funcione,
a troca é realizada em parte de um código no HTML,
de seus blogs/modelos.

Os comentários que tem a opção de resposta aos comentários ,
a comentários feitos, por outra pessoa/comentador, no blog da gente; a resposta aparecerá logo abaixo do comentário da outra pessoa/comentador, ocorrendo assim um debate, entre comentaristas nos "blogs".

Então:

Para que a opção de "responder comentários" funcione em "blogs/ sites, que utilizam a plataforma blogger.

Passo 1:

A opção de "responder comentários",
para funcionar direitinho...
...necessário se faz, que seja trocada parte de um código no HTML de seu template, sendo que deve ser prestada atenção, em virtude do mesmo, se encontrar em dois lugares no HTML,
para trocá-los, nos dois lugares em que ocorre o código supra.

Daí,

para quem utiliza versão de interface antiga do blogger, e/ou templates personalizados:

    Logar em seu blog... (blogger.com), na interface antiga.

    Clicar em Design;

    Clicar em Editar HTML;

    Executar um backup de teu código, clicando em Baixar Modelo completo;

    Na caixinha, do lado direito, superior,clicar em Expandir modelos de Widget.

    Encontre os códigos
▼

<b:if cond='data:blog.pageType == "static_page"'>
              <b:include data='post' name='comments'/>
            </b:if>
            <b:if cond='data:blog.pageType == "item"'>
              <b:include data='post' name='comments'/>
            </b:if>

Pressione, ao mesmo tempo, as teclas de atalho , em seu teclado:

Ctrl

F

e use parte do código para encontrá-los.

Passo 2

No local encontrado, código acima , troque
pelo código a seguir:

     <b:if cond='data:blog.pageType == "static_page"'>
              <b:if cond='data:post.showThreadedComments'>
                <b:include data='post' name='threaded_comments'/>
              <b:else/>
                <b:include data='post' name='comments'/>
              </b:if>
            </b:if>
            <b:if cond='data:blog.pageType == "item"'>
              <b:if cond='data:post.showThreadedComments'>
                <b:include data='post' name='threaded_comments'/>
              <b:else/>
                <b:include data='post' name='comments'/>
              </b:if>
            </b:if>

Pronto!
Visualize
Estando tudo certinho!
Salve!

NOTA:

Não encontrando o código:

<b:if cond='data:blog.pageType == "static_page"'>
              <b:include data='post' name='comments'/>
            </b:if>
            <b:if cond='data:blog.pageType == "item"'>
              <b:include data='post' name='comments'/>
            </b:if>

Buscar por:

<b:include data='post' name='post'/>

ao encontrá-lo,
cole-o
logo após:

     <b:if cond='data:blog.pageType == "static_page"'>
              <b:if cond='data:post.showThreadedComments'>
                <b:include data='post' name='threaded_comments'/>
              <b:else/>
                <b:include data='post' name='comments'/>
              </b:if>
            </b:if>
            <b:if cond='data:blog.pageType == "item"'>
              <b:if cond='data:post.showThreadedComments'>
                <b:include data='post' name='threaded_comments'/>
              <b:else/>
                <b:include data='post' name='comments'/>
              </b:if>
            </b:if>

Visualize!

Estando tudo certinho!
Salve!

Novidades:..." Blogger lança Responder Comentários!"

2012-01-11T20:11:00.000-08:00

Novidades:...

" Blogger lança Responder Comentários!"

..."lançado o famoso recurso

de “Responder Comentários” na plataforma de blogs

Blogger"

Mas existe um pequeno

detalhe que os usuários da plataforma de blogs Blogger

não vão gostar de saber, esse recurso de “Responder

Comentários” que foi lançado hoje, só está disponível

para os usuários que utilizam os templates padrões do

Blogger no seu blog.

..."basicamente não mudou nada com o lançamento

desse recurso, pois a maioria dos usuários do Blogger

utilizam os templates feitos por terceiros, que até agora

não vão ter acesso ao recurso. "

..."Se está usando um template do Blogger

e o sistema de

“Responder Comentários”

não está funcionando ainda,

verifique em

Configurações => Postagens e comentários "

..."se em Local do comentário está marcado como

“Incorporado“,

também verifique em Configurações =>

Outro

se em

Permitir feed de blog está marcado como

“Completa“.

fonte e créditos:
sitecaseiro

... Intensedebate ... Mensagens / Recados / Comentarios...

Comments

Logging you in...

Close Login with your OpenID Or create an account using OpenID

Back

Cancel Login

Dashboard | Edit profile | Logout

Logged in as ebds1

There are no comments posted yet. Be the first one!

Post a new comment

Tweet this comment

Connected as (Logout)

Email (optional)

Not displayed publicly.

Posting as ebds1 (Logout)

Submit Comment

Subscribe to

volte sempre

Comments by IntenseDebate

receba em seu email...formulários de contato..

2012-01-09T17:29:00.000-08:00

receba em seu email...formulários de contato...
é grátis!
subscreva-nos

... Intensedebate ... Mensagens / Recados / Comentarios...

Comments

Logging you in...

Close Login with your OpenID Or create an account using OpenID

Back

Cancel Login

Dashboard | Edit profile | Logout

Logged in as ebds1

There are no comments posted yet. Be the first one!

Post a new comment

Tweet this comment

Connected as (Logout)

Email (optional)

Not displayed publicly.

Posting as ebds1 (Logout)

Submit Comment

Subscribe to

volte sempre

Comments by IntenseDebate

"Sistema de comentários"... Saiba..."Como usar o Intense Debate e comentar como um profissional"...

2012-01-09T17:04:00.000-08:00

..." novo post explicando como aproveitar melhor o Intense Debate"' ...

" ... você pode comentar usando o login do Twitter ou mesmo de forma anônima" ... " ... boas vantagens de se cadastrar no Intense Debate."

Você tá falando COMIGO?

No painel de controle, em " account" , há duas opções interessantes: cheque essas caixinhas se você quiser receber um e-mail quando alguém responder um comentário seu ou quando você tiver novos seguidores (O ID também tem essa história do Twitter).

Quem é você?

"   Ainda em Edit Profile, vá em "   profile".   Lá você pode escolher o seu "    display name", que é o que vai aparecer do lado do seu avatar. Note que mesmo que você escollha um username" ...
      ..."   esdrúxulo ou alguém já tenha usado o login" ...

   ..."    você ainda pode configurar o display name que desejar."

"   Não precisa de underline, ponto ou algo assim."

Mostre sua cara!

..." não precisa se preocupar com o Gravatar.

Acompanhe os comentários da forma que quiser

" Logo antes de começar os comentários, depois do post, há opções de " sort by" .

Em "    Date",   a opção padrão, a ordem é do mais antigo pro mais novo.

Em    "   rating"    você pode ver os comentários que tiveram mais polegares pra cima. "

"   Em "   Activity"    você vê primeiro os comentários mais recentes ou os que tiveram réplica mais recente."

..." não esqueça: clicando em    "   retweet "    você já cai na página do Twitter para espalhar a mensagem"   ..."    para o mundo."

Receba atualizações por e-mail

"    Apareceu no nosso quadro "   Os maiores Geeks"   e não quer entrar no site toda hora pra ver se mais alguma pessoa te chamou de lindo? "

"   Seus problemas praticamente acabaram"

"   Lá embaixo, onde logo depois da área de escrever o comentário, há a opção "    subscribe".               Se você selecionar " replies", você receberá no seu e-mail não só a notificação de que alguém comentou seu comentário, como a íntegra do texto - você não precisa voltar ao site. Se você quer receber todos os comentários de algum post que te interessa muito diretamente no seu e-mail, é só selecionar o " All new comments"    na caixinha drop down.

fonte e créditos:

http://www.gizmodo.com.br/

intensedebate...

2012-01-09T17:01:00.000-08:00

"Política de Privacidade - Google AdSense"

2012-01-09T17:00:00.000-08:00

Já tem instalado no teu blog/site?

2012-01-09T16:59:00.000-08:00

Fonte:

http://intensedebate.com

220x52px Copy the code below the badge you like and paste it on your blog/site.

<a href="http://intensedebate.com/?badge=small&user=edileneamor" title="Go to IntenseDebate"><img src="http://s.intensedebate.com/images/intensedebate-badge-small.png?=3" alt="Go to IntenseDebate" /></a>
<a href="http://intensedebate.com/?badge=small_blue&user=edileneamor" title="Go to IntenseDebate"><img src="http://s.intensedebate.com/images/intensedebate-badge-small_blue.png?=3" alt="Go to IntenseDebate" /></a>
<a href="http://intensedebate.com/?badge=small_grey&user=edileneamor" title="Go to IntenseDebate"><img src="http://s.intensedebate.com/images/intensedebate-badge-small_grey.png?=3" alt="Go to IntenseDebate" /></a>

220x180px Copy the code below the badge you like and paste it on your blog/site.

<a href="http://intensedebate.com/?badge=big&user=edileneamor" title="Go to IntenseDebate"><img src="http://s.intensedebate.com/images/intensedebate-badge-big.png?=3" alt="Go to IntenseDebate" /></a>
<a href="http://intensedebate.com/?badge=big_blue&user=edileneamor" title="Go to IntenseDebate"><img src="http://s.intensedebate.com/images/intensedebate-badge-big_blue.png?=3" alt="Go to IntenseDebate" /></a>
<a href="http://intensedebate.com/?badge=big_grey&user=edileneamor" title="Go to IntenseDebate"><img src="http://s.intensedebate.com/images/intensedebate-badge-big_grey.png?=3" alt="Go to IntenseDebate" /></a>

250x190px Copy the code below the badge you like and paste it on your blog/site.

<a href="http://intensedebate.com/?badge=bigwide&user=edileneamor" title="Go to IntenseDebate"><img src="http://s.intensedebate.com/images/intensedebate-badge-bigwide.png?=3" alt="Go to IntenseDebate" /></a>
<a href="http://intensedebate.com/?badge=bigwide_blue&user=edileneamor" title="Go to IntenseDebate"><img src="http://s.intensedebate.com/images/intensedebate-badge-bigwide_blue.png?=3" alt="Go to IntenseDebate" /></a>
<a href="http://intensedebate.com/?badge=bigwide_grey&user=edileneamor" title="Go to IntenseDebate"><img src="http://s.intensedebate.com/images/intensedebate-badge-bigwide_grey.png?=3" alt="Go to IntenseDebate" /></a>

Aprender a fazer: "Crie um formulário de contato simples HTML5"

2012-01-09T16:54:00.000-08:00

fonte e créditos:

http://landonmiller.net/

articles/2010/10/create-a-simple-html5-contact-form/

" Create a Simple HTML5 Contact Form"

After reading up on HTML5 and hearing all the buzz, I decided to take a few minutes and create a simple form to help me learn a little more about it and maybe share a few things along the way. Accompanying me are 12 new input types, most of which I don’t use in this form, but are pretty snazzy.

There’s new input types

At the time of this post the input types being supported by the newer browsers are email, url, tel, search, number, and range. The types only supported by Opera are date, datetime, datetime-local, month, week, and time.
What’s so great about them? Well, the thing that sticks out the most to me so far is Mobile Safari’s integration with the e-mail, tel, and url input types. If you are using an iPhone and hit a HTML5 form field utilizing an url type your keyboard will display the special keyboard with a “.com” button. This doesn’t really help people with .net domain extensions, but it’s a step in the right direction. The same goes with email types – a keyboard with an “@” button will appear making it easier to fill out. The tel input type will display the iPhone’s number pad.

Getting started

To get started we need to build a basic HTML5 page and a form that utilizes the new input types and the stylesheet to keep it looking good.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>HTML5 Form</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div id="contact-form">    
<form id="contact" method="post" action="">
<fieldset>    
<label for="name">Name</label>
<input type="text" name="name">
<label for="email">E-mail</label>
<input type="email" name="email">
<label for="phone">Phone</label>
<input type="text" name="phone">
<label for="website">Website</label>
<input type="url" name="url">
<label for="message">Question/Comment</label>
<textarea name="message"></textarea>
<input type="submit" name="submit" id="submit" value="Send Message" />
</fieldset>
</form>
</div><!-- /end #contact-form -->
</body>
</html>

Let’s add some placeholders

More than likely you have seen placeholders that up until now have been strictly JavaScript driven. With HTML5, we only have to use JavaScript as a fall back.

<label for="name">Name</label>
<input type="text" name="name" placeholder="Full Name">
<label for="email">E-mail</label>
<input type="email" name="email" placeholder="name@domain.com">
<label for="phone">Phone</label>
<input type="tel" name="phone" placeholder="ex. (555) 555-5555">
<label for="website">Website</label>
<input type="url" name="url" placeholder="http://">

Use Modernizr to handle the fallbacks

I’ve been using Modernizr as a fallback because, well, it makes my life easy. It will detect if a browser supports a HTML5 feature and if it doesn’t, it allows you to handle it appropriately. To handle the placeholder fallback we are going to use Modernizr and mix in some jQuery goodness with the placeholder plugin by Daniel Stocks.

<script src="js/jquery.placeholder.js"></script>
<script src="js/modernizr-min.js"></script>
<script>
if (!Modernizr.input.placeholder){
 $('input[placeholder], textarea[placeholder]').placeholder();
}
</script>

Client-side Validation

HTML5 offers some great validation, but unfortunately it’s currently only fully supported by Opera. Firefox should have it in version 4 and Chrome has it halfway implemented which really doesn’t make sense to me. While testing native validation on this form, Chrome will validate the form and won’t allow it to be submitted, but will not display a message telling the user why. This can be confusing and it’s why I am using a jQuery validation plugin for it. Start by adding the validation class to the fields. The title will display the error message text that your user will see.

<input type="text" name="name" placeholder="Full Name" title="Enter your name" class="required">
<input type="email" name="email" placeholder="yourname@domain.com" title="Enter your e-mail address" class="required email">

In the final front-end step I’ll use the jQuery form plugin in conjunction with the validation plugin to pass the form to the server side process.php via ajaxSubmit.

<script src="js/jquery.form.js"></script>
<script src="js/jquery.validate.js"></script>
<script>
$(function(){
$('#contact').validate({
submitHandler: function(form) {
$(form).ajaxSubmit({
url: 'process.php',
success: function() {
$('#contact').hide();
$('#contact-form').append("<p class='thanks'>Thanks! Your request has been sent.</p>")
}
});
}
});
});
</script>

That’s pretty much it

HTML5 offers a ton a robust new features and I have barely grazed the surface with its capabilities in this tutorial. I’m sure there will be more to share along the way. I’d like to give a special thanks to Chris Coyier for letting me reference his tutorial for help with the ajax portion of this post.
The download includes a stylesheet to spruce up the new form and a basic server side form processor, but you might want to apply some server side validation as well.

Crie um formulário de contato simples HTML5

Depois de ler sobre HTML5 e ouvir todo o zumbido, eu decidi tomar alguns minutos e criar um formulário simples para me ajudar a aprender um pouco mais sobre ele e talvez partilhar algumas coisas ao longo do caminho. Que me acompanham são 12 tipos de entrada de novos, a maioria das quais eu não uso desta forma, mas são muito snazzy.

Há tipos de entrada de novos

No momento deste post os tipos de entrada a ser compatíveis com os navegadores mais recentes são e-mail, url, tel, pesquisa, númeroE intervalo. Os únicos tipos suportados pelo Opera são data, datetime, datetime local, Mês, semanaE tempo.
O que há de tão grande sobre eles? Bem, a coisa que se destaca a mais para mim até agora é a integração do Mobile Safari com o e-mail, telE url tipos de entrada. Se você estiver usando um iPhone e bateu em um campo de formulário utilizando um HTML5 url digite o seu teclado irá exibir o teclado especial com um ". com" botão. Isto realmente não ajuda as pessoas com. extensões net, mas é um passo na direção certa. O mesmo acontece com e-mail tipos - um teclado com um "@" botão aparecerá tornando mais fácil de preencher o. tel tipo de entrada será exibida teclado do iPhone de número.

Primeiros passos

Para começar, precisamos construir uma página HTML 5 e um formulário básico que utiliza os tipos de entrada e os novos estilos para manter a aparência boa.

<! DOCTYPE html>
<html lang="En">
<cabeça>
<meta charset="Utf-8">
<título> HTML5 </ formtítulo>
<link rel="Stylesheet" href="Css / style.css">
</cabeça>
<corpo>
<div id="Formulário de contacto">    
<forma id="Contato" método="Post" ação="">
<fieldset>    
<etiqueta para="Nome"Nome> </etiqueta>
<Entrada tipo="Texto" nome="Nome">
<etiqueta para="Email"<> E-mail /etiqueta>
<Entrada tipo="Email" nome="Email">
<etiqueta para="Telefone"Telefone> </etiqueta>
<Entrada tipo="Texto" nome="Telefone">
<etiqueta para="Site"Website> </etiqueta>
<Entrada tipo="Url" nome="Url">
<etiqueta para="Mensagem"Pergunta> </ Comentário /etiqueta>
<textarea nome="Mensagem"></textarea>
<Entrada tipo="Submit" nome="Submit" id="Submit" valor="Enviar mensagem" />
</fieldset>
</forma>
</div><-! / End # formulário de contato ->
</corpo>
</html>

Vamos adicionar alguns espaços reservados

Mais do que provável que você já viu marcadores que até agora tem sido estritamente JavaScript conduzido. Com HTML5, só temos de usar JavaScript como um retrocesso.

<etiqueta para="Nome"Nome> </etiqueta>
<Entrada tipo="Texto" nome="Nome" espaço reservado="Nome Completo">
<etiqueta para="Email"<> E-mail /etiqueta>
<Entrada tipo="Email" nome="Email" espaço reservado="Name@domain.com">
<etiqueta para="Telefone"Telefone> </etiqueta>
<Entrada tipo="Tel" nome="Telefone" espaço reservado="Ex. (555) 555-5555">
<etiqueta para="Site"Website> </etiqueta>
<Entrada tipo="Url" nome="Url" espaço reservado="http://">

Use Modernizr para lidar com a fallbacks

Eu tenho usado Modernizr como um retorno porque, bem, isso faz minha vida mais fácil. Ele irá detectar se o navegador oferece suporte a um recurso HTML5 e se isso não acontecer, ele permite que você manipulá-lo adequadamente. Para lidar com o retorno do espaço reservado que vamos usar e Modernizr misturar em algum bondade jQuery com o espaço reservado plugin por Ações Daniel.

<script src="Js / jquery.placeholder.js"></script>
<script src="Js / modernizr-min.js"></script>
<script>
if (! Modernizr.input.placeholder) {
 $ ('Input [espaço reservado], textarea [espaço reservado]') marcador ().;
}
</script>

Validação do lado do cliente

HTML5 oferece algumas validações grande, mas infelizmente é actualmente apenas totalmente suportado pelo Opera. Firefox deve tê-lo na versão 4 e Chrome tem metade implementado, o que realmente não faz sentido para mim. Embora os testes de validação nativo deste formulário, o Chrome irá validar a forma e não vai permitir que ele seja apresentado, mas não irá mostrar uma mensagem dizendo ao usuário o porquê. Isto pode ser confuso e é por isso que eu estou usando um validação jQuery plugin para isso. Comece por adicionar a classe de validação para os campos. O título será exibido o texto da mensagem de erro que o usuário vai ver.

<Entrada tipo="Texto" nome="Nome" espaço reservado="Nome Completo" título="Digite seu nome" classe="Necessária">
<Entrada tipo="Email" nome="Email" espaço reservado="Yourname@domain.com" título="Digite seu endereço de e-mail" classe="E-mail necessária">

Na etapa final-de-final frente vou usar o jQuery forma plugin em conjunto com a validação plugin para passar o formulário para o lado do servidor process.php via ajaxSubmit.

<script src="Js / jquery.form.js"></script>
<script src="Js / jquery.validate.js"></script>
<script>
$ (Function () {
$ ('# Contato "). Validate ({
function (form) {: submitHandler
$ (Formulário). AjaxSubmit ({
url: 'process.php,
function () {: sucesso
$ ('# Contato ") hide ().;
$ ('# Formulário de contato "). Append (" <p classe='Obrigado'> Obrigado! Seu pedido foi enviado. </p>")
}
});
}
});
});
</script>

Isso é muito bonito

"HTML5 oferece uma tonelada características nova e robusta, e eu tenho quase roçou a superfície com as suas capacidades neste tutorial. Tenho certeza que haverá mais partes ao longo do caminho. Eu gostaria de dar um agradecimento especial a Chris Coyier para deixar me referência o seu tutorial para ajudar com a parte ajax deste post.
O download inclui uma folha de estilo para enfeitar o novo formulário e um formulário de base de servidor com processador lado, mas você pode quiser aplicar algumas validação do lado do servidor também.''

Deixe uma resposta Cancelar resposta

"Powered by Disqus"

2012-01-09T16:50:00.000-08:00

Como fazer formulário de contato para Blogger

2012-01-09T16:44:00.000-08:00

"   Como fazer formulário de contato para Blogger"

..." como cada blog usa a página de contato lá blog para permitir que os leitores de contatá-los para as consultas e as dificuldades que eles enfrentam ou querendo alguma ajuda ou quer patrocinar não use etc. "

" Many site para escrever e-mail id só lá na página de contato para contatá-los, u , mas precisa de uma forma também de olhar mais proffesional e tornar a comunicação mais fácil entre você e seu readers.As que não é difícil agora para adicionar formulário de contato para blogger como já tenho que escrever os códigos para fazer a forma e , em seguida, hospedá-lo e todos e , em seguida, começar forma made.But agora há vários sites começaram este serviço que dão pronto formas que lhe são feitas ."

" O que você tem a fazer é ir a estes sites, precisa se inscrever lá e obter os códigos para obter os códigos form.
" Depois, vá para editar páginas no seu blog e fazer novos page."
"
There publicar os códigos para formar e escrever também se você quer escrever algo e publicar it.its muito fácil."

" Serviços que permitem que você use existem formas de contato para livre."

1) Kontactr

Basta ir a este site.Sign lá em cima, obter os códigos e adicioná-los às páginas do Blogger e publicá-lo para fazer uma página de contato.

2) Emailmeform

Basta ir lá se inscrever e obter os códigos de form.As aqui você vai ter mais recursos em forma de sites.As outros que também dão opção para cada tipo de formulário e também uma opção para os leitores a fazer upload de algumas coisas para o formulário e envie vocês.

3) FoxyForm

Não há necessidade de se inscrever basta ir até lá este site preencher os detalhes, personalizar as cores, dar -mail para receber os códigos .

4)Wufoo

Este serviço também o bem que você pode simplesmente experimentá-lo também para sure.But dá 100 entradas por mês só para encher.

..."   Outros serviços disponíveis fornecer de forma livre ... são: "...

123contactform
Freecontactform
Webformdesigner
Mycontactform
Wrasap

Instalação

" Só a partir de todos os serviços acima , selecione uma que você deseja use.Sign até lá para receber os códigos para o formulário."

" Agora basta ir ao blogger Destacamento Editar> Páginas > New Page ."

" Dar o título para a página de contato e os códigos de post em post forma e publicar it.Your formulário de contato está pronto agora para run.Enjoyyy !!!!! "

fonte e créditos:

http://www.anshuldudeja.com/

2010/09/how-make-contact-form-for-blogger.html

... Intensedebate ... Mensagens / Recados / Comentarios...

Comments

Logging you in...

Close Login with your OpenID Or create an account using OpenID

Back

Cancel Login

Dashboard | Edit profile | Logout

Logged in as ebds1

There are no comments posted yet. Be the first one!

Post a new comment

Tweet this comment

Connected as (Logout)

Email (optional)

Not displayed publicly.

Posting as ebds1 (Logout)

Submit Comment

Subscribe to

volte sempre

Comments by IntenseDebate

"Implante formulários de contato em seu site em um piscar de olhos"

2012-01-09T16:36:00.000-08:00

" Formulário de contato"...

" LinkWS,

instale gratuitamente

LinkWS "

" Implante formulários de contato em seu site em um piscar de olhos"

#formulários de contatos - FDC -

óculos

Seja nosso parceiro!

contact

Adicionar manualmente um gadget Disqus para o Blogger

Adicionar manualmente um gadget Disqus para o Blogger

Adicionar um novo gadget

"Adicione o código Disqus ao seu modelo"

Artigos relacionados

Aprendendo: ...como "Mudar o estilo" de "Formulário de Contato para blogger"

Aprendendo:

...como "Mudar o estilo" de "Formulário de Contato para blogger"

Novidade!..."blogger"..."Introduzido um novo "Formulário de contato" " widget "

Blogger

Fill out my form!

fale conosco

modelo de menu horizontal para blogger:testesdemenusesubmenus

Já viram/visitaram?

contato, contacte-nos, dúvidas, sugestões

fale conosco

fale conosco - FDC

aguinha para a pyxy

O formulário de contato para seu website com proteção anti-spam integrada!

O formulário de contato para seu website com proteção anti-spam integrada!

Responder Comentário Padrão do Blogger em "templates personalizados"...saiba como ativar opção

Novidades:..." Blogger lança Responder Comentários!"

Forgot password?

Comments

Post a new comment

receba em seu email...formulários de contato..

Forgot password?

Comments

Post a new comment

"Sistema de comentários"... Saiba..."Como usar o Intense Debate e comentar como um profissional"...

intensedebate...

"Política de Privacidade - Google AdSense"

Já tem instalado no teu blog/site?

220x52px Copy the code below the badge you like and paste it on your blog/site.

220x180px Copy the code below the badge you like and paste it on your blog/site.

250x190px Copy the code below the badge you like and paste it on your blog/site.

Aprender a fazer: "Crie um formulário de contato simples HTML5"

" Create a Simple HTML5 Contact Form"

There’s new input types

Getting started

Let’s add some placeholders

Use Modernizr to handle the fallbacks

Client-side Validation

That’s pretty much it

Leave a Reply Cancel reply

Crie um formulário de contato simples HTML5

Há tipos de entrada de novos

Primeiros passos

Vamos adicionar alguns espaços reservados

Use Modernizr para lidar com a fallbacks

Validação do lado do cliente

Isso é muito bonito

Deixe uma resposta Cancelar resposta

"Powered by Disqus"

Como fazer formulário de contato para Blogger

Instalação

Forgot password?

Comments

Post a new comment

"Implante formulários de contato em seu site em um piscar de olhos"

" Implante formulários de contato em seu site em um piscar de olhos"