Tweet Gadget Para Redes Socias Com caixa de Busca

 O Blogger Templates & Tricks nos oferece um gadget muito interessante que inclui uma caixa de busca acoplada, além dos botões de subscrição do FeedBurner, inscrições via email, botões de redes sociais ( Digg, Twitter , Facebook, Delicious ) para partilhar os seus artigos, entre as redes sociais. Os botões de redes sociais são alimentados por www.addthis.com.
Você não precisa mudar nada no código da caixa de pesquisa .Para adicionar esse widget na barra lateral do Blogger , sem fazer qualquer modificação , a largura da barra lateral deve ter pelo menos 305 px de largura. Você pode adicionar este gadget de pesquisa em seu blog seu blog Blogger em poucos minutos, é muito fácil de configurar. Vejamos como:




Faça login, clique em "Design" depois em "Editar HTML"
Copie o código abaixo e cole ANTES da tag </head>

<style type="text/css">
.subbox{width:305px;border:0 solid #141414;overflow:hidden}
.addthis_toolbox{padding:15px 0 5px 0;text-align:center}
.addthis_toolbox .custom_images a{width:32px;height:32px;margin:0 4px 0 4px;padding:0}
.addthis_toolbox .custom_images a:hover img{opacity:1}
.addthis_toolbox .custom_images a img{opacity:0.85}
.rssbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}
.rssbox:hover{border:1px solid #92aed1}
.rssbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
.rssbox a:hover{color:#7c8a9b;text-decoration:underline}
.emailsbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}
.emailsbox:hover{border:1px solid #92aed1}
.emailsbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
.emailsbox a:hover{color:#7c8a9b;text-decoration:underline}
.twitterbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}
.twitterbox:hover{border:1px solid #92aed1}
.twitterbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
.twitterbox a:hover{color:#7c8a9b;text-decoration:underline}
.facebookbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}
.facebookbox:hover{border:1px solid #92aed1}
.facebookbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
.facebookbox a:hover{color:#7c8a9b;text-decoration:underline}
#search{width:290px;padding:2px 2px;background:#f7f6f6;border:1px solid #ccd1d7;height:28px;margin-top:0;margin-left:5px;display:inline;float:left}
#search:hover{border:1px solid #92aed1}
#search form{margin:0;padding:0}
#search fieldset{margin:0;padding:0;border:none}
#search p{margin:0;font-size:85%}
#s{width:200px;margin:0 0 0 0;padding:5px 5px 5px 5px;border:none;font:normal 80% &quot;Tahoma&quot;,Arial,Helvetica,sans-serif;color:#000;float:left;background:#f7f6f6;display:inline}
input#searchsubmit{float:right;display:inline;margin:0 0 0 0;height:28px;background:#b2b2b2;color:#000;border:0 solid #222}
</style>

Salve o template e volte a sua página Design, clique em adicionar um gadget, escolha a opção "HTML/Javascript ", copie o código abaixo e cole dentro do box do gadget. Salve e pronto.

<div class="subbox">
<div id='search' style='display:inline;'>
<form action='/search' id='searchform' method='get'>
<input id="s" name="q" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Search...&quot;;}" onfocus="if (this.value == &quot;Search...&quot;) {this.value = &quot;&quot;;}" type="text" value="Search..." />
<input id="searchsubmit" type="submit" value="Search" />
</form>
</div>
<table><tr>
<td><div class="rssbox">
<a href="http://feeds.feedburner.com/FEEDBURNER-ID" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV-PO2cHf_tVVpb4icNaoEUaH78ap_49-ItS6S94wTxG0uA8Lro6a53ibN1jFL4Yp-5iFzbu0IdrjYMUMwa12qElLuTEjlMmLlbnIz5yCx3k8h3cNhf7kiQweQYJ1xtl-o23-_dpC1XgLA//" alt="RSS Feed" title="RSS Feed" style="vertical-align:middle; margin-right: 5px;border:none;" /></a><a href="http://feeds.feedburner.com/FEEDBURNER-ID" target="_blank" rel="nofollow">RSS Feed</a>
</div></td>
<td><div class="emailsbox">
<a href="http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNER-ID" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiseGAoCw-bv_3L4TJAtNpzRxRmh4jwcsLtzgyaPsb1VrcccL-tdiNvRUJ4BUu_YrgFQqQO9TTce011hECCDgDJ7GeAjdYjYpRoq6E7jErE8Gn6TnMDMuXvWsL_UidgPlKG4HMTYty-wjdM//" alt="EMail Feed" title="EMail Feed" style="vertical-align:middle; margin-right: 5px;border:none;" /></a><a href="http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNER-ID" target="_blank" rel="nofollow">EMail Feed</a>
</div></td>
</tr><tr>
<td><div class="twitterbox">
<a href="http://twitter.com/TWITTER-USERNAME" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiS4cNdKLjzJvGt4KKWlzzq11o2vcV4af635DoefRVmR1MfPNexog5u556HGaL1a5SMxP9B3i16lrZTa6Nd1x_qxZNvn8nriW26W5gxrzkRkCqnq57tJ5x0AwcbA6wqBvPKSTHVbYj5Oc-y//" alt="Twitter" title="Twitter" style="vertical-align:middle; margin-right: 5px;border:none;" /></a><a href="http://twitter.com/TWITTER-USERNAME" target="_blank" rel="nofollow">Twitter</a>
</div></td>
<td><div class="facebookbox">
<a href="http://www.facebook.com/FACEBOOK-USERNAME" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8DQu4t227KXjNAj4MI35RpS_KKNnaH7a4ibo3S-kOCrPERyXzr22Yaz-lRcN_i8dCqMM7WULdrwIEDlOMFt2-lN5L3Gia5WTi6B0OBk5UUtmCKL4Rj02iaAawiusqE2yVEhj6kQp5Eng5//" alt="Facebook" title="Facebook" style="vertical-align:middle; margin-right: 5px;border:none;" /></a><a href="http://www.facebook.com/FACEBOOK-USERNAME" target="_blank" rel="nofollow">Facebook</a>
</div></td>
</tr></table>
<p style="display:none;" align="center">Widget by <a href="http://www.bloggertipandtrick.net/" target="_blank">Blogger Tips And Tricks</a></p>
<div class='addthis_toolbox'>
<div class='custom_images'>
<a class='addthis_button_twitter'><img alt='Twitter' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgluz6ctxsBNskLauMaNqusdw5hBdjCcPntWRrY_-uY4a8XzJHZ2yDAtPl4UrKziH3HDjcjuDLFvGB-8suEkVtDDDv6wOQDLekLLssReU8Pr3vX83C2uVH4o6viwv-evayzCb76Q7pYy4g//' width='32'/></a>
<a class='addthis_button_delicious'><img alt='Delicious' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBPglpa0Qa75799JeSMd_ot9ElEB9CN8PUYF8FzLMzoKS1QHm62v1VFUA23jDccmNi0ajTlBGxoh2c4u26ThU6zTDoayxDwg67LEIga9EbJEzT-PixaBDjVBzrdASjsulVQQjaMAE_vgg//' width='32'/></a>
<a class='addthis_button_facebook'><img alt='Facebook' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyzNl0ds_nnxUwfam3R32F0_WaoSwzh_g0GqCRhqFfLlnnmJaouL44uHbpKMYArVywakKfpxyb7AHF84n0CjctJWJtvy2y2VrRWOi6GlfomGOeObaIpMF7mTbGiOR-eSox6cQ5hr4us5o//' width='32'/></a>
<a class='addthis_button_digg'><img alt='Digg' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBa5KV40nb241sAxCpXUxA258r-y14b741WiUj86DrgC3QuInNB6Deh9ZQHmNiYGqIFt8PkzWyWoLT7s83RqK7R8w5nmrF_POXvKUX4hkC-5Xqt4ulQjMMwGl193Fv1Xh0jVMO4-Xy9Yw//' width='32'/></a>
<a class='addthis_button_stumbleupon'><img alt='Stumbleupon' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjJk5H3VL7Gc-SoxLykX6v4i4LtyOt_PnnqL1daFn_8GiluJymhJ7TO6w22i2tSqgodat5xhyphenhyphennucMW0x6R1Pnp2Y75HKdbcyVdaIOts6Y-opJLlDEGqntfHWMqe16CQ1l3uc_Q651V_eg//' width='32'/></a>
<a class='addthis_button_favorites'><img alt='Favorites' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQwF1uzs6emfpdHdA6wMFxlb4jOEIA3h_7dztXCRSOAiDhSPbSF_zAxebyDUPw4zeI7js-mcS8vhTOnqAQdyb6L3QmEUzFGydzfFBbXovtTX5r0o5qQ_HerDgv8ZD0beW5LjpYImq3bPQ//' width='32'/></a>
<a class='addthis_button_more'><img alt='More' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-VB54vz4PNmz1X5PxOJd_GrBpbMPQYFnQBl5MIGW2J-KtnXnuiTGAHGNFhfHjqg7_Ax5hk4z6SL0Il0uBbMKPTb3yO4fITlspFiqkxcoL3ahTT_N5fPdq_AjsKfFRyRiArSwezF5Z8is//' width='32'/></a>
</div>
<script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/>
</div>
</div>

Configure as partes grifadas:

 FEEDBURNER-ID ► Seu Feedburner ID.(4 vezes).
TWITTER-USERNAME ►Seu Twitter username.
FACEBOOK-USERNAME ►Seu Facebook username.

Caso você tenha algum conhecimento de html e CSS, poderá fazer algumas mudançs para adequar melhor ao seu layout.
É isso. Beijo da Mama♥

Leia mais...

Tweet Share Sidebar – Botões Fixos Para Compartilhar Posts

ShareSidebar nos permite colocar uma barra lateral fixa com botões e contadores sociais para que os leitores possam compartilhar suas postagens em várias redes sociais de maneira muito simples e fácil. Veja um exemplo AQUI

Como você pode ver na imagem, você pode escolher de que lado deseja exibir a barra, esquerdo (left) ou direito (right). Pode escolher em qual site deseja seus posts compartilhados, Facebook, Twitter, Delicious, Digg, Google Buzz, StumbleUpon, Reddit y Yahoo Buzz.

Quando o leitor corre a página, a barra permanece sempre a vista para facilitar. Também tem um visual claro que não incomoda, é bem prático. Clique na imagem para ser direcionado ao ShareSidebar

 

Depois de ter configurado como quiser, você só precisa clicar em GET THE CODE. Na página seguinte, copie todo o código da janela.

 

 

Para colocar no Blogger é muito simples. Faça login, clique em Design e em “Adicionar um gadget”. Escolha a opção “HTML/Javascript” e cole o código dentro dele.

Prontinho! Vai estar lá sua barra de compartilhamento fixa!

Fácil né? Espero que seja útil.

Beijo da Mama ♥

Leia mais...

Tweet Gadget com Ícones Fixos Com Efeito JQuery

Como colocar um simpático  conjunto de ícones, em gadget fixo na lateral do blog, com efeito JQuery (deslizante), desenhado em CSS.
Encontrei em um site Árabe Blogspacetech há alguns meses, esse truque muito bacana para atrair  e estimular os leitores a assinarem os feeds, acompanhar o blog em redes sociais, fazer contato, etc. Peguei os códigos, fiz umas adaptações e vou ensinar como instalar.
Você pode ver em ação NESTA página.
Vamos lá:
Copie todo o código CSS abaixo. Observe que você poderá alterar as cores de fundo e bordas do botão, se quiser, assim como substituir os ícones por outros modelos. No site FIND ICONS você encontra uma enorme variedade de ícones para tudo o que imaginar.

ul#menusisi {
position:fixed;
margin:0;
padding:0;
top:50px;
left:0;
list-style:none;
z-index:9999;
}
ul#menusisi li {
width:100px;
}
ul#menusisi li a {
display:block;
margin-left:-50px;
width:100px;
height:55px;
background-color:#141414;  /* Cor de fundo do botão */
background-repeat:no-repeat;
background-position:48px center;
border:1px solid #cfcfcf;  /* Cor da borda do botão*/
-moz-border-radius:0px 10px 10px 0px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-top-right-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-top-right-radius: 10px;
/*-moz-box-shadow: 0px 4px 3px #000;
-webkit-box-shadow: 0px 4px 3px #000;
*/
opacity:0.8;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
}
ul#menusisi .home a {
background-image:url(http://lh6.ggpht.com/_xcD4JK_dIjU/S9BJaBfhOhI/AAAAAAAAD_0/nV3ITEV9d3M/d/nav_home.png);
}
ul#menusisi .twitter a {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiXAAm5bieadJ7tTtS6olRFTCCxkTr2MBO7qDCeH4dTFZWUNyU4T_e7FrGmqQ8dKKrU-sEaHwDIYSfGMMy9bH-badE93cVVPi7X3C3CA_7YuIayvPupgNSp_Xs740yKduc-s-2C-zdQvY/s1600/1283728665_twitter_47.png);
}
ul#menusisi .comentários a {
background-image:url(http://lh3.ggpht.com/_xcD4JK_dIjU/S9BJaFyqDGI/AAAAAAAAD_w/pNO6TUSigBg/d/nav_comment.png);
}
ul#menusisi .rssfeed a {
background-image:url(http://lh3.ggpht.com/_xcD4JK_dIjU/S9BJaabJhzI/AAAAAAAAEAA/Oo4mhwCwzbI/d/nav_rss.png);
}
ul#menusisi .contato a {
background-image:url(http://lh6.ggpht.com/_xcD4JK_dIjU/S9BJaVZkksI/AAAAAAAAD_8/g5fo6OKT5wE/d/nav_mail.png);
}

Dentro da página “Editar HTML”  Cole o código CSS ANTES/ACIMA do seguinte código:

]]></b:skin>

Agora copie o Script abaixo:

<script src='http://www.google.com/jsapi'/>
<script>
google.load(&quot;jquery&quot;, &quot;1.3.2&quot;);
</script>
<script type='text/javascript'>
$(function() {
$(&#39;#menusisi a&#39;).stop().animate({&#39;marginLeft&#39;:&#39;-50px&#39;},1000);
$(&#39;#menusisi &gt; li&#39;).hover(
function () {
$(&#39;a&#39;,$(this)).stop().animate({&#39;marginLeft&#39;:&#39;-2px&#39;},200);
},
function () {
$(&#39;a&#39;,$(this)).stop().animate({&#39;marginLeft&#39;:&#39;-50px&#39;},200);
}
);
});
</script>

Cole ANTES da tag </head>

Por último, copie o código HTML abaixo, coloque seu endereço nos locais sinalizados.

<ul id='menusisi'>
<li class='home'><a href='SEU-ENDEREÇO' title='Home'/></li>
<li class='twitter'><a href='twitter.com/USARNAME' title='Twitter'/></li>
<li class='rssfeed'><a href='http://SEU_BLOG.blogspot.com/feeds/posts/default' title='RSS Feed'/></li>
<li class='comentários'><a href='http://SEU_BLOG.blogspot.com/feeds/comments/full' title='Comentários'/></li>
<li class='contato'><a href='mailto: SEU_EMAIL' title='Contato'/></li>
</ul>

Cole ANTES da tag </body> (No final da página)
Prontinho!
Espero que gostem
Lembrando que com um pouco de paciência, você poderá mudar todo o desenho, alterar cores e deixar seu seu jeito, ou do jeito do seu blog.
Beijo da Mama ♥

Leia mais...

Tweet LinkedIn agora em Português

O LinkedIn não é apenas mais um site de relacionamentos, pode ser também. A diferença é que através dele podemos divulgar nossa atividade, nos conectar a empresas e pessoas diretamente ligadas aos nossos interesses aumentando a chance de novos contratos de trabalho. Eu confesso que estava com preguiça de ativar minha conta (rs) por entender o LinkedInd como mais um, apenas e em inglês (taí uma outra coisa cansativa para quem, como eu não domina o idioma). Agora o site está disponível em português (oba!) então, fui dar uma espiada nos detalhes e gostei.



Se você quer saber mais sobre o LinkedIn, leia as informações colhidas no Wikipédia

LinkedIn é uma rede de negócios fundada em Dezembro de 2002 e lançada em Maio de 2003  (comparável a redes de relacionamentos), principalmente utilizada por profissionais. Em Novembro de 2007, ela tinha mais de 16 milhões de usuários registrados, abrangendo 150 indústrias e mais de 400 regiões econômicas (como classificado pelo serviço).
O principal propósito do site é permitir que usuários registrados possam manter uma lista detalhada de contatos de pessoas que eles conheçam e confiem em empresas. As pessoas nessa lista são chamadas de conexões. Os usuários podem convidar qualquer um (seja um usuário LinkedIn ou não) para tornar-se uma conexão.
Esta lista de conexões pode então ser usada de vários modos:
Uma rede de contatos acumulada, constituída de suas ligações diretas, de segunda grau, terceiro e assim por diante facilitam com que você possa conhecer alguém através de seus contatos mútuos.
Isso pode ser usado para encontrar trabalhos, pessoas e oportunidades recomendadas por qualquer um na sua rede de contatos.
Empregadores podem listar trabalhos e buscar por candidatos potenciais.
Todos os candidatos a emprego podem rever o perfil de contratação e descobrir qual dos seus contatos existentes poderia apresenta

Se gostou, pode me seguir ► 

Beijo da Mama ♥

Leia mais...

Tweet Compartilhar posts no Facebook

Veja como instalar um botão para compartilhar suas postagens no Facebook . Sem dúvida uma versão melhorada do “Shere Partners“, porque tem um contador que mostra número de vezes que enviaram seu link ao Facebook.
O fbshare.me, não é um site ligado ao Facebook. Seu botão é bem parecido com os do Tweetmeme e Buzz Volume (que estou usando) para compartilhar postagens no Twitter e é muito simples de instalar no Blogger

Leia mais...

Tweet TWITTER ( microblogging)

Eu já aderí!!!!
O Twitter parece ser uma nova febre dos blogueiros de plantão (eu por exemplo).

Para ter o Twitter em seu blog e/ou enviar mensagens rápidas por celular faça o seguinte:

Inscreva-se no http://twitter.com/
O site é todo em inglês, caso não entenda nadinha, feito eu, use esse Tradutor que é uma bennnnção (rsss).

Depois de feita sua incrição, dá uma xeretada nos recursos para personalizar sua página do Twitter, encaminhe convites para seus seguidores (followings) e comece publicar .

Suas atualizações (mini postagens) podem ser exibidas no seu blog de maneira super fácil!.

clic =>Widgets Oficial do Twitter para o Blogspot
 

É bico!!!
Aliás, deixa eu agradecer ao Compulsivo Um blogueiro de "responsa"!!! Sabe tudo de Internet e blogação, e compartilha com a maior GENEROSIDADE!!!! BRIGADÃO!!!

Mais informações sobre Twitter: Wikipédia

Leia mais...