Mostrar mensagens com a etiqueta Acessórios. Mostrar todas as mensagens
Mostrar mensagens com a etiqueta Acessórios. Mostrar todas as mensagens

sábado, 12 de fevereiro de 2011

Dicas para Blogs no Youtube (Video Tutorial)

Agora o Dicas para Blogs está também no Youtube, vamos mostrar na pratica como fazer as modificações no seu blog com diversos vídeo tutoriais explicando como editar, colocar acessórios, alterar template, e muitos outras coisas sobre o blogger. Enfim esperamos que nossos tutoriais publicados no Youtube ajudem muitos blogueiros a resolver suas duvidas.


Fizemos um vídeo tutorial mostrando justamente como colocar vídeos do youtube no seu blog, lá mostramos quais são as opções para postar vídeos, como personalizar o tamanho e cores do vídeo e alguns outros detalhes que você poderá ver logo a seguir:


Esperamos que gostem e deixem sua opinião que certamente será muito útil para nós afinal estamos apenas começando a publicar vídeos tutoriais e sabemos que podemos melhorar muito na produção de vídeo tutoriais. Aguardamos também sugestões de assuntos para novos vídeos. 

Twitter button no seu blog - botão retweet

O Twitter lançou o seu próprio botão para enviar as postagens do blog para o Twitter (retweet), é muito fácil de usar principalmente porque não precisa alterar nada no código do botão que achamos nos Twitter Goodies >> Tweet Button. Você só precisa entrar no Twitter, escolher entre as opções de modelos de botão e pegar o código do seu retweet button e para colocar no seu blog também é muito fácil e rápido.

Entre na pagina do Tweet Button, escolha uma das opções de botão, sugerimos não alterar nada nas configurações: Tweet text, URL e Language, a única que seria interessante é o idioma, mas quando escrevemos esse tutorial ainda não tem a opção português (item language).

twitter button
Depois que escolheu seu modelo é só copiar o código no final da pagina e voltar ao blogger, entre na pagina designer >> editar html, clique para expandir o modelo e coloque o código logo junto com <data:post.body/>.

codigo do botao retweet

Escolha se prefere o botão retweet no inicio ou final do texto de sua postagem e coloque o código antes ou depois do trecho que citamos. Evidentemente colocar o código antes faz o botão aparece no inicio do texto e colocar depois o botão aparece no final do seu texto.

Podemos também escolher o lado que o botão aparecerá, colocando o código fornecido pelo Twitter dentro da tag div, deste jeito:

<div style="float:left; margin:2px">codigo do botao retweet</div>

Do jeito que está o código acima o botão aparecerá do lado esquerdo, se preferir do lado direito troque a palavra left por right.


Notamos uma diferença entre o numero de retweets mostrado pelo contador entre esse botão oficial do Twitter e os botões feitos pelos sites Meme e Topsy, mas esperamos que essa falha seja corrigida em breve. Embora seja um pouco difícil (trabalhoso) saber qual deles é o mais correto. 

Botão personalizado para seguir o blog

Fizemos um botão com link para seguir nosso blog em vez de usar o widget criado pelo site google friend connect, e algumas pessoas perguntam como fazer um botão deste tipo para o blog. Isso é feito em duas partes primeiro você precisa achar ou editar uma imagem para usar como botão e depois copiar o link usado para seguir o seu blog.

Não vamos entrar em detalhes sobre como criar imagens pois já mostramos isso em outros tutoriais: programas para editar imagens gratis e como fazer banners online.

ID do blogger
O mais importante é você pegar o link correto para as pessoas seguirem seu blog isso você faz no painel do blog, veja os links nova postagem, configurações, designer, clique sobre qualquer um deles veja que na pagina que abre o endereço dela tem um numero grande no final então copie esse numero(representado na imagem acima por xxxx..).

Agora troque esse no código abaixo e depois coloque no seu blog pela paginadesigner, adicionar gadget, html/javascript:

<a href="http://www.blogger.com/follow-blog.g?blogID=6733904293279049411" target="_blank">seguir esse blog</a>

Seguir Blogger
Se quiser pode usar esse link com uma imagem enviando como um gadget de imagem e no campo link coloque o endereço http://www.blogger.com/follow-blog.g?blogID=xxxxxxxxxxxxxxxxxx e quando alguém clicar no link de texto ou na imagem irá para uma pagina falando para seguir o seu blog(faça o teste neste link). Essa é uma maneira diferente de convidar as pessoas para seguirem seu blog e pode dar bons resultados porque vamos usar o texto e imagens que desejarmos. 

Botão adicionar Gadget no Blogger (Add to Blogger)

Aprenda como colocar um botão add to blogger (adicionar ao blogger) no seu site ou blog, esse botão já envia diretamente o código do gadget para o blogger, sem precisar copiar códigos. Isso pode ajudar na divulgação do seu blog e também a conseguir mais visitas. Quando seus visitantes clicarem no botão envia o código diretamente para o blog da pessoa ou se ele tiver mais de um blog aparece uma pagina para selecionar em qual de seus blogs ela adicionará esse gadget, tudo isso automaticamente sem mexer em uma linha de código.

Veja como isso funciona, entre na pagina designer, adicionar gadget, html/javascript e cole o código abaixo, apenas fazendo as alterações nas áreas destacadas:

<center><form action="http://beta.blogger.com/add-widget" method="post">
<input value="Dicas para Blogs" name="widget.title" type="hidden"/>
<textarea style="display: none;" name="widget.content">
Código html do gadget
</textarea>
<input value="http://www.dicasparablogs.com.br/p/dicas-no-seu-siteblog.html" name="infoUrl" type="hidden"/>
<input value="http://acessoriosparablogs.com.br/dicas/icone.png" name="logoUrl" type="hidden"/>
<input src="http://www.blogger.com/img/add/add2blogger_lg.gif" type="image"/>
</form></center>


O que precisamos modificar no código:

Título do gadget, altere onde está dicas para blogs:
<input value="Dicas para Blogs" name="widget.title" type="hidden"/>

Código html do gadget, neste local você deve colocar o código do seu banner ou qualquer outra coisa que desejar

botão adicionar gadget
Nas duas linhas seguintes você deve colocar o endereço de sua pagina para mais informações sobre o gadget (veja na imagem acima) e uma imagem que aparecerá ao lado do link mais informações(use uma imagem quadrada)

<input value="http://www.dicasparablogs.com.br/p/dicas-no-seu-siteblog.html" name="infoUrl" type="hidden"/>
<input value="http://acessoriosparablogs.com.br/dicas/icone.png"
Veja na imagem no canto inferior direito o logotipo do nosso blog ao lado do link saiba mais.

E finalmente o botão que aparecerá no seu blog é na linha:
<input src="http://www.blogger.com/img/add/add2blogger_lg.gif" type="image"/>





Você pode testar o funcionamento deste código clicando no botão add blogger que está logo acima e adicionar uma lista de nossas postagens ao seu blog.

O Blogger oferece 3 botões diferentes, veja abaixo os exemplos e o endereço das imagens:
adicionar gadget blogger
http://www.blogger.com/img/add/add2blogger_lg.gif

add blogger
http://www.blogger.com/img/add/add2blogger_sm_b.gif

gadget bloggerhttp://www.blogger.com/img/add/add2blogger_sm_w.gif

Esse tem o fundo transparente para se adaptar melhor a cor de fundo do seu blog. Claro que nada impede que você use crie outra imagem para usar como botão só precisa hospedar a imagem e colocar o endereço dela no local indicado. Encontramos o código para esse botão nas paginas de ajuda do Blogger, infelizmente o texto original está em inglês, mas se quiserem olhar veja a ajuda do blogger.

Converter blog em arquivo PDF e enviar por e-mail

Veja como converter as postagens do seu blog para o formato PDF e enviar por email para qualquer pessoa, e o melhor qualquer pessoa que visitar seu blog pode fazer isso! Usando esse acessório quando seus visitantes quiserem enviar uma copia da sua postagem para alguém só precisam digitar o endereço de email da pessoa e clicar em enviar e pronto, o será criado automaticamente um arquivo PDF com o conteúdo do seu blog e enviado para o email. Tudo muito rápido e fácil, sem mexer com códigos.

Blogger PDF

Esse widget para converter e enviar as postagens do blog em formato PDF é feito pelo site: Criador & Conversor de PDF Gratuito.

Para colocar esse acessório no seu blog entre na pagina designer, adicionar gadget, html/javacript e cole esse código:

<style type="text/css"> .pdf24Plugin-sbp-box { background-image:url(http://pdf24-blogger-widget.googlecode.com/svn/tags/1.1/bg.gif); background-repeat: no-repeat; width:190px; height:125px; position:relative; padding:4px; font-family: Verdana, Arial } .pdf24Plugin-sbp-title { position:absolute; left: 10px; top: 4px; text-align:left; width:110px; color:#fff; font-size: 14px; font-weight:bold } .pdf24Plugin-sbp-sendto { position:absolute; left: 10px; top: 71px; } .pdf24Plugin-sbp-sendto input { width: 169px; height: 17px; border:1px solid silver } .pdf24Plugin-sbp-submit { position:absolute; right: 15px; top: 100px; } .pdf24Plugin-sbp-submit input { background-color: #66A4DA; border:0px; border-left: 1px solid silver; border-bottom: 1px solid silver; color:#fff; font-weight:bold; padding:1px; cursor: pointer } .pdf24Plugin-sbp-backlink { position:absolute; left: 11px; top: 103px; font-size:11px; } </style> <script language="javascript" src="http://pdf24-blogger-widget.googlecode.com/svn/tags/1.1/script.js"></script> <div class="pdf24Plugin-sbp-box"> <div class="pdf24Plugin-sbp-title">Send articles as PDF to</div> <form action="http://doc2pdf.pdf24.org/doc2pdf/blogger.php" target="pdf24PopWin" name="pdf24Form" method="POST" onsubmit="return pdf24_onSubmit(this);">
<div class="pdf24Plugin-sbp-sendto">
<input value="Enter email address" onmousedown="this.value = &#39;&#39;;" name="sendEmailTo" type="text" />
</div>
<div class="pdf24Plugin-sbp-submit"><input value="Send" onclick="pdf24_onSubmitBtnClick();" type="submit" /></div> </form> <div class="pdf24Plugin-sbp-backlink"><a href="http://en.pdf24.org" target="_blank" title="PDF | PDF Creator | PDF Converter">PDF Creator</a></div> </div>


O trecho em negrito (Send articles as PDF to) é o texto original gerado pelo site, você pode alterar como desejar. Se você souber editar html e modificar código poderá fazer varias alterações na aparência deste gadget, pois todo ele é em html. A parte principal do acessório é essa:


<script language="javascript" src="http://pdf24-blogger-widget.googlecode.com/svn/tags/1.1/script.js"></script>
<form action="http://doc2pdf.pdf24.org/doc2pdf/blogger.php" method="post" name="pdf24Form" target="pdf24PopWin" id="pdf24Form" onsubmit="return pdf24_onSubmit(this);">
<input value="Enter email address" onmousedown="this.value = '';" name="sendEmailTo" type="text" />
<input value="Send" onclick="pdf24_onSubmitBtnClick();" type="submit" />
</form>


O restante é somente formatação de textoimagens de fundo, então você pode usar da forma que achar melhor.

Se quiser colocar no final da postagem do seu blog entre na pagina editar html procure por post.body e coloque o código deste jeito, qualquer duvida veja aqui sobre como mostrar conteúdo diferente nas paginas do blog:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script language="javascript" src="http://pdf24-blogger-widget.googlecode.com/svn/tags/1.1/script.js"></script>
<form action="http://doc2pdf.pdf24.org/doc2pdf/blogger.php" method="post" name="pdf24Form" target="pdf24PopWin" id="pdf24Form" onsubmit="return pdf24_onSubmit(this);">
<input value="Enter email address" onmousedown="this.value = '';" name="sendEmailTo" type="text" />
<input value="Send" onclick="pdf24_onSubmitBtnClick();" type="submit" />
</form>
</b:if>


Usamos aqui a segunda opção (código essencial do widget), mas poderia ser a versão completa com a imagem de fundo, isso é uma questão de gosto pessoal de cada blogueiro.

Achamos que isso pode ajudar aumentar as visitas do blog, afinal quem receber um e-mail com suas postagens em PDF provavelmente visitará o blog para ver mais. Claro que o principal é ter um bom conteudo no seu blog para conseguir mais visitas, mas qualquer forma de divulgação é sempre bem vinda. 

Fazer sorteio entre os seguidores do Twitter ou Retweets

Fazer sorteios usando o Twitter e o site sorteie é muito fácil, em poucos cliques você pode escolher se quer sortear aleatoriamente um dos seus seguidores do Twitter ou entre aqueles que enviarem um retweet de alguma url (pagina), isso parece ser bem interessante para criar promoções e divulgação do blog, afinal sorteio de brindes ou algum outro premio sempre atrai muitas pessoas que procuram encontrar a sorte.

Ao entrar no site Sorteie você verá essa imagem, então clique em criar sorteio:

Criar sorteio no blog
Agora faça login com seu nome e senha do Twitter para autorizar a utilização das informações de sua conta e clique no botão Allow (permitir)

Permitir acesso ao twitter
E já está tudo pronto, você só precisa escolher se fará um sorteio entre os seus seguidores ou entre as pessoas que retwitaram uma pagina para fazer isso precisa ser utilizado o encurtador de url migre, neste caso coloque a url que reduziu usando o migre no local indicado e clique em sortear.

sortear retweets ou seguidores
Depois que clicar no botão do sorteio que desejar verá a pagina do resultado semelhante a essa:

sorteio no twitter
Esse é um site muito interessante e pode ser muito útil para blogueiros, basta usar sua criatividade e criar promoções para ajudar na divulgação do seu blog ou presentear seus visitantes.


Gadgets do Google Friend Connect

Além de gadget do blogger para mostrar os seguidores de nosso blog também temos a opção de fazer esse acessório através do Google Friend Connect que além do gadget com os seguidores do blog oferece ainda outros acessórios muito úteis para seu blog, como por exemplo, comentários, criar pesquisas e varias outras coisas.

Vamos falar apenas de dois gadgets para não misturar assuntos demais numa postagem só, mas no site Google Friend Connect você poderá testar todos os gadgets e usar aqueles que acharem mais interessantes para seu blog.

Google Friend Connect
Adicionar o gadget de membros- Facilite a participação no seu site e conheça outros usuários.
Esse é o gadget dos seguidores, você só precisa clicar no botão e depois escolher as cores, largura e quantas linhas com as fotos (miniaturas) dos seguidores mostrará no seu blog, quando terminar clique no botão gerar código no final da pagina, copie o código e coloque no seu blog pela pagina designer, adicionar gadget, html/javacript. Indo no caminho inverso, veja aqui como Parar de Seguir um Blog, afinal nem sempre fazemos as escolhas certas e temos o direito de não seguir mais caso o blog não seja tudo aquilo que esperavamos dele.

seguidores do blogger
Outro gadget interessante para seu blog é Reunir interesses dos usuários (Conheça os usuários fazendo perguntas que são importantes para você) aqui você poderá criar pesquisas (enquetes) para colocar no seu blog o procedimento é basicamente o mesmo, clicar no botão Reunir interesses dos usuários, criar sua pergunta e depois configurar o gadget.

Além desses o ultimo item Analisar dados da comunidade (Visualizar dados da comunidade e análises de outros sites) permite ver um gráfico mostrando o aumento no numero de seguidores do seu blog ao logo do tempo, isso é semelhante aos gráficos dos contadores de visitas.

Enfim como já dissemos no inicio o Google Friend Connect oferece varias ferramentas interessantes para seu blog, então espero que visitem o site e aproveitem da melhor forma possível. 

Colocar Últimas noticias, esportes no seu blog

Você pode usar os feed de qualquer site para inserir no seu blog uma lista com as últimas notícias, novidades dos esportes, vida dos famosos, novelas, informações sobre tecnologia e muitas outras coisas. Tudo isso sendo atualizado automaticamente, parece muito bom e melhor ainda que é muito simples de fazer apenas adicionando um gadget.feed últimas notícias

Visite um site que goste e confie sobre notícias, esportes, tecnologia, horóscopo, fofocas enfim qualquer coisa que tenha algo relacionado com o conteúdo do seu blog ou simplesmente você acha que seria de interesse de seus visitantes e copie o endereço do feed, depois apenas entre na pagina designer, adicionar gadget, e cole esse feed, e já está tudo pronto seu blog agora mostrará links para novas atualizações desse feed que acabou de adicionar.



Se quiser ainda temos aqui alguns gadgets com varios conteúdos para seu blog ou asúltimas noticias geradas pelo site Google Noticias. 

Criar um Índice do blog - Mostrar links de todos os posts

Veja como fazer um índice no blog com o titulo e o link de todas as postagens, esse código mostrará o links de todos seus posts em ordem de publicação, colocando os mais recentes no final da lista. Se quiser veja aqui como mostrar uma lista em ordem aleatória com os artigos recentes, isso pode ajudar na divulgação do seu blog fazendo seus visitantes olharem mais paginas e assim tem mais chances de gostar e voltar outras vezes no seu blog ou quem sabe até recomendar o blog para outras pessoas e assim atrair mais visitas.

Entre na pagina designer, clique para adicionar um gadget e use a opção html/javascript. Então cole o código abaixo:

<style type="text/css">
.todosposts {
border: 1px solid #000;
height: 250px;
width: 300px;
overflow: auto;
}
.todosposts a{
color: #00C;
text-decoration: none;
}
.todosposts a:hover{
color: #F00;
text-decoration: underline overline;
}
</style>
<div class="todosposts">
<script type="text/javascript">
function showrecentposts(json) {
document.write('');
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
posttitle = posttitle.link(posturl);
var readmorelink = "(Baca)";
readmorelink = readmorelink.link(posturl);
var postdate = entry.published.$t;
var cdyear = postdate.substring(0,4);
var cdmonth = postdate.substring(5,7);
var cdday = postdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "Jan";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "May";
monthnames[6] = "Jun";
monthnames[7] = "Jul";
monthnames[8] = "Aug";
monthnames[9] = "Sep";
monthnames[10] = "Oct";
monthnames[11] = "Nov";
monthnames[12] = "Dec";
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
if (!standardstyling) document.write('<div class="bbrecpost">');
if (standardstyling) document.write(posttitle);
if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
if (!standardstyling) document.write('</div><div class="bbrecpostsum"">');
if (showpostsummary == true) {
if (standardstyling) document.write('<br/>');
if (postcontent.length < numchars) {
if (standardstyling) document.write('<i>');
document.write(postcontent);
if (standardstyling) document.write('</i>');}
else {
if (standardstyling) document.write('<i>');
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd);
document.write(postcontent + '...' + readmorelink);
if (standardstyling) document.write('</i>');}
}
if (!standardstyling) document.write('</div>');
if (standardstyling) document.write('<br/>');
}
if (!standardstyling) document.write('<div class="bbwidgetfooter">');
if (standardstyling) document.write('<br/>');
}
var numposts = 1000;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://dicasparablogs.blogspot.com/feeds/posts/default?
orderby=published&alt=json-in-script&max-results=999
&callback=showrecentposts"></script></div>


Sabemos que é um código grande, mas as partes que precisam de alteração são poucas e fáceis de fazer, no inicio do código temos o seguinte trecho:

.todosposts {
border: 1px solid #000;
height: 250px;
width: 300px;
overflow: auto;
}
.todosposts a{
color: #00C;
text-decoration: none;
}
.todosposts a:hover{
color: #F00;
text-decoration: underline overline;
}

Na primeira linha podemos escolher outros tipos de bordas e o tamanho da caixa alterando os valores do estilo todosposts{..., veja as linhas: height: 250px; width: 300px. Se não quiser a caixa, mas mostrar somente a lista completa sem barra de rolagem apague o trecho overflow: auto; e height: 250px.

Depois podemos editar completamente a aparência dos links alterando o estilo .todosposts a e .todosposts a:hover, veja aqui como fazer a formatação de texto dos links.

E na parte final do código temos a linha:

...script src="http://dicasparablogs.blogspot.com/feeds/posts/default?
orderby=published&alt=json-in-script&max-re....

Aqui você deve colocar o endereço do seu blog e já está tudo pronto. Falamos aqui como fazer isso em um gadget, mas poderia ser muito util também numa pagina extra do blogger, assim você teria um link para mostrar seu indice em vezes que carregar junto com cada pagina visitada.

Também é possivel criar uma lista com os posts de cada um dos marcadores do blog, para fazer isso no trecho onde colocamos o endereço do blog, modifique para ficar assim:

http://www.dicasparablogs.com.br/feeds/posts/default/-/Efeitos?
orderby=published&alt=json-in-script&m......

A palavra Efeitos é o nosso marcador, mas se for utilizar isso precisa escrever o nome do marcador exatamente como está no seu blog, fizemos um teste e usando a palavra efeitos com letra minúscula não funcionou, portanto tem que ser igual está no marcador do blog. 

Fazer Podcast - Colocar MP3 no Blog

Algumas pessoas perguntaram sobre como fazer um Podcast no blog, ou seja, colocar uma gravação em áudio com sua própria voz falando alguma mensagem ou qualquer outra coisa. Essa tarefa se divide em duas partes: hospedar o arquivo mp3 e criar o código do player para tocar o arquivo de som no seu blog.

A hospedagem pode ser feita em qualquer site de hospedagem ou no Google Sites, isso depende onde você achar mais fácil, depois copie o endereço do arquivo e entre no site http://flash-mp3-player.net escolha um dos modelos. Vamos usar como exemplo o normal.

podcast no blogger

Clique no item generator no menu à direita e coloque o endereço do arquivo mp3 que você hospedou na internet no campo MP 3, clique enter e depois copie o código da caixa HTML code e já está pronto. Agora entre no seu blog e pode usar como um gadget de html/javascript ou em uma postagem.
Player no Blog

Veja logo abaixo um exemplo funcionando na pratica (é um som apenas para teste que achamos na internet – barulho de avião):


Mas poderia ser qualquer coisa como uma musica, ou você falando algo para seus leitores enfim isso fica a critério de cada um como usará esses players para colocarmusicas no blog ou fazer Podcast no seu Blog.

Sobre programas para gravar áudio no seu computador você poderá encontrar no Baixaki (Audacity 1.3.12 Beta) esse link é apenas uma sugestão com base em dados que observamos no site (avaliação dos usuários e numero de downloads), portanto se você já usa algum que acha melhor ou mais fácil de usar que esse pode dar a sugestão e vamos criar uma lista de programas para gravação e edição de áudio neste tutorial.

Claro que esse foi um tutorial para mostrar apenas os primeiros passos de como funciona esse site com players para mp3, quando você criar os seus podcasts poderá explorar melhor o site e ver muitos outros detalhes que não falamos aqui. 

Placar dos Jogos de Futebol ao Vivo no seu Blog

Uma das perguntas frequentes que recebemos é como colocar o placar dos jogos de futebol no blog. Achamos no site IG Esportes a solução para isso, o site fornece um placar mostrando os resultados do Campeonato Brasileiro, Italiano, Espanhol e outros. Caso você tenha interesse por outros tipos de noticias no seu blog poderá ver neste link.
fubebol brasileiro
Tudo isso atualizado na hora que os gols acontecem nos jogos, realmente mostra os resultados das partidas em tempo real. Usando as palavras do site para descrever esse serviço gratuito: “O serviço de tempo real do iG acompanha lance a lance, com estatísticas e espaço para comentários através das redes sociais, os jogos mais importantes de todos os campeonatos de futebol no Brasil e do mundo. A partir de agora, você também pode oferecer essa ferramenta aos visitantes do seu site ou blog: basta copiar o código abaixo e inseri-lo no html do seu site.”

Para colocar desse gadget com o placar dos jogos no seu blog copie o código abaixo, entre na pagina designer, adicionar gadget, html/javascript e cole o código.

<object height='115' width='299' classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0'><param name='movie' value='http://placar.ultimosegundo.com.br/placarus/placar_igesporte.swf'/><param name='quality' value='high'/><param name='wmode' value='opaque'/><embed height='115' width='299' src='http://placar.ultimosegundo.com.br/placarus/placar_igesporte.swf' wmode='opaque' quality='high' pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash'/></object>


Veja logo abaixo um exemplo com os resultados dos campeonatos de futebol atualizados:

Em outras épocas do ano mostrará também os resultados de campeonatos regionais como, por exemplo, o Campeonato Paulista, Campeonato Carioca e todos os outros jogos mais importantes do futebol nacional e mundial. 

Mostrar Botões de Compartilhamento no Blogspot

Já mostramos diversos tutoriais sobre botões para redes sociais, mas ainda faltou falar sobre os botões para esses sites e agregadores de links feitos pelo próprio Blogger (Mostrar botões de compartilhamento). Você pode ativar essa opção pela pagina designer do modelo, mas precisa adicionar mais um código html para que funcione realmente os botões para Orkut, Twitter, Facebook e Google Buzz(Botão do Facebook, Twitter, Google Buzz no mesmo Gadget).

compartilhar blogger
Como já dissemos o primeiro passo é ativar esse acessório na pagina designer do modelo clicando para editar as postagens e marcando a opção Mostrar botões de compartilhamento.

Antes de começar recomendamos fazer um backup do HTML do seu blog. Agora entre na pagina editar html, marque para expandir modelos de widgets, procure por <div class='post-header-line-1'> ou <post.body/> e depois adicione esse código logo abaixo:

<div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div>

codigo de fonte do blog
Agora clique para salvar e visualize seu blog. Se quiser modificar o lado que os botões aparecem no seu blog volte a pagina editar html (Onde colocar os códigos no blog) e coloque essa linha de código CSS:

.post-share-buttons{float:left}

html do blogger
Do jeito que está os botões ficarão do lado esquerdo das postagens e para colocar do lado direito troque a palavra left por right no código acima.

Essa é mais uma opção para divulgar seu blog nas redes sociais(Botão para as redes sociais - AddThis), mas precisamos lembrar que o principal é ter um conteúdo interessante no blog para que as pessoas tenham motivos para usar esses botões para recomendar suas postagens a outras pessoas. 

Imprimir ou Salvar em PDF o Post do seu Blog

Alguns blogueiros perguntaram sobre como imprimir as postagens do blog ou permitir salvar a postagem do blog no formato PDF(Converter blog em arquivo PDF e enviar por e-mail), nós achamos um site que faz esse serviço gratuitamente e muito fácil de usar no blogger.

Você só coloca um código no seu blog e aparece um botão que imprime ou salva como PDF o post do seu blog. Essa é mais uma maneira de facilitar o acesso aos seus textos e pode até ajudar na divulgação já que o botão também mostra a opção de enviar por email a postagem. Outro serviço útil é permitir ouvir as postagens do seu blog, mas isso já mostramos em outro tutorial: Ouvir as postagens do blog

Entre no site Printer Friendly & PDF Button For Websites and Blogs (http://www.printfriendly.com/button), veja que no inicio da pagina tem a opção dobotão para imprimir e salvar PDF para o Blogger, WordPress e Website. Clicando em Blogger ou WordPress você verá instruções sobre como instalar o botão nestas plataformas de blog.

imprimir ou salvar como PDF as postagens do blog
Mas se preferir pode usar a opção website e colocar o código como um gadget na parte da sua pagina que achar melhor(Problemas para mover ou adicionar gadgets do blog). Para fazer isso entre na pagina designer(Elementos da página), depois clique para adicionar um gadget e escolha a opção html/javascript, cole o código e salve. Isso faz o botão aparecer em todas as paginas do blog e não somente nas paginas individuais das postagens como na opção Blogger. 

Download de Icones para Redes Sociais (Twitter, Facebook, Orkut)

Veja e faça download grátis de milhares de ícones dos mais variados tipos, você encontrará ícones prontos para baixar e usar no facebook, blogger, twitter, vídeos, redes sociais, internet, compras, downloads, musicas e muitos outros ícones e logotipos que você desejar, inclusive do Windows.

Os icones que falamos são apenas imagens com simbolos dessas redes e outros temas que mencionamos se quiser botões para divulgar seu blog nas redes sociais veja aqui: Botão do Facebook, Twitter, Google Buzz no mesmo Gadget ou Links para divulgar blog no Twitter, Facebook, Orkut, Google Buzz.

icones do blog - blogger
O site http://findicons.com tem uma busca para você encontrar o ícone do tipo que deseja e ainda as imagens separadas por categorias(semelhante aos marcadores do blogger), assim você pode procurar e achar muitas opções de ícones sobre qualquer tema que imagine.

Uma coisa curiosa que notamos no site é que mesmo pesquisando palavras em português ele converte a busca para o inglês o que certamente facilita a vida de quem não sabe muito bem a linha inglesa. Em um teste pesquisamos por dinheiro e o resultado da busca já apareceu com a palavra money.

Depois que achar o ícone que procura clique sobre ele, fizemos um teste com um ícone para o facebook, na tela que aparece a opção de download no formato ico, png e outros. Você também pode escolher o tamanho do ícone clicando na guia outro tamanho.

formatos e tipos de icones
Então sugerimos se for utilizar como favicon no Blogger (Imagem na Barra de Endereços) escolha o tamanho 16x16 e formato ico assim será só hospedar e usar no seu blog. Esperamos que gostem de mais essa dica de site e aproveitem bem tantas opções de imagens grátis para download. 

Widgets UOL no seu Blog - Ultimas Noticias, Esporte, Cinema

Existem diversas maneiras de colocar ultimas noticias ou novidades no blog, como por exemplo usar o feed para mostrar noticias recentes publicadas em qualquer site, o google também disponibiliza widgets de noticias, esportes, economia e outros.

Seguindo essa linha de gadgets com noticias atualizadas automaticamente encontramos os widgets do UOL, eles oferecem links com as novidades de vários setores do site: Primeira pagina, economia, esportes, cinema, celebridades, tecnologia, carros e outros.

widgets uol ultimas noticias no blog
Você só precisa escolher qual dos widgets vai colocar no seu blog, clicar sobre ele e depois pegar o código HTML do modelo que mais gostar. Entre na pagina do blogger, depois na pagina designer, adicionar gadget, escolha a opção html/javascript e cole o código.

Agora já está tudo pronto e está pode ser uma maneira fácil e interessante de mostrar sempre no seu blog os últimos acontecimentos. Além das notícias recentesvocê pode ver na pagina de busca de Gadgets do Google, lá você encontrará muitas outras coisas para colocar no seu blog: previsão do tempo, jogos, informações sobre tecnologia e muito mais. 
Mostrar mensagens com a etiqueta Acessórios. Mostrar todas as mensagens
Mostrar mensagens com a etiqueta Acessórios. Mostrar todas as mensagens

Dicas para Blogs no Youtube (Video Tutorial)

Agora o Dicas para Blogs está também no Youtube, vamos mostrar na pratica como fazer as modificações no seu blog com diversos vídeo tutoriais explicando como editar, colocar acessórios, alterar template, e muitos outras coisas sobre o blogger. Enfim esperamos que nossos tutoriais publicados no Youtube ajudem muitos blogueiros a resolver suas duvidas.


Fizemos um vídeo tutorial mostrando justamente como colocar vídeos do youtube no seu blog, lá mostramos quais são as opções para postar vídeos, como personalizar o tamanho e cores do vídeo e alguns outros detalhes que você poderá ver logo a seguir:


Esperamos que gostem e deixem sua opinião que certamente será muito útil para nós afinal estamos apenas começando a publicar vídeos tutoriais e sabemos que podemos melhorar muito na produção de vídeo tutoriais. Aguardamos também sugestões de assuntos para novos vídeos. 

Twitter button no seu blog - botão retweet

O Twitter lançou o seu próprio botão para enviar as postagens do blog para o Twitter (retweet), é muito fácil de usar principalmente porque não precisa alterar nada no código do botão que achamos nos Twitter Goodies >> Tweet Button. Você só precisa entrar no Twitter, escolher entre as opções de modelos de botão e pegar o código do seu retweet button e para colocar no seu blog também é muito fácil e rápido.

Entre na pagina do Tweet Button, escolha uma das opções de botão, sugerimos não alterar nada nas configurações: Tweet text, URL e Language, a única que seria interessante é o idioma, mas quando escrevemos esse tutorial ainda não tem a opção português (item language).

twitter button
Depois que escolheu seu modelo é só copiar o código no final da pagina e voltar ao blogger, entre na pagina designer >> editar html, clique para expandir o modelo e coloque o código logo junto com <data:post.body/>.

codigo do botao retweet

Escolha se prefere o botão retweet no inicio ou final do texto de sua postagem e coloque o código antes ou depois do trecho que citamos. Evidentemente colocar o código antes faz o botão aparece no inicio do texto e colocar depois o botão aparece no final do seu texto.

Podemos também escolher o lado que o botão aparecerá, colocando o código fornecido pelo Twitter dentro da tag div, deste jeito:

<div style="float:left; margin:2px">codigo do botao retweet</div>

Do jeito que está o código acima o botão aparecerá do lado esquerdo, se preferir do lado direito troque a palavra left por right.


Notamos uma diferença entre o numero de retweets mostrado pelo contador entre esse botão oficial do Twitter e os botões feitos pelos sites Meme e Topsy, mas esperamos que essa falha seja corrigida em breve. Embora seja um pouco difícil (trabalhoso) saber qual deles é o mais correto. 

Botão personalizado para seguir o blog

Fizemos um botão com link para seguir nosso blog em vez de usar o widget criado pelo site google friend connect, e algumas pessoas perguntam como fazer um botão deste tipo para o blog. Isso é feito em duas partes primeiro você precisa achar ou editar uma imagem para usar como botão e depois copiar o link usado para seguir o seu blog.

Não vamos entrar em detalhes sobre como criar imagens pois já mostramos isso em outros tutoriais: programas para editar imagens gratis e como fazer banners online.

ID do blogger
O mais importante é você pegar o link correto para as pessoas seguirem seu blog isso você faz no painel do blog, veja os links nova postagem, configurações, designer, clique sobre qualquer um deles veja que na pagina que abre o endereço dela tem um numero grande no final então copie esse numero(representado na imagem acima por xxxx..).

Agora troque esse no código abaixo e depois coloque no seu blog pela paginadesigner, adicionar gadget, html/javascript:

<a href="http://www.blogger.com/follow-blog.g?blogID=6733904293279049411" target="_blank">seguir esse blog</a>

Seguir Blogger
Se quiser pode usar esse link com uma imagem enviando como um gadget de imagem e no campo link coloque o endereço http://www.blogger.com/follow-blog.g?blogID=xxxxxxxxxxxxxxxxxx e quando alguém clicar no link de texto ou na imagem irá para uma pagina falando para seguir o seu blog(faça o teste neste link). Essa é uma maneira diferente de convidar as pessoas para seguirem seu blog e pode dar bons resultados porque vamos usar o texto e imagens que desejarmos. 

Botão adicionar Gadget no Blogger (Add to Blogger)

Aprenda como colocar um botão add to blogger (adicionar ao blogger) no seu site ou blog, esse botão já envia diretamente o código do gadget para o blogger, sem precisar copiar códigos. Isso pode ajudar na divulgação do seu blog e também a conseguir mais visitas. Quando seus visitantes clicarem no botão envia o código diretamente para o blog da pessoa ou se ele tiver mais de um blog aparece uma pagina para selecionar em qual de seus blogs ela adicionará esse gadget, tudo isso automaticamente sem mexer em uma linha de código.

Veja como isso funciona, entre na pagina designer, adicionar gadget, html/javascript e cole o código abaixo, apenas fazendo as alterações nas áreas destacadas:

<center><form action="http://beta.blogger.com/add-widget" method="post">
<input value="Dicas para Blogs" name="widget.title" type="hidden"/>
<textarea style="display: none;" name="widget.content">
Código html do gadget
</textarea>
<input value="http://www.dicasparablogs.com.br/p/dicas-no-seu-siteblog.html" name="infoUrl" type="hidden"/>
<input value="http://acessoriosparablogs.com.br/dicas/icone.png" name="logoUrl" type="hidden"/>
<input src="http://www.blogger.com/img/add/add2blogger_lg.gif" type="image"/>
</form></center>


O que precisamos modificar no código:

Título do gadget, altere onde está dicas para blogs:
<input value="Dicas para Blogs" name="widget.title" type="hidden"/>

Código html do gadget, neste local você deve colocar o código do seu banner ou qualquer outra coisa que desejar

botão adicionar gadget
Nas duas linhas seguintes você deve colocar o endereço de sua pagina para mais informações sobre o gadget (veja na imagem acima) e uma imagem que aparecerá ao lado do link mais informações(use uma imagem quadrada)

<input value="http://www.dicasparablogs.com.br/p/dicas-no-seu-siteblog.html" name="infoUrl" type="hidden"/>
<input value="http://acessoriosparablogs.com.br/dicas/icone.png"
Veja na imagem no canto inferior direito o logotipo do nosso blog ao lado do link saiba mais.

E finalmente o botão que aparecerá no seu blog é na linha:
<input src="http://www.blogger.com/img/add/add2blogger_lg.gif" type="image"/>





Você pode testar o funcionamento deste código clicando no botão add blogger que está logo acima e adicionar uma lista de nossas postagens ao seu blog.

O Blogger oferece 3 botões diferentes, veja abaixo os exemplos e o endereço das imagens:
adicionar gadget blogger
http://www.blogger.com/img/add/add2blogger_lg.gif

add blogger
http://www.blogger.com/img/add/add2blogger_sm_b.gif

gadget bloggerhttp://www.blogger.com/img/add/add2blogger_sm_w.gif

Esse tem o fundo transparente para se adaptar melhor a cor de fundo do seu blog. Claro que nada impede que você use crie outra imagem para usar como botão só precisa hospedar a imagem e colocar o endereço dela no local indicado. Encontramos o código para esse botão nas paginas de ajuda do Blogger, infelizmente o texto original está em inglês, mas se quiserem olhar veja a ajuda do blogger.

Converter blog em arquivo PDF e enviar por e-mail

Veja como converter as postagens do seu blog para o formato PDF e enviar por email para qualquer pessoa, e o melhor qualquer pessoa que visitar seu blog pode fazer isso! Usando esse acessório quando seus visitantes quiserem enviar uma copia da sua postagem para alguém só precisam digitar o endereço de email da pessoa e clicar em enviar e pronto, o será criado automaticamente um arquivo PDF com o conteúdo do seu blog e enviado para o email. Tudo muito rápido e fácil, sem mexer com códigos.

Blogger PDF

Esse widget para converter e enviar as postagens do blog em formato PDF é feito pelo site: Criador & Conversor de PDF Gratuito.

Para colocar esse acessório no seu blog entre na pagina designer, adicionar gadget, html/javacript e cole esse código:

<style type="text/css"> .pdf24Plugin-sbp-box { background-image:url(http://pdf24-blogger-widget.googlecode.com/svn/tags/1.1/bg.gif); background-repeat: no-repeat; width:190px; height:125px; position:relative; padding:4px; font-family: Verdana, Arial } .pdf24Plugin-sbp-title { position:absolute; left: 10px; top: 4px; text-align:left; width:110px; color:#fff; font-size: 14px; font-weight:bold } .pdf24Plugin-sbp-sendto { position:absolute; left: 10px; top: 71px; } .pdf24Plugin-sbp-sendto input { width: 169px; height: 17px; border:1px solid silver } .pdf24Plugin-sbp-submit { position:absolute; right: 15px; top: 100px; } .pdf24Plugin-sbp-submit input { background-color: #66A4DA; border:0px; border-left: 1px solid silver; border-bottom: 1px solid silver; color:#fff; font-weight:bold; padding:1px; cursor: pointer } .pdf24Plugin-sbp-backlink { position:absolute; left: 11px; top: 103px; font-size:11px; } </style> <script language="javascript" src="http://pdf24-blogger-widget.googlecode.com/svn/tags/1.1/script.js"></script> <div class="pdf24Plugin-sbp-box"> <div class="pdf24Plugin-sbp-title">Send articles as PDF to</div> <form action="http://doc2pdf.pdf24.org/doc2pdf/blogger.php" target="pdf24PopWin" name="pdf24Form" method="POST" onsubmit="return pdf24_onSubmit(this);">
<div class="pdf24Plugin-sbp-sendto">
<input value="Enter email address" onmousedown="this.value = &#39;&#39;;" name="sendEmailTo" type="text" />
</div>
<div class="pdf24Plugin-sbp-submit"><input value="Send" onclick="pdf24_onSubmitBtnClick();" type="submit" /></div> </form> <div class="pdf24Plugin-sbp-backlink"><a href="http://en.pdf24.org" target="_blank" title="PDF | PDF Creator | PDF Converter">PDF Creator</a></div> </div>


O trecho em negrito (Send articles as PDF to) é o texto original gerado pelo site, você pode alterar como desejar. Se você souber editar html e modificar código poderá fazer varias alterações na aparência deste gadget, pois todo ele é em html. A parte principal do acessório é essa:


<script language="javascript" src="http://pdf24-blogger-widget.googlecode.com/svn/tags/1.1/script.js"></script>
<form action="http://doc2pdf.pdf24.org/doc2pdf/blogger.php" method="post" name="pdf24Form" target="pdf24PopWin" id="pdf24Form" onsubmit="return pdf24_onSubmit(this);">
<input value="Enter email address" onmousedown="this.value = '';" name="sendEmailTo" type="text" />
<input value="Send" onclick="pdf24_onSubmitBtnClick();" type="submit" />
</form>


O restante é somente formatação de textoimagens de fundo, então você pode usar da forma que achar melhor.

Se quiser colocar no final da postagem do seu blog entre na pagina editar html procure por post.body e coloque o código deste jeito, qualquer duvida veja aqui sobre como mostrar conteúdo diferente nas paginas do blog:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script language="javascript" src="http://pdf24-blogger-widget.googlecode.com/svn/tags/1.1/script.js"></script>
<form action="http://doc2pdf.pdf24.org/doc2pdf/blogger.php" method="post" name="pdf24Form" target="pdf24PopWin" id="pdf24Form" onsubmit="return pdf24_onSubmit(this);">
<input value="Enter email address" onmousedown="this.value = '';" name="sendEmailTo" type="text" />
<input value="Send" onclick="pdf24_onSubmitBtnClick();" type="submit" />
</form>
</b:if>


Usamos aqui a segunda opção (código essencial do widget), mas poderia ser a versão completa com a imagem de fundo, isso é uma questão de gosto pessoal de cada blogueiro.

Achamos que isso pode ajudar aumentar as visitas do blog, afinal quem receber um e-mail com suas postagens em PDF provavelmente visitará o blog para ver mais. Claro que o principal é ter um bom conteudo no seu blog para conseguir mais visitas, mas qualquer forma de divulgação é sempre bem vinda. 

Fazer sorteio entre os seguidores do Twitter ou Retweets

Fazer sorteios usando o Twitter e o site sorteie é muito fácil, em poucos cliques você pode escolher se quer sortear aleatoriamente um dos seus seguidores do Twitter ou entre aqueles que enviarem um retweet de alguma url (pagina), isso parece ser bem interessante para criar promoções e divulgação do blog, afinal sorteio de brindes ou algum outro premio sempre atrai muitas pessoas que procuram encontrar a sorte.

Ao entrar no site Sorteie você verá essa imagem, então clique em criar sorteio:

Criar sorteio no blog
Agora faça login com seu nome e senha do Twitter para autorizar a utilização das informações de sua conta e clique no botão Allow (permitir)

Permitir acesso ao twitter
E já está tudo pronto, você só precisa escolher se fará um sorteio entre os seus seguidores ou entre as pessoas que retwitaram uma pagina para fazer isso precisa ser utilizado o encurtador de url migre, neste caso coloque a url que reduziu usando o migre no local indicado e clique em sortear.

sortear retweets ou seguidores
Depois que clicar no botão do sorteio que desejar verá a pagina do resultado semelhante a essa:

sorteio no twitter
Esse é um site muito interessante e pode ser muito útil para blogueiros, basta usar sua criatividade e criar promoções para ajudar na divulgação do seu blog ou presentear seus visitantes.


Gadgets do Google Friend Connect

Além de gadget do blogger para mostrar os seguidores de nosso blog também temos a opção de fazer esse acessório através do Google Friend Connect que além do gadget com os seguidores do blog oferece ainda outros acessórios muito úteis para seu blog, como por exemplo, comentários, criar pesquisas e varias outras coisas.

Vamos falar apenas de dois gadgets para não misturar assuntos demais numa postagem só, mas no site Google Friend Connect você poderá testar todos os gadgets e usar aqueles que acharem mais interessantes para seu blog.

Google Friend Connect
Adicionar o gadget de membros- Facilite a participação no seu site e conheça outros usuários.
Esse é o gadget dos seguidores, você só precisa clicar no botão e depois escolher as cores, largura e quantas linhas com as fotos (miniaturas) dos seguidores mostrará no seu blog, quando terminar clique no botão gerar código no final da pagina, copie o código e coloque no seu blog pela pagina designer, adicionar gadget, html/javacript. Indo no caminho inverso, veja aqui como Parar de Seguir um Blog, afinal nem sempre fazemos as escolhas certas e temos o direito de não seguir mais caso o blog não seja tudo aquilo que esperavamos dele.

seguidores do blogger
Outro gadget interessante para seu blog é Reunir interesses dos usuários (Conheça os usuários fazendo perguntas que são importantes para você) aqui você poderá criar pesquisas (enquetes) para colocar no seu blog o procedimento é basicamente o mesmo, clicar no botão Reunir interesses dos usuários, criar sua pergunta e depois configurar o gadget.

Além desses o ultimo item Analisar dados da comunidade (Visualizar dados da comunidade e análises de outros sites) permite ver um gráfico mostrando o aumento no numero de seguidores do seu blog ao logo do tempo, isso é semelhante aos gráficos dos contadores de visitas.

Enfim como já dissemos no inicio o Google Friend Connect oferece varias ferramentas interessantes para seu blog, então espero que visitem o site e aproveitem da melhor forma possível. 

Colocar Últimas noticias, esportes no seu blog

Você pode usar os feed de qualquer site para inserir no seu blog uma lista com as últimas notícias, novidades dos esportes, vida dos famosos, novelas, informações sobre tecnologia e muitas outras coisas. Tudo isso sendo atualizado automaticamente, parece muito bom e melhor ainda que é muito simples de fazer apenas adicionando um gadget.feed últimas notícias

Visite um site que goste e confie sobre notícias, esportes, tecnologia, horóscopo, fofocas enfim qualquer coisa que tenha algo relacionado com o conteúdo do seu blog ou simplesmente você acha que seria de interesse de seus visitantes e copie o endereço do feed, depois apenas entre na pagina designer, adicionar gadget, e cole esse feed, e já está tudo pronto seu blog agora mostrará links para novas atualizações desse feed que acabou de adicionar.



Se quiser ainda temos aqui alguns gadgets com varios conteúdos para seu blog ou asúltimas noticias geradas pelo site Google Noticias. 

Criar um Índice do blog - Mostrar links de todos os posts

Veja como fazer um índice no blog com o titulo e o link de todas as postagens, esse código mostrará o links de todos seus posts em ordem de publicação, colocando os mais recentes no final da lista. Se quiser veja aqui como mostrar uma lista em ordem aleatória com os artigos recentes, isso pode ajudar na divulgação do seu blog fazendo seus visitantes olharem mais paginas e assim tem mais chances de gostar e voltar outras vezes no seu blog ou quem sabe até recomendar o blog para outras pessoas e assim atrair mais visitas.

Entre na pagina designer, clique para adicionar um gadget e use a opção html/javascript. Então cole o código abaixo:

<style type="text/css">
.todosposts {
border: 1px solid #000;
height: 250px;
width: 300px;
overflow: auto;
}
.todosposts a{
color: #00C;
text-decoration: none;
}
.todosposts a:hover{
color: #F00;
text-decoration: underline overline;
}
</style>
<div class="todosposts">
<script type="text/javascript">
function showrecentposts(json) {
document.write('');
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
posttitle = posttitle.link(posturl);
var readmorelink = "(Baca)";
readmorelink = readmorelink.link(posturl);
var postdate = entry.published.$t;
var cdyear = postdate.substring(0,4);
var cdmonth = postdate.substring(5,7);
var cdday = postdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "Jan";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "May";
monthnames[6] = "Jun";
monthnames[7] = "Jul";
monthnames[8] = "Aug";
monthnames[9] = "Sep";
monthnames[10] = "Oct";
monthnames[11] = "Nov";
monthnames[12] = "Dec";
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
if (!standardstyling) document.write('<div class="bbrecpost">');
if (standardstyling) document.write(posttitle);
if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
if (!standardstyling) document.write('</div><div class="bbrecpostsum"">');
if (showpostsummary == true) {
if (standardstyling) document.write('<br/>');
if (postcontent.length < numchars) {
if (standardstyling) document.write('<i>');
document.write(postcontent);
if (standardstyling) document.write('</i>');}
else {
if (standardstyling) document.write('<i>');
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd);
document.write(postcontent + '...' + readmorelink);
if (standardstyling) document.write('</i>');}
}
if (!standardstyling) document.write('</div>');
if (standardstyling) document.write('<br/>');
}
if (!standardstyling) document.write('<div class="bbwidgetfooter">');
if (standardstyling) document.write('<br/>');
}
var numposts = 1000;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://dicasparablogs.blogspot.com/feeds/posts/default?
orderby=published&alt=json-in-script&max-results=999
&callback=showrecentposts"></script></div>


Sabemos que é um código grande, mas as partes que precisam de alteração são poucas e fáceis de fazer, no inicio do código temos o seguinte trecho:

.todosposts {
border: 1px solid #000;
height: 250px;
width: 300px;
overflow: auto;
}
.todosposts a{
color: #00C;
text-decoration: none;
}
.todosposts a:hover{
color: #F00;
text-decoration: underline overline;
}

Na primeira linha podemos escolher outros tipos de bordas e o tamanho da caixa alterando os valores do estilo todosposts{..., veja as linhas: height: 250px; width: 300px. Se não quiser a caixa, mas mostrar somente a lista completa sem barra de rolagem apague o trecho overflow: auto; e height: 250px.

Depois podemos editar completamente a aparência dos links alterando o estilo .todosposts a e .todosposts a:hover, veja aqui como fazer a formatação de texto dos links.

E na parte final do código temos a linha:

...script src="http://dicasparablogs.blogspot.com/feeds/posts/default?
orderby=published&alt=json-in-script&max-re....

Aqui você deve colocar o endereço do seu blog e já está tudo pronto. Falamos aqui como fazer isso em um gadget, mas poderia ser muito util também numa pagina extra do blogger, assim você teria um link para mostrar seu indice em vezes que carregar junto com cada pagina visitada.

Também é possivel criar uma lista com os posts de cada um dos marcadores do blog, para fazer isso no trecho onde colocamos o endereço do blog, modifique para ficar assim:

http://www.dicasparablogs.com.br/feeds/posts/default/-/Efeitos?
orderby=published&alt=json-in-script&m......

A palavra Efeitos é o nosso marcador, mas se for utilizar isso precisa escrever o nome do marcador exatamente como está no seu blog, fizemos um teste e usando a palavra efeitos com letra minúscula não funcionou, portanto tem que ser igual está no marcador do blog. 

Fazer Podcast - Colocar MP3 no Blog

Algumas pessoas perguntaram sobre como fazer um Podcast no blog, ou seja, colocar uma gravação em áudio com sua própria voz falando alguma mensagem ou qualquer outra coisa. Essa tarefa se divide em duas partes: hospedar o arquivo mp3 e criar o código do player para tocar o arquivo de som no seu blog.

A hospedagem pode ser feita em qualquer site de hospedagem ou no Google Sites, isso depende onde você achar mais fácil, depois copie o endereço do arquivo e entre no site http://flash-mp3-player.net escolha um dos modelos. Vamos usar como exemplo o normal.

podcast no blogger

Clique no item generator no menu à direita e coloque o endereço do arquivo mp3 que você hospedou na internet no campo MP 3, clique enter e depois copie o código da caixa HTML code e já está pronto. Agora entre no seu blog e pode usar como um gadget de html/javascript ou em uma postagem.
Player no Blog

Veja logo abaixo um exemplo funcionando na pratica (é um som apenas para teste que achamos na internet – barulho de avião):


Mas poderia ser qualquer coisa como uma musica, ou você falando algo para seus leitores enfim isso fica a critério de cada um como usará esses players para colocarmusicas no blog ou fazer Podcast no seu Blog.

Sobre programas para gravar áudio no seu computador você poderá encontrar no Baixaki (Audacity 1.3.12 Beta) esse link é apenas uma sugestão com base em dados que observamos no site (avaliação dos usuários e numero de downloads), portanto se você já usa algum que acha melhor ou mais fácil de usar que esse pode dar a sugestão e vamos criar uma lista de programas para gravação e edição de áudio neste tutorial.

Claro que esse foi um tutorial para mostrar apenas os primeiros passos de como funciona esse site com players para mp3, quando você criar os seus podcasts poderá explorar melhor o site e ver muitos outros detalhes que não falamos aqui. 

Placar dos Jogos de Futebol ao Vivo no seu Blog

Uma das perguntas frequentes que recebemos é como colocar o placar dos jogos de futebol no blog. Achamos no site IG Esportes a solução para isso, o site fornece um placar mostrando os resultados do Campeonato Brasileiro, Italiano, Espanhol e outros. Caso você tenha interesse por outros tipos de noticias no seu blog poderá ver neste link.
fubebol brasileiro
Tudo isso atualizado na hora que os gols acontecem nos jogos, realmente mostra os resultados das partidas em tempo real. Usando as palavras do site para descrever esse serviço gratuito: “O serviço de tempo real do iG acompanha lance a lance, com estatísticas e espaço para comentários através das redes sociais, os jogos mais importantes de todos os campeonatos de futebol no Brasil e do mundo. A partir de agora, você também pode oferecer essa ferramenta aos visitantes do seu site ou blog: basta copiar o código abaixo e inseri-lo no html do seu site.”

Para colocar desse gadget com o placar dos jogos no seu blog copie o código abaixo, entre na pagina designer, adicionar gadget, html/javascript e cole o código.

<object height='115' width='299' classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0'><param name='movie' value='http://placar.ultimosegundo.com.br/placarus/placar_igesporte.swf'/><param name='quality' value='high'/><param name='wmode' value='opaque'/><embed height='115' width='299' src='http://placar.ultimosegundo.com.br/placarus/placar_igesporte.swf' wmode='opaque' quality='high' pluginspage='http://www.macromedia.com/go/getflashplayer' type='application/x-shockwave-flash'/></object>


Veja logo abaixo um exemplo com os resultados dos campeonatos de futebol atualizados:

Em outras épocas do ano mostrará também os resultados de campeonatos regionais como, por exemplo, o Campeonato Paulista, Campeonato Carioca e todos os outros jogos mais importantes do futebol nacional e mundial. 

Mostrar Botões de Compartilhamento no Blogspot

Já mostramos diversos tutoriais sobre botões para redes sociais, mas ainda faltou falar sobre os botões para esses sites e agregadores de links feitos pelo próprio Blogger (Mostrar botões de compartilhamento). Você pode ativar essa opção pela pagina designer do modelo, mas precisa adicionar mais um código html para que funcione realmente os botões para Orkut, Twitter, Facebook e Google Buzz(Botão do Facebook, Twitter, Google Buzz no mesmo Gadget).

compartilhar blogger
Como já dissemos o primeiro passo é ativar esse acessório na pagina designer do modelo clicando para editar as postagens e marcando a opção Mostrar botões de compartilhamento.

Antes de começar recomendamos fazer um backup do HTML do seu blog. Agora entre na pagina editar html, marque para expandir modelos de widgets, procure por <div class='post-header-line-1'> ou <post.body/> e depois adicione esse código logo abaixo:

<div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div>

codigo de fonte do blog
Agora clique para salvar e visualize seu blog. Se quiser modificar o lado que os botões aparecem no seu blog volte a pagina editar html (Onde colocar os códigos no blog) e coloque essa linha de código CSS:

.post-share-buttons{float:left}

html do blogger
Do jeito que está os botões ficarão do lado esquerdo das postagens e para colocar do lado direito troque a palavra left por right no código acima.

Essa é mais uma opção para divulgar seu blog nas redes sociais(Botão para as redes sociais - AddThis), mas precisamos lembrar que o principal é ter um conteúdo interessante no blog para que as pessoas tenham motivos para usar esses botões para recomendar suas postagens a outras pessoas. 

Imprimir ou Salvar em PDF o Post do seu Blog

Alguns blogueiros perguntaram sobre como imprimir as postagens do blog ou permitir salvar a postagem do blog no formato PDF(Converter blog em arquivo PDF e enviar por e-mail), nós achamos um site que faz esse serviço gratuitamente e muito fácil de usar no blogger.

Você só coloca um código no seu blog e aparece um botão que imprime ou salva como PDF o post do seu blog. Essa é mais uma maneira de facilitar o acesso aos seus textos e pode até ajudar na divulgação já que o botão também mostra a opção de enviar por email a postagem. Outro serviço útil é permitir ouvir as postagens do seu blog, mas isso já mostramos em outro tutorial: Ouvir as postagens do blog

Entre no site Printer Friendly & PDF Button For Websites and Blogs (http://www.printfriendly.com/button), veja que no inicio da pagina tem a opção dobotão para imprimir e salvar PDF para o Blogger, WordPress e Website. Clicando em Blogger ou WordPress você verá instruções sobre como instalar o botão nestas plataformas de blog.

imprimir ou salvar como PDF as postagens do blog
Mas se preferir pode usar a opção website e colocar o código como um gadget na parte da sua pagina que achar melhor(Problemas para mover ou adicionar gadgets do blog). Para fazer isso entre na pagina designer(Elementos da página), depois clique para adicionar um gadget e escolha a opção html/javascript, cole o código e salve. Isso faz o botão aparecer em todas as paginas do blog e não somente nas paginas individuais das postagens como na opção Blogger. 

Download de Icones para Redes Sociais (Twitter, Facebook, Orkut)

Veja e faça download grátis de milhares de ícones dos mais variados tipos, você encontrará ícones prontos para baixar e usar no facebook, blogger, twitter, vídeos, redes sociais, internet, compras, downloads, musicas e muitos outros ícones e logotipos que você desejar, inclusive do Windows.

Os icones que falamos são apenas imagens com simbolos dessas redes e outros temas que mencionamos se quiser botões para divulgar seu blog nas redes sociais veja aqui: Botão do Facebook, Twitter, Google Buzz no mesmo Gadget ou Links para divulgar blog no Twitter, Facebook, Orkut, Google Buzz.

icones do blog - blogger
O site http://findicons.com tem uma busca para você encontrar o ícone do tipo que deseja e ainda as imagens separadas por categorias(semelhante aos marcadores do blogger), assim você pode procurar e achar muitas opções de ícones sobre qualquer tema que imagine.

Uma coisa curiosa que notamos no site é que mesmo pesquisando palavras em português ele converte a busca para o inglês o que certamente facilita a vida de quem não sabe muito bem a linha inglesa. Em um teste pesquisamos por dinheiro e o resultado da busca já apareceu com a palavra money.

Depois que achar o ícone que procura clique sobre ele, fizemos um teste com um ícone para o facebook, na tela que aparece a opção de download no formato ico, png e outros. Você também pode escolher o tamanho do ícone clicando na guia outro tamanho.

formatos e tipos de icones
Então sugerimos se for utilizar como favicon no Blogger (Imagem na Barra de Endereços) escolha o tamanho 16x16 e formato ico assim será só hospedar e usar no seu blog. Esperamos que gostem de mais essa dica de site e aproveitem bem tantas opções de imagens grátis para download. 

Widgets UOL no seu Blog - Ultimas Noticias, Esporte, Cinema

Existem diversas maneiras de colocar ultimas noticias ou novidades no blog, como por exemplo usar o feed para mostrar noticias recentes publicadas em qualquer site, o google também disponibiliza widgets de noticias, esportes, economia e outros.

Seguindo essa linha de gadgets com noticias atualizadas automaticamente encontramos os widgets do UOL, eles oferecem links com as novidades de vários setores do site: Primeira pagina, economia, esportes, cinema, celebridades, tecnologia, carros e outros.

widgets uol ultimas noticias no blog
Você só precisa escolher qual dos widgets vai colocar no seu blog, clicar sobre ele e depois pegar o código HTML do modelo que mais gostar. Entre na pagina do blogger, depois na pagina designer, adicionar gadget, escolha a opção html/javascript e cole o código.

Agora já está tudo pronto e está pode ser uma maneira fácil e interessante de mostrar sempre no seu blog os últimos acontecimentos. Além das notícias recentesvocê pode ver na pagina de busca de Gadgets do Google, lá você encontrará muitas outras coisas para colocar no seu blog: previsão do tempo, jogos, informações sobre tecnologia e muito mais. 
 
DICAS DO BLOGUEIRO. Blogger-SB template es una adaptación del template de Blogger, adaptada por SebaKito, disponible en Somos Blogger.