Box Facebook E Assinar Feed Personalizada

Nesta postagem compartilho com vocês esta box personalizada com duas box juntas. Assim, você economiza espaço em seu blog.

Torne-se membro do site, basta clicar no botão abaixo e clicar em Seguir:

Para colocar no Blogger

Entre em "Layout" - "Adicionar um Gadget" - "HTML/JavaScript" e cole o seguinte código:

<style>
#email-form {
    background: none repeat scroll 0 0 padding-box #313131;
    border-bottom: 5px solid #202020;
    border-radius: 2px 2px 2px 2px;
    text-shadow: 0 -1px 0 #000000;}
#email-form h6 {
    color: #FFFFFF;
    font-family: arial;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 0;
    padding: 15px 20px 0;
    text-transform: none;}
#email-form form {
    color: #FFFFFF;
    margin: 0;
    padding: 20px 18px;}
#email-form input.input-text {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #222222;
    margin: 0 0 10px;
    padding: 8px;
    width: 94%;font-family: tahoma;}
#email-form .button {
background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%);
background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#FFCA00),color-stop(1,#FF9B00));
background: -moz-linear-gradient(center top,#FFCA00 0,#FF9B00 100%);
-pie-background: linear-gradient(270deg,#ffca00,#ff9b00);
font-family: "tahoma","Helvetica",sans-serif;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border: 1px solid #CC7C00;
color: #FFF;
text-shadow: #D08D00 1px 1px 0;
font-weight: bold;
font-size: 12px;
width: 100px;
height: 30px;
cursor: pointer;
margin: 0 auto;
border-image: initial;
}
#email-form p {
    color: #CCCCCC;
    font-size: 12px; font-family: tahoma;
    line-height: 18px;
    margin: 0;}
</style>
<div id='email-form'>

<style>
a.ShadowBloggerDicasHotX {
font:normal 20px Impact,Arial,Sans-Serif;
background:transparent;
  color:#ccc;
  text-decoration:none;
  text-shadow:1px 1px 0px #000,0 0 0px #000,0 0 0px #000,0 0 0px #000;
  -webkit-transition:all .5s ease-out;
  -moz-transition:all .5s ease-out;
  -o-transition:all .5s ease-out;
  transition:all .5s ease-out;
}
a.ShadowBloggerDicasHotX:hover {
  color:#fff;
  text-shadow:
    0px 1px 0px #000,
    0px 0px 3px #000,
    0px 0px 5px #000,
    0px 0px 30px #000,
    0px 3px 50px #000;
}
</style>
<center><a class="ShadowBloggerDicasHotX" href="http://dicashot.blogspot.com/">Curta nossa Página!</a></center>

<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fdicashot&amp;width=300&amp;height=258&amp;colorscheme=dark&amp;show_faces=true&amp;header=false&amp;stream=false&amp;show_border=false&amp;appId=216502231893793" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>

<style>
a.ShadowBloggerDicasHotX {
font:normal 20px Impact,Arial,Sans-Serif;
background:transparent;
  color:#ccc;
  text-decoration:none;
  text-shadow:1px 1px 0px #000,0 0 0px #000,0 0 0px #000,0 0 0px #000;
  -webkit-transition:all .5s ease-out;
  -moz-transition:all .5s ease-out;
  -o-transition:all .5s ease-out;
  transition:all .5s ease-out;
}
a.ShadowBloggerDicasHotX:hover {
  color:#fff;
  text-shadow:
    0px 1px 0px #000,
    0px 0px 3px #000,
    0px 0px 5px #000,
    0px 0px 30px #000,
    0px 3px 50px #000;
}
</style>
<center><a class="ShadowBloggerDicasHotX" href="http://dicashot.blogspot.com/">Receba atualizações!</a></center>

<form action='http://feedburner.google.com/fb/a/mailverify' class='nice custom' method='post' onsubmit='window.open(&#39;http://feedburner.google.com/fb/a/mailverify?uri=DicasHot&#39;, &#39;popupwindow&#39;, &#39;scrollbars=yes,width=550,height=520&#39;);return true' target='popupwindow'>
<input class='input-text' name='email' onblur='if (this.value == &#39;&#39;) {this.value = &#39; Digite seu e-mail aqui ...&#39;;}' onfocus='if (this.value == &#39;Digite seu e-mail aqui ...&#39;) {this.value = &#39;&#39;;}' type='text' value='Digite seu e-mail aqui...'/>
<input name='uri' type='hidden' value='DicasHot'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='button' type='submit' value='Assinar'/>
<br/>
<span style='font-family: tahoma; font-weight: bold;'>
</span>
</form>
<div style="text-align: right;">
<span style="font-size: xx-small;"><span style="color: #444444;">Widget by </span><a href="http://dicashot.blogspot.com.br/" target="_blank"><span style="color: #666666;">DicasHot</span></a></span></div>
</div>

Nas partes destacadas de azul, você irá colocar o nome do seu blog. Tendo feito isto, está pronto!!!