Caixa feed via email personalizado

Muitas pessoas já pediram esse tutorial, como colocar uma caixa personalizada para os visitantes do blog assinarem o feed via email. E o Paulo Estevão do CodigosBlog fez.

Como na imagem abaixo:

1º - Para continuar esse tutorial é necessário que seu blog tenha um feed do FeedBurner;
2º - Copie o código abaixo e cole em algum editor de texto:

<form action="http://www.feedburner.com/fb/a/emailverify" target="popupwindow" method="post"
onsubmit="window.open('http://www.feedburner.com', 'popupwindow',
'scrollbars=yes,width=550,height=520');return true">
<table
border="0" cellpadding="0" cellspacing="0" width="180"
background="http://img137.imageshack.us/img137/9747/feedmc6.jpg"
height="65" align="center">
<tbody><tr>
<td align="right">
<div align="center">
</div>
<div align="center">
<input onfocus="if (this.value == 'Seu email aqui!') {this.value = '';}"
style="border: 1px solid silver; background-image:
url(http://i16.tinypic.com/4tscnxt.gif); background-repeat: repeat-x;
background-attachment: scroll; -moz-background-clip: -moz-initial;
-moz-background-origin: -moz-initial; -moz-background-inline-policy:
-moz-initial; width: 160px;" value="Seu email aqui!" name="email"
onblur="if (this.value == '') {this.value = 'Seu email aqui!';}"
size="25" type="text"/>
<br/>
<input value="http://feeds.feedburner.com/~e?ffid=SEU ID AQUI" name="url"
type="hidden"/><input value="NOME DO BLOG
AQUI"
name="title" type="hidden"/><input value="pt_BR"
name="loc"
type="hidden"/><input value="Assinar"
type="submit"/>
</div></td>
</tr>
</tbody></table>
</form>

3º - Entre na página do seu feed;
Exemplos do InfoBlogui - http://feeds2.feedburner.com/InfoBlogui

4º - Clique com o botão direito do mouse em "Get Códigos Blog delivered by email" depois em "Propriedades"; (Exemplo do feed do cogigosblog)
Exemplo:




5º - Copie o ID do link;
Exemplo:


O fim do link contem alguns dígitos, logo após de id=.
Exemplo: ...id=1066695
Copie esse id e cole no lugar do código onde está escrito: SEU ID AQUI
6º - Entre no painel de controle do blogger, entre em "Layout", "Elementos da Página".
7º - Clique para adicionar um novo widget, escolha "HTML/Java Script". Cole o código.
8º - Salve, teste, se deu certo... pronto!

Por: CodigosBlog