domingo, 31 de maio de 2009

Como editar letras e cores no template do Blogger

Vamos para um post beeem básico, mas que tem sido motivo de procura pelos usuários novatos do Blogger. Como trocar as letras (fontes) e as cores do template?

Bem, isso vai depender muito do template. Hoje em dia, a maioria deles já vem com a opção de fazer tal alteração pelo próprio painel do Blogger, enquanto outros só permitem que a mudança seja feita via html – o que não é o ideal para os novatos.

Se você não tem intimidade com html, opte por templates que sejam fáceis de usar e que já venham com diversos hacks (funções) instalados, como os do Dicas Blogger :P

Mudando as cores e fontes pelo painel do Blogger

Faça login em sua conta do Blogger e, no painel de controle, clique em layout:

painel Blogger

Agora, clique em fontes e cores que fica ao lado de elementos de página:

Blogger Fontes e Cores

Este é o painel onde iremos escolher as cores do nosso template. Note que à medida que vamos trocando de cor, podemos ir visualizando a alteração logo abaixo, no próprio template.

Caso uma cor não tenha ficado legal, clique em limpar edições para que tudo volte ao que era antes. Mas se você está satisfeito com o resultado, clique em salvar alterações.

Para mudar as fontes, role a barra das cores para baixo, até encontrar as fontes.

Trocando as fontes

Temos 6 opções de fontes em itálico, negrito ou normal e podemos aumentá-las ou diminuí-las. Assim como acontece com as cores, à medida que vamos alterando as fontes, podemos visualizar a mudança em um rascunho do template, que fica logo embaixo do painel. Faça os testes necessário e só salve quando tiver certeza que gostou do resultado.

Mudando as cores e fontes pelo HTML do Blogger

Agora vamos aprender a mudar as fontes e as cores através do código html do template. Vou usar como exemplo um modelo onde tudo vem configurado via html. Notem que no painel fica tudo em branco, o que assusta muita gente.

Edição via html

Bem, agora vamos clicar em editar HTML e, utilizando os comandos do teclado (Crtl+F), iremos procurar pelas cores e fontes dentro do código html.

Procurando as cores

Procurando as fontes

Mas como vou saber o número da cor que eu quero colocar? Simples! Você pode usar o Photoshop ou mesmo o painel de cores do Blogger a partir de um outro template. Na web, também encontramos diversas  tabelas de cores. No exemplo abaixo, eu abri a tabela do Blogger em uma outra janela e fui escolhendo as cores e copiando os respectivos números.

Usando a tabela do Blogger

A cada cor que você trocar, clique em visualizar para ver como ficou no rascunho e se não estiver bom, clique em limpar edições. Quando estiver tudo ok, clique em salvar modelo.

salvando o modelo

Mexer em html é chato? Com certeza! Por isso abandonei a vida de blogdesigner (ou não):P

segunda-feira, 25 de maio de 2009

Saiba como usar scripts dentro dos posts

Bem, tudo começou quando decidi ganhar dinheiro com este blog. Conforme contei pra vocês, eu não levava muito a sério o tema monetização, mas de um tempo pra cá me vi obrigada a decidir o rumo da minha vida como blogueira. Estou estudando bastante e os resultados têm sido muito bons, superando as minhas expectativas.

Uma coisa que me deixava encucada era o fato do Blogger não saber o que fazer com os códigos em javascript, quando colocados dentro dos posts ( na sidebar funciona que é uma beleza!) Ou ele não interpretava o código e o espaço ficava em branco ou havia um conflito com outros códigos da sidebar, provocando um aspecto, no mínimo, estranho.

Pensando em ampliar o meu futuro financeiro e seguindo as dicas dos próprios programas de afiliados, eu queria colocar anúncios dentro dos artigos mais acessados do blog - não aqueles anúncios que aparecem em todas as páginas individuais e que é inserido via html do template; o que eu queria era escolher a posição e em quais posts colocá-los.

Ontem eu passei horas criando um FAQ-Perguntas Frequentes para facilitar (ainda mais) a vida nos novatos e a minha também, pois por mais que eu deixe claro que eu não respondo dúvidas por email, o povo continua insistindo. Isso me lembra o Cidão dizendo no Twitter que “regras ninguém lê”, mas eu sou brasileira e não desisto nunca :P

Enquanto eu criava o FAQ, a idéia de colocar alguns anúncios no referido post, ressurgiu com força total. Resolvi então, usar a segunda melhor ferramenta que existe no mundo da informática (a primeira é o Google): fuçar,fuçar e fuçar. Acabei descobrindo a solução!

Pode ser que pra alguns isto nem seja novidade, mas eu jamais tinha lido em nenhum dos metablogs que acompanho e nem o mestre Compulsivo sabia desta função – claro que ele foi o primeiro a ser informado ;). Usando o editor de textos do Blogger in Draft, é possível inserir qualquer tipo de script dentro dos posts, contanto que “ele” seja informado que desejamos que o código seja interpretado (convertido).

Lembrem-se de verificar se este procedimento é permitido pelo programa de monetização que vocês estão usando em seus blogs; caso seja o AdSense, leiam os regulamentos do programa e assistam o vídeo Seminário do Adsense sobre monetização de blogs.

O script poderá ser inserido tanto em posts antigos, quanto nos novos. Para a primeira opção, entrem no Blogger in Draft e no painel de controle, cliquem em editar postagens. Escolham o post a ser editado, coloquem o script e cliquem em  opções de postagens. Em configurações de criação de mensagem, marquem a caixa Interpretar HTML digitado. Para um post novo, cliquem em nova postagem e sigam as demais instruções.

editor de textos do Blogger in Draft

Vejam o resultado na página do FAQ e na página dos nossos templates. Ficou legal :D

Lembrando que esta função não serve somente para colocar anúncios dentro dos posts. Com ela, podemos inserir qualquer tipo de script, tais como os usados em formulários de contato, slides do Google Docs e etc. É mais um caminho para nós usuários do Blogger.

sábado, 23 de maio de 2009

Quer saber quem te segue (ou não) no Twitter?

Seguir ou não seguir, eis a questão. Muito tem se falado sobre como se comportar no Twitter. Na minha opinião, tirando algumas regrinhas básicas de convivência, eu acho que cada um deve fazer o que bem entender com a sua conta e deve, também, estar preparado para receber os unfollows e os blocks com discrição (sem surtar).

Há quem defenda que é de bom tom retribuir os followers, como é o caso do nosso amigo Isaías Malta, que escreveu o post Unfollows no Twitter podem comprometer a sua popularidade no resto da Internet, onde deixou claro que só segue quem o segue.

Eu não dou conta de acompanhar muita gente; estou ficando velha e o tico e teco andam se estranhando. Também não uso da política do Isaias, ou seja, eu sigo quem não me segue e não me importo de receber unfollows, mesmo que seja de amigos (isto já aconteceu).

Repito: cada uma deve fazer o que achar melhor e de acordo com as suas convicções, certo? Eu respeito a posição do Isaias e de todos os demais tuiteiros.

Mas, como a maioria dos seres humanos é formada por curiosos, já criaram um site que mostra rapidinho aos mais afoitos, todos os seguidos que não os seguem – Friend or Follow.

É só colocar o username do Twitter e clicar em submit. Não é necessário colocar a senha.

O Twitter é um local que serve, entre outras coisas, para recebermos informações; então, se o usuário é relevante pra mim, tá valendo, me seguindo ou não. Sigam-me os bons! \0/

Se quiser me seguir: http://twitter.com/julianaDB



sexta-feira, 22 de maio de 2009

Seminário do Adsense sobre monetização de blogs

Aconteceu no dia 08 de maio, um seminário da equipe do Google Adsense, sobre otimização de anúncios em blogs. O seminário foi trasmitido ao vivo e os editores receberam um convite por email. Como nem todo mundo pôde assistir, o evento foi gravado e disponibilizado no YouTube. Vale à pena conferir. As dicas são preciosas e já tratei de implantá-las ;)


Google AdSense - Seminário "Otimização de blogs" Seminário sobre otimização de blogs apresentado no dia 08 de Maio de 2009. Fonte: Por Dentro do AdSense

**Imagem meramente ilustrativa.

Feeds dos marcadores para Blogger/Blogspot

Esta eu não conhecia! Segundo eu li em um dos blogs do Blogger, é possível obtermos feeds dos marcadores, assim como já fazemos com os feeds dos comentários e dos posts.

O endereço do feed é bem parecido com os demais:

http://BLOGNAME.blogspot.com/feeds/posts/default/-/LABELNAME

Troque BLOGNAME, pelo nome do blog e LABELNAME, pelo nome do marcador. Exemplo:

http://dicasblogger.blogspot.com/feeds/posts/default/-/Primeiros%20Passos

Para colocar na sidebar, entre em layout e na aba elementos de página, escolha adicionar um gadget e depois feed. Coloque a url já editada e clique em continuar. Salve

feeds na sidebar

Vamos refrescar a memória? Então, segue abaixo todos os feeds de um blog do Blogger!

Feed dos posts

http://seublog.blogspot.com/feeds/posts/default

Feed dos comentários

http://seublog.blogspot.com/feeds/comments/full

Feed dos marcadores

http://BLOGNAME.blogspot.com/feeds/posts/default/-/LABELNAME

Podemos tanto oferecê-los para que nossos leitores assinem, quanto podemos inseri-los na sidebar como um widget. Legal, né? E vem mais novidades por aí…

quinta-feira, 21 de maio de 2009

Blogger apresenta problemas no Internet Explorer 8

Alguns leitores me reportaram problemas com seus blogs, quando visualizados a partir do Internet Explorer 8 – a nova versão do navegador da Microsoft.

No blog do Charles Silva, todos os widgets desapareceram e não era possível acessá-los nem mesmo pelo painel de controle. O Zé Marcos me mandou um comentário informando que seu blog e o da esposa não estavam mais abrindo no IEca e aparecia uma mensagem de “operação abortada”. No Dicas Blogger, não percebi nenhuma mudança.

O Cidão acaba de nos avisar, via Twitter, que a Equipe do Blogger já está ciente do problema e buscando uma solução. Portanto, nada de desespero :P

Some users are seeing an 'Operation Aborted' error message when trying to load their blogs from Internet Explorer. We're looking into this and will update this message when we have a fix.

Acredito até que eles já devem ter corrigido o erro, pois ao visitar novamente os blogs citados, encontrei tudo em ordem. Vamos aguardar um novo pronunciamento do Blogger.

ATUALIZAÇÃO EM 22/05 ÁS 21:30

O problema persiste e já atingiu o Dicas Blogger :(

problema no IEca

ATUALIZAÇÃO EM 26/05/2009

O bug foi com o widget dos seguidores. A solução provisória, sugerida pelo Blogger, é retirar esse widget ou movê-lo para o rodapé do blog.

terça-feira, 19 de maio de 2009

Código para exibição aleatória de banners

Fui procurada pelo Patrick Nogueira, do blog Boas Promoções, para conhecer um script desenvolvido por ele que tem a função de randomizar a exibição de banners na sidebar.

O Patrick me pediu para publicar o script aqui no Dicas Blogger, a fim de compartilhá-lo com um maior número de usuários. Como achei a idéia interessante, principalmente para quem  utiliza o sistema de parcerias com banners, resolvi escrever o post.  Com este script, os blogs parceiros irão aparecer de forma aleatória, a cada nova exibição de página.

Não entendeu? Então vamos para um exemplo: quero exibir na minha sidebar os banners de 10 blogs diferentes; o primeiro é o blog 1, o segundo é o 2, o terceiro é o 3 e assim sucessivamente. O blog 10 vai ficar lá no final da fila, certo? Errado. Com o script do Patrick, ele irá aparecer em uma nova posição toda vez que a página for atualizada.

O procedimento para inserir o script no blog é bem simples. Copie o código abaixo, cole no bloco de notas e substitua as partes em vermelho pelo código de cada banner a ser exibido. Depois, copie o código editado e cole na sidebar em html/javascript.

<script type="text/javascript">
function randOrd()
{
return (Math.round(Math.random())-0.5);
}
function randBan(){
var parceiros = new Array();

parceiros[0]='CÓDIGO DO BANNER';

parceiros[1]='CÓDIGO DO BANNER';

parceiros.sort( randOrd );


for(i=0;i<=parceiros.length-1;i++) document.write(parceiros[i] + '<br>');
return;
}
randBan();
</script>

Vou dar um exemplo, usando os banners do Dicas Blogger e do blog Boas Promoções:

<script type="text/javascript">
/* Esta função irá fazer o randômico dos banners */
function randOrd()
{
return (Math.round(Math.random())-0.5);
}
/* Função que irá escrever os banners na tela*/
function randBan(){
var parceiros = new Array();

/* Aqui colocamos a quantidade de banners para rotacionar. Você pode criar de parceiros[0] até parceiros[N] */

parceiros[0]='<a href="http://www.boaspromocoes.com.br" target="_blank"><img border="0" src="http://img34.imageshack.us/img34/9468/56072301.gif" title="As melhores promoções da internet"/></a>';

parceiros[1]='<a target="_blank" href="http://dicasblogger.blogspot.com/" title="Dicas Blogger"alt="Dicas Blogger"><img src="http://lh6.ggpht.com/ekosterapia/SJQh02kmhBI/AAAAAAAABnE/Bxr3ACrLRoo/s144/banner.png" style="border: 1px solid #000000" /></a>';

//Aqui iremos randomizar a posição dos banners
parceiros.sort( randOrd );

//Aqui iremos escrever os banners em sua ordem aleatória
for(i=0;i<=parceiros.length-1;i++) document.write(parceiros[i] + '<br>');
return;
}
randBan();
</script>

O código também pode ser visualizado aqui.

Eu testei e funciona! Qualquer dúvida referente à instalação do script, deve ser encaminhada ao seu desenvolvedor. Os elogios podem ser encaminhados pra nós dois ( lol )

domingo, 17 de maio de 2009

Nerdcast – o melhor podcast do mundo!

Nerdcast, o melhor podcast do muuundo! Assim é definido, por seus idealizadores e por grande parte dos ouvintes, o podcast do blog Jovem Nerd. Criado em 2006, o Nerdcast é um bate-papo informal entre Alexandre Ottoni, Deive Pazos e convidados.

Super bem-humorados, inteligentes e criativos, esses dois nerds da década de 80 revolucionaram a forma de fazer podcast no Brasil.  Em 2007, eles levaram o prêmio Best of the Blogs Awards na categoria “melhor podcast” e em 2008, o iBest nas categorias “melhor podcast”, “melhor blog de humor” e “melhor blog de notícias”.

O Nerdcast é parada obrigatória para todo blogueiro nerd/geek e acredito que ninguém aqui vai querer ficar de fora, certo? Então, pra começar com o pé direito, nada melhor do que vocês escutarem o episódio mais recente da dupla - Nerdcast 161 - @nerdcast em 140 caracteres #twitter -  com a presença de três grandes feras da web nacional: Carlos Cardoso, Carlos Merigo e Cris Dias – um dos primeiros brasileiros a utilizar o Twitter.

Essa galera animada e experiente vai falar sobre a recente história do Twitter, sua evolução, o que pode (ou não) ser dito em 140 caracteres, credibilidade e o uso de scripts para roubar no jogo aumentar seguidores, celebridades e muito mais.

Devo adverti-los de que o Nerdcast pode causar dependência. Para aliviar a abstinência, vocês podem ouvir os 160 episódios anteriores ou aguardar a próxima sexta-feira.

Assim como o Twitter e o iPhone, eu aderi ao Nerdcast por insistência sugestão do megaboga Compulsivo (não sabe o que é megaboga? então você nunca ouviu o Nerdcast!).

 ** Este artigo foi criado por sugestão de alguns dos meus seguidores.Fonte da imagem: Jovem Nerd**

quarta-feira, 13 de maio de 2009

Atualização do Twitter gera polêmica

Eu estava lendo meus Feeds tranquilamente, quando me deparei com o seguinte post do Manoel Netto – Twitter supõe (errado)que conhece seus usuários. Li, reli e tuitei. A princípio parecia que não era mais possível receber respostas (replies) das pessoas que não seguimos, o que perderia parte da graça do Twitter que é a interatividade.

Pedi então que aos seguidores que eu não sigo, que me enviassem um reply e constatei que o problema não era este. Os RTs também estavam normais. Fui até o blog do Twitter (powered by Blogger :P) e pela tradução (sou péssima em inglês), continuei boiando.

Eis que veio a inspiração e corri até a página do Twitter (cheia de teia de aranhas). Bingo! O que foi retirado pelos desenvolvedores do Twitter foi a possibilidade de visualizarmos os replies que os que seguimos enviam para os que não seguimos. Entenderam? É meio complicado, mas as imagens abaixo irão te ajudar.

A primeira imagem estava armazenada na minha conta do TwitPic, porque outro dia fiz uma enquete pra saber como era a configuração usada pelos meus seguidores, já que andavam dizendo que eu tuitava demais. Óbvio que para os que usavam a primeira opção, era tweet que não acabava mais, pois costumo responder a todos.

Segundo o Manoel Netto, esta alteração levou diversos usuários a reclamarem usando a tag #fixreplies, informação que pode ser confirmada fazendo uma busca do Twitter. A notícia também foi publicada no site da Info - Usuários do Twitter não aprovam mudança.

E vocês, o que estão achando desta mudança? Pra mim não fez diferença, pois como sou meio confusa, eu só via os replies dados a quem eu seguia.

terça-feira, 12 de maio de 2009

Screenshots de páginas web

Existem diversas maneiras de se tirar um screenshot.  A mais usada é aquela em que apertamos a tecla printscreen (prtScn) do teclado e depois colamos o resultado em algum editor de imagens (Paint, Photoshop, Gimp e etc).

Pra quem ainda não sabe, um screenshot é uma espécie de foto do que estamos vendo na tela do computador e é muito utilizado em tutoriais.

A desvantagem do método citado é que , em se tratando de páginas web, ele é super limitado, obtendo apenas uma captura parcial do layout.

A captura de páginas web ( ou webpage ) é útil tanto para testar templates em diversos navegadores, quanto para usar a imagem do site ou do blog em publicidade (midia kits).

Vou citar os 3 métodos que eu utilizo:

http://browsershots.org/

Uso online (não necessita instalação de softwares)

Permite a captura através de diversos navegadores e sistemas operacionais.

Ideal para testes de templates.

Geralmente tem uma longa fila de espera.

browsershot

http://www.superscreenshot.com/

Uso online (não necessita instalação de softwares)

Captura de página, tendo como resultado imagens grandes e de boa qualidade.

Ideal para usar como demonstrativo de templates

Geralmente tem fila de espera.

superscreenshot

http://www.websitescreenshots.com/

Software de fácil instalação

Captura a tela com rapidez e cria imagens de alta resolução

Ao contrário dos métodos online, não tem fila de espera.

Ideal para quem tem pressa :P

Basta colar a url e clicar em start, para que a imagem seja gerada.

WebShot

E vocês, conhecem outras formas de fazer screenshots? Então, comentem!

segunda-feira, 11 de maio de 2009

Como criar arquivos em PDF no Google Docs

Ontem eu estava terminando de fazer meu Mídia Kit no Word, quando me deparei com um problema: como vou converter o texto para PDF? Bom, existem milhares de programas que prometem fazer esta conversão, mas a melhor opção que eu encontrei foi o excelente editor de textos do todo-poderoso Google – o Google Docs. No ano passado, ensinei-lhes  como criar um formulário de pesquisas e hoje, explicarei como criar um arquivo em PDF.

Entre no Google Docs, clique em novo e depois em documento:

página inicial Google Docs

Abrirá o editor de textos do Google Docs, que é muito semelhante ao editor do Blogger.

editor de textos Google Docs

Crie seu texto da forma que achar melhor, assim como você faz em seus posts, inserindo imagens, links e etc. Depois, clique em arquivo > visualizar impressão para verificar como este trabalho irá aparecer no formato PDF.

visualizar impressão

Muito bem. Nesta altura do campeonato, você irá perceber que, tal qual acontece no Word, algumas páginas ficam totalmente desconfiguradas e agora é que vem o X da questão. Nos demais programas que testei, o PDF era gerado assim mesmo e ficava muito feio; já no Google Docs é possível delimitar as páginas,  ou seja, nós iremos escolher onde a página começa e onde ela termina. Legal, né?

Pra fazer isso, clique em inserir > quebra de página. Aparecerá uma linha (imaginária) embaixo de cada trecho que desejamos delimitar.

inserir quebra de páginas

Configue do jeito que você achar melhor e salve o seu projeto. Para transformá-lo em PDF escolha, em arquivo, a opção fazer download como PDF. Moleza, não?

criando PDF no Google Docs

Agora, meus futuros probloggers, mãos à obra! Em breve, disponibilizarei o Midia Kit do Dicas Blogger para download, com os formatos dos anúncios e seus respectivos valores.

<jabá on>Está uma pechincha e é sua grande chance de anunciar aqui :) </jabá off>

Quero agradecer, de coração, a todos os leitores que comentaram no post anterior. É muito gratificante receber este retorno tão positivo, repleto de carinho, de apoio e de consideração pelo meu trabalho. Prometo que, quando eu tiver mais tempo, voltarei a responder os comentários individualmente e  irei visitá-los em seus respectivos blogs. Adoro vocês! \0/

domingo, 10 de maio de 2009

Esclarecimentos sobre algumas mudanças no blog

Uma das características  mais importantes que um blogueiro deve ter é a capacidade de se comunicar com o seu público. Desde o início do Dicas Blogger venho tentando mantê-los informados de todas as mudanças estruturais do blog e até dos meus dilemas pessoais. O resultado é sempre muito bom e por isso hoje volto a compartilhar mais algumas mudanças.

Como vocês já devem ter percebido, o blog está repleto de publicidade. Até bem pouco tempo atrás, eu não me importava muito com monetização e basta vocês fazerem uma busca para comprovarem que escrevi muito pouco sobre o tema.

Agora, surgiu a necessidade de ao menos tentar ganhar uns trocados com o blog. E por que? Será que a medicina não rende o suficiente? Rende sim e eu gosto do que faço, porém está inviável cuidar de 3 blogs e me manter trabalhando em 3 locais diferentes.Ao contrário de Arnold Kim, que abandonou a medicina para se tornar problogger, minha intenção é dividir melhor o meu tempo entre a medicina e a internet. O blog cresceu tanto, que já não dá mais para encará-lo como passatempo ou lazer e cuidar dele somente nas “horas vagas”.

Sinto que estou fazendo uma jornada de trabalho desumana e insalubre, já que não tenho mais folga.Quando não estou clinicando, estou blogando. Como consequência, minha memória está pior do que a da Dori – aquela peixinha amiga do pai do Nemo.

Já faz um bom tempo que venho ensaiando uma decisão: ou paro de blogar ou deixo um dos meus empregos. Como sou uma moça ajuizada, antes de tomar uma decisão tão séria resolvi investir mais uma parte do meu escasso tempo estudando sobre monetização. Com esta mudança de paradigma, todos nós iremos ganhar: eu vou ganhar experiência e vocês irão ganhar posts sobre um assunto importantíssimo, mas que foi pouco abordado em um blog voltado para blogueiros que desejam fazer um trabalho sério.

Pra começar, estou fazendo diversos testes com o AdSense, desde posicionamento dos anúncios até os melhores formatos de publicidade. Vou experimentar também outros programas de afiliados,  anúncios particulares e criar um midia kit para facilitar o acesso dos futuros anunciantes. O que for bom vai permanecer e o que não for irá para a lixeira.

Outro ponto importante e que já podemos considerar como a primeira dica desta nova fase é que nós blogueiros devemos escrever para dois tipos de usuários: os leitores fiéis e os paraquedistas. O leitor fiel é aquele que, geralmente, é blogueiro também, sabe o que é um feed, acompanha todos os posts, interage com o autor e sempre que pode, faz questão de comentar no blog, mas que, dificilmente, vai clicar em anúncios. É ele que engrossa as estatísticas do FeedBurner, mas não as do Analytics e as do AdSense. Já o paraquedista é aquele internauta que, como o próprio nome já diz, cai de paraquedas no blog, proveniente dos mecanismos de busca (leia-se Google) procurando por algo que nem sempre ele encontra e por isso mesmo acaba enxergando os anúncios.

Os dois tipos merecem toda a nossa atenção e são de suma importância para a manutenção de um bom blog. Vou dar um exemplo prático: analisando as palavras-chave que mais trouxeram visitante ao DB, a campeã tem sido Twitter. Oras, se eu estou usando esta ferramenta com um grande entusiasmo, por que não escrever sobre ela? Foi o que eu fiz e tem dado super certo, pois aumentou consideravelmente o número de visitantes únicos e de cliques, sem com isso espantar os meus leitores fiéis, já que estes são espertos e também estão aproveitando o que o Twitter tem de bom.

Claro que é impossível agradar a gregos e troianos e a meia dúzia de críticos que eu “conquistei” nestes quase 2 anos  vai reclamar, mas quem está na chuva é pra se molhar e o DB me traz muito mais alegrias do que dores de cabeça.  Tenho convicção de que a maioria de vocês está aqui não só para saber como inserir o widget mais bonitinho no blog, mas para e principalmente, aprender como fazer um blog bacana.

Agradeço pela paciência de terem lido este (enorme) post até o final e aproveito o ensejo para desejar um Feliz Dia das Mães a todas as leitoras do Dicas Blogger.

quinta-feira, 7 de maio de 2009

Nuvem de tags personalizada para o Blogger

Lendo o excelente blog espanhol Gem@ BLOG, descobri uma forma legal de personalizar uma nuvem de tags (também chamada de nuvem de etiquetas ou tag cloud) para o Blogger/Blogspot. Como no Blogger em português as etiquetas são chamadas de marcadores, utilizarei esse termo na tradução do tutorial.

Entre no html do template e, usando os comandos Crtl+F do seu teclado, procure pela linha ]]></b:skin>. Cole ANTES dela o seguinte código:

.nuvem-html {

border: 1px solid #333;

background: url('url-imagem de fundo') repeat;

margin: 10px 0 10px 0;

line-height: 30px;

text-align: center;

padding: 2px;

padding-top: 10px;

}

.nuvem-html a {

text-decoration: none;

}

.nuvem-html a:hover {

border-bottom: 1px dashed #ccc;

}

Visualize o template e se tudo estiver bem, salve. Agora vá em elementos de página e escolha um gadget do tipo html/javascript. Cole o seguinte código:

<div class="nuvem-html">

<a style="color:#9b2230; font-size: 11px;" href="#">TEXTO</a>

<a style="color:#000000; font-size: 14px;" href="#">TEXTO</a>

<a style="color:#940f04; font-size: 42px;" href="#">TEXTO</a>

<a style="color:#999999; font-size:17px;" href="#">TEXTO</a>

</div>

Insira quantas linhas forem necessárias e faça as respectivas alterações.

color é a cor da fonte

font-size é o tamanho da fonte

“#” é a url do marcador

TEXTO é nome do marcador

Para obter a url do marcador, coloque o gadget padrão do Blogger na sidebar e depois copie os links, colando-os no local indicado do código (“#”)

gadget marcadores

Abaixo, veremos um exemplo usado no Diário de Bordo e o resultado final.

<div class="nuvem-html">
<a style="color:#9b2230; font-size: 11px;" href="http://www.diariodebordoweblog.com/search/label/Animais">Animais</a>
<a style="color:#000000; font-size: 14px;" href="http://www.diariodebordoweblog.com/search/label/Apresenta%C3%A7%C3%A3o">Apresentação</a>
<a style="color:#940f04; font-size: 12px;" href="http://www.diariodebordoweblog.com/search/label/Bizarro">Bizarro</a>
<a style="color:#999999; font-size:17px;" href="http://www.diariodebordoweblog.com/search/label/Brasil">Brasil</a>

</div>

nuvem de tags personalizada

Para colocar uma imagem de fundo (background), altere a linha abaixo, no primeiro código, substituindo url-imagem de fundo pela url da imagem que você escolheu.

background: url('url-imagem de fundo') repeat;

código no html do template

Um site legal para buscar imagens para o background é o DESIGNM.AG. Aí está o resultado:

nuvem com plano de fundo

A tradução e publicação do tutorial foram permitidas pela autora do Gem@BLOG.

Se você chegou até aqui, mas ainda não sabe o que é um marcador e muito menos como inseri-lo em seu blog, clique aqui.

No site Tag Cloud Generator, é possível gerar uma nuvem automática; o inconveniente é que ao invés de aparecerem os marcadores, aparecerão as palavras mais usadas no blog. Eles até permitem, como segunda opção, a criação de uma nuvem personalizada, mas com a desvantagem de não podermos colocar uma imagem no plano de fundo.

tag cloud generator

tags do Dicas Blogger

Como vocês podem perceber, ando falando muito do @compulsivo :P (ops, de novo?)#euri

ATUALIZAÇÃO: Agora é possível ter uma nuvem de tags usando um widget do próprio Blogger. Saiba como, clicando aqui.

terça-feira, 5 de maio de 2009

Licença Creative Commons ou não..

Creative Commons, Copyright e Termos de Uso

Recentemente escrevi um artigo falando sobre o eterno problema da cópia ilegal de conteúdo na web e da importância de se respeitar a lei dos Direitos Autorais.

Em seu último post para o Contraditorium (com direito à minha “participação especial”), o Cardoso nos mostrou uma outra face do tema:

Por sorte nem todo mundo que pega conteúdo alheio para uso próprio na Internet é um plagiador safado - Propriedade Intelectual Rouba mas Faz

Neste artigo (que vocês devem ler), o Cardoso nos conta a história de Dan Walsh, um cara que faz sucesso retirando o Garfield das tirinhas originalmente desenhadas por Jim Davis, seu criador. A idéia deu origem ao blog Garfield Minus Garfield e o Jim Davis, ao invés de sair descabelando por aí, apoiou a iniciativa de Dan Walsh.

Essa história só teve final feliz graças a uma rara conjunção de fatores: Jim Davis não é um babaca no estilo processa primeiro pergunta depois, e Dan Walsh não é um plagiadorzinho de bosta, que apenas copia e replica, sem acrescentar nada ou sequer creditar o autor original.

Óbvio que o Dan Walsh é exceção e que a web está cheia de plagiador safado. Mas o que vamos discutir hoje não é propriamente o plágio e sim a licença que devemos usar em nossos blogs. Partindo do raciocínio que tem gente honesta e bacana na web e que ser linkado é interessante – tanto para a divulgação do blog, quanto para os rankings – é importante deixar claro ao visitante o que ele pode e o que ele não pode fazer com o nosso conteúdo. A decisão é pessoal e eu só irei apontar os caminhos.

Uma das licenças mais utilizadas na Blogosfera é a Creative Commons:

As licenças Creative Commons foram idealizadas para permitir a padronização de declarações de vontade no tocante ao licenciamento e distribuição de conteúdos culturais em geral (textos, músicas, imagens, filmes e outros), de modo a facilitar seu compartilhamento e recombinação, sob a égide de uma filosofia copyleft. Fonte: Wikipedia

Uma bela idéia, por sinal, já que legitimiza o que há de melhor na internet – o compartilhamento de informações. As licenças Creative Commons permitem que o autor abdique de parte de seus direitos em prol da humanidade. Ela é dividida em módulos que podem ser previamente configurados e estão traduzidas e adaptadas às leis brasileiras. É uma ótima opção para quem não se importa de ver seu conteúdo replicado, porém linkado.

Outra forma de licenciar o seu conteúdo é o Copyright ©

Direitos autorais não são necessariamente o mesmo que copyright. O sistema anglo-saxão do copyright difere do de direito de autor. Os nomes respectivos já dão-nos conta da diferença: de um lado, tem-se um direito à cópia (copyright) ou direito de reprodução, do outro, um direito de autor; neste, o foco está na pessoa do direito (o autor); naquele, no objeto do direito (a obra) e na prerrogativa patrimonial de se poder copiar. Fonte: Wikipedia

Complicado? Com certeza, mas vamos tentar entender. No site Dicionário Publicitário encontrei uma definição um pouco mais simples:

COPYRIGHT - Direito legal de propriedade de um texto, frase, livro, obra de arte, música ou qualquer outra forma de expressão.

Ou seja, o autor da obra é o detentor de todos os direitos sobre a mesma. A Lei 9.610, em seu artigo 18 assegura esta propriedade, independente do registro da obra.

A utilização do símbolo ©, indica que o autor não autoriza a cópia do seu conteúdo, mesmo que seja citada a fonte. Nada impede que se entre em contato com ele para uma negociação.

Uma terceira forma de assegurar os seus direitos e deveres, é através da criação de uma licença personalizada. Vou pegar como exemplo o consagrado blog Meio Bit:

a) A cópia literal, ou seja a cópia integral de corpo, de textos ou artigos do Meiobit só é permitida se:

a.1- Houver citação explícita no artigo que reproduz conteúdo, em seu início ou fim, da autoria original do material e inclusão de links para a página do Meiobit que mantém a matéria da qual o texto original foi retirado; (…)

Você pode explicar aos seus leitores, de forma detalhada, todas as implicações legais, bem como indicar o que é e o que não é permitido. Me parece uma das mais adequadas, pois diminui a probabilidade do futuro plagiador alegar que “não sabia”. Alguns optam por denominar esta licença de Termos de Uso, entretanto dê o nome que melhor lhe convier.

Aqui no DB eu fiz uma miscelânea, mas que no final tem coerência. O nome do blog aparece com o Copyright, já que foi criado por mim e deixo claro com isso que não aceito imitações. O conteúdo está sob licença Creative Commons 2.5 - já que sou favorável ao compartilhamento de material na web. O usuário poderá copiar, distribuir, exibir e executar a obra desde que a fonte seja citada, que o uso não seja comercial e que não sejam criadas obras derivadas (ou seja, um blog idêntico). Nas Diretrizes aos Usuários, explico em detalhes o funcionamento do blog, o uso dos templates, a função dos comentários e do fórum e ainda dou conselhos (use a caixa de busca, procure no índice, seja criativo e etc.)

Lembrando que nada, absolutamente nada vai impedir que plagiadores safados copiem o seu conteúdo, mas algumas medidas podem prevenir a cópia por pessoas que, apesar de bem intencionadas, ainda não possuem conhecimentos de como as coisas funcionam por aqui.

E caso você, querido leitor, queira utilizar artigos de outros blogs, atente-se à estas licenças, use a citação, coloque sempre a fonte, nunca copie integralmente um post e na dúvida, entre em contato com o editor do blog a fim de solicitar a sua autorização.

ATUALIZAÇÃO: Em 8 de junho de 2009, passei a adotar o copyright também para os posts

sábado, 2 de maio de 2009

Como trocar o fundo (background) do Twitter

Apesar de quase mais ninguém usar o Twitter via web, mesmo assim eu acho que fica legal customizar nossa página inicial ou profile, pois quando colocamos um convite em nosso blog para sermos seguidos, o futuro seguidor ou follower será direcionado para essa página.

@julianasardinha (eu)

Se você concorda comigo e desejava trocar o plano de fundo ou background da sua conta, mas não sabia como, seus problemas se acabaram :D Vou ensinar não só como alterar, bem como indicar alguns sites com lindas imagens para deixar o seu perfil mais cool.

ALTERANDO O PLANO DE FUNDO

Faça login em sua conta e procure por settings e depois por design.

settings twitter

O Twitter já disponibiliza alguns desenhos. Neste caso, basta escolher um deles e clicar em save. Caso não tenha gostado das cores da sidebar e dos links, clique em change designs colors para alterá-los. É possível ir vendo as mudanças antes de salvar.

Para trocar por um plano de fundo personalizado, clique em change background image, escolha um arquivo salvo em seu computador e depois clique em save changes. São aceitas imagens de até 800kb, nos formatos GIF, JPEG e PNG. e é possível trocar o fundo todo clicando em tile background ou apenas parte dele.

trocando o fundo do twitter

Você pode criar o seu próprio background usando o Photoshop ou qualquer outro editor de imagens. Caso não seja um expert no assunto, sugiro que conheça estes sites:

No Twitter Gallery, dá até pra fazer uma instalação automática:

twitter gallery

E, por último, você pode ainda testar o seu novo background no Twitter Background Checker.

Quero apenas lembrar que o Twitter fica, ás vezes, estressado e quando isso acontece, ele não aceita alterações por algumas horas. Daí, só nos resta aguardar que ele se acalme :P



sexta-feira, 1 de maio de 2009

Blogger enfrenta problemas (erros bx)

Bug no Blogger

Diversos usuários estão enfrentando dificuldades para acessarem seus blogs desde ontem, conforme constatamos no fórum do Blogger. O problema acima, aparece tanto na página inicial de alguns blogs, bem como nas configurações de layout e no painel de controle.

A equipe do Blogger já se pronunciou à respeito, confirmando que  estão cientes desta instabilidade e em busca de uma solução. Portanto, não há motivo para pânico. Por precaução, façam backup dos posts, do template e dos widgets.

Como centralizar os widgets no Blogger

Dando continuidade à série Primeiros Passos, hoje vou ensinar como se faz para posicionar os widgets na sidebar, que é uma dúvida muito comum entre os leitores novatos.

Para obter este efeito, usaremos os códigos abaixo, substituindo “código do widget” pelo código que será inserido na sidebar em “html/javascript”. Iremos utilizar como exemplo uma imagem linkada, apontando para os feeds do Dicas Blogger.

CENTRALIZAR

<div align="center" > código do widget</div>

ou simplesmente

<center>código do widget</center>

Exemplo:

POSICIONAR À ESQUERDA

<div align="left" > código do widget</div>

ou simplesmente

<left>código do widget</left>

Exemplo:

POSICIONAR À DIREITA

<div align="right" > código do widget</div>

Exemplo:

Simples assim.