Guia Blogger

O último artigo da série Ferramentas para Blogs. São alguns programas e outros sites que oferecem serviços de hospedagem, até edição e captura.

7º artigo da série Ferramentas para blogs. Dessa vez trazemos uma lista de programas de ftp e microblogging.

Estamos no 6º artigo da série Ferramentas para Blogs. Nesse artigo, vamos mostrar sites que permitem a verificação de backlinks, diagnósticos e estatísticas de seu blog ou site.

  O quinto artigo da série Ferramentas para Blogs traz uma série de links para  sites com serviços para pesquisa de keywords.

O quarto artigo com ferramentas para blogs, traz sites com ferramentas SEO, agregadores de feeds e pesquisadores de noticias. Agregadores de feeds:

O terceiro artigo com ferramentas para blogs traz links de alguns serviços de subscrição (feeds) e alguns serviços de enquetes.

O Blogger anunciou recentemente um novo recurso chamado geotag, que permite a inclusão de rótulos sobre os locais citados em cada um dos post através do Google Maps.

Kirk Douglas costumava brilhar em filmes em preto e branco na década de 40. Hoje, quase meio século depois, passa parte de seu tempo digitando em seu blog e perfil no MySpace.

A segunda parte da lista de ferramentas para blogs, traz links de ferramentas para webmasters.

Eu encontrei no Blog Windows XP, um artigo que indicava várias ferramentas para blogs. Um conjunto de ferramentas úteis em vários aspectos desde editores, ferramentas SEO, serviços de e-mail, etc.

Esse hack foi criado pelo Vagabundia e traduzido pelo Xavier . Quem o encontrou e nos deu a dica foi o Fabricio do Blog Windows Brasil . Se quiser um exemplo, é só ver os comentários de algum artigo do GB. O link para a página do tutorial é esse aqui: http://blogdoxavier.blogspot.com/2008/09/colocando-foto-do-comentarista-ao-lado.html Update 18/11/09 O BLOGGER já dispõe de um sistema desse nos comentários. É necessário apenas mudar as configurações dos comentários (Configurações > Comentários > Mostrar imagens de perfil nos comentários > Sim).

Eu recebi um memê do Marcos Lemos (que aliás é meu amigão!!!) do Ferramentas Blog , que de todos os que já vi é um dos mais legais. É super simples, eu preciso dizer 5 coisas que eu acho importante, e que as pessoas não deveriam esquecer. Depois, como de costume indico alguns blogs amigos.

Eu já tinha visto isso em alguns dos blogs que acompanho, então decidi entrar na roda. Os links que eu indico para o fim de semana são:

Popup Box são caixas que aparecem flutuando na tela. Elas podem conter publicidade ou qualquer outro elemento de informação. O Dynamic Drive possui um script que permite que essa funcionalidade seja adicionada a sua página de um jeito muito fácil.

Download Mais uma obra da casa. Para mim, o melhor que já fiz. O template Binary era o que eu usava (quem me acompanha sabe!), e agora disponibilizo para download.

Download Atendendo a pedidos, eu fiz uma modificação no template GB II . Adicionei uma coluna (sidebar-main-newsidebar). O antigo continua disponível para download.

Eu tinha prometido antes, que eu iria ensinar a customizar todo o widget dos seguidores. A primeira parte foi " Personalizar o Widget dos Seguidores (CSS) ". Agora vamos mexer na estrutura do widget.

Eu encontrei muitos tutoriais que ensinavam a mudar a data para um calendário, mas nenhum funcionava. Até que um dia, eu achei um blog (o Trick-Blog , em inglês) que ensinava isso, e funcionava.

Não faz muito tempo que os Seguidores (Followers) está disponível no Blogger/blogspot .

A velocidade em que o seu blog carrega é crucial para atrair mais leitores. Se o seu blog demora muito a carregar, muitos leitores podem deixar o blog antes que tenham a chance de conhecê-lo.

Para quem não sabe, TUb é a sigla de Tutoriais de Utilização do Blogger. Uma série de tutoriais que falam sobre os recursos do blogger. Ele foi criado pelo Marcos Lemos do Ferramentas Blog

  Eu sei que é simples, mas eu procurei muito por isso! Esse é o jeito de queimar os feeds dos marcadores (de acordo com o Blogger): Este é o formato para feeds de marcador: http://nomedoblog.blogspot.com/feeds/posts/default/-/nomedomarcador Certifique-se de substituir o endereço de blog correto em nomedoblog e o marcador no qual está interessado em nomedomarcador . Além disso, não se esqueça do hífen ("-") no URL. Não é erro de digitação! Observe que um URL semelhante a esse só funcionará se o blog em questão estiver usando esse marcador específico e também tiver site feeds ativados. No entanto, não são necessárias configurações especiais de site feed. Se o site feed básico para postagens estiver ativado (com descrições curtas ou completas), os feeds de marcador também funcionarão. E é isso!!! *Os créditos da imagem são de Noreset

Esse é o melhor que eu conheço! O Widgetbox ™ ajuda as pessoas a se expressar, conectar, criar e informar através dos widgets que podem ser facilmente compartilhados e distribuídos em qualquer lugar na web. A comunidade conta com dezenas de milhares de widgets e decisores para dezenas de milhões usuários, e está crescendo a cada dia.   E o melhor de tudo, Widgetbox é grátis!   >Ir ao Site

O Wowzio é um site que possui uns widgets muito legais. Ele gera os widgets, com base nos seus feeds. Veja umas fotos: Estes são apenas alguns exemplos dos widgets. O primeiro (feed content) mostra a lista dos posts, com titulo e uma breve descrição. O segundo (live trafic) mostra de onde vem os visitantes, e o que estão lendo*. Como eu disse, estes são apenas exemplos, para ver mais widgets clique AQUI . Em breve, mais sites que fornecem widgets. Mas, por enquanto é só! *Os países exibidos no widget são apenas exemplos (que pena ). = -/

Eu recebi (via Feed por email) um artigo do PlayGame que mostrava as teclas de atalho do windows (não todas). Eu gostei muito do artigo, principalmente porque eu uso um laptop. Algumas eu já conhecia, outras eu não sabia nem que existiam. São muitos atalhos, eu não conseguiria decorar todos. Mas os que eu preciso eu lembro. Atenção : dependendo do sistema operacional (ou até mesmo com os tipos de teclado) algumas dessas teclas podem não funcionar. Aqui vai a lista: Área de Trabalho CTRL+A - Selecionar tudo CTRL+ESC - Exibir o menu Iniciar CTRL ao arrastar um item - Copiar um item selecionado CTRL+SHIFT ao arrastar um item - Criar um atalho para um item selecionado CTRL + ALT + F1 - Ver informações do sistema ALT+ENTER - Exibir as propriedades do item selecionado ALT+F4 - Fechar o item ativo ou sair do programa ativo ALT+TAB - Alternar entre janelas abertas ALT+ESC - Percorrer itens na ordem em que foram abertos F2 - Renomear um item selecionado F3 - Procu

Esse widget eu encontrei no Web Dois Ponto Zero e achei muito interessante (sempre quis ter um desses). O Guia de Navegação é um widget que ajuda a mantermos sempre a visão da situação da página onde nos encontramos e rapidamente (através de um clique) voltarmos um nível (ou mais) acima. Esse widget aparece em muitos sites. E também está disponível para o blogger/blogspot.    1. Vá em Layout > Editar HTML , faça um backup do seu template clicando em baixar modelo completo . 2. Marque a caixa Expandir Modelos de Widgets e procure (CTRL + F) por <b:includable id='main' var='top'> e imediatamente antes dele, cole esse código: <b:includable id='breadcrumbs' var='post'> <!-- Inicio do Widget --> <b:if cond='data:blog.pageType == "item"'> <p class='breadcrumbs'> <span class='post-labels'> <b:if cond='data:post.labels'> Você está aqui: <a expr:href='data:b

Na semana passada eu fiquei surpreso quando li um comentário do Marcos Lemos do Feramentas Blog . Nele estava escrito que eu havia sido indicado para um selo de qualidade. Eu fiquei muito contente, é o primeiro selo que eu recebi! Cada blog indicadado deve indicar outros blogs também. Bom, eu indico 10 blogs, e os meus indicados são: Ferramentas Blog Dicas para blogs Ferramentas para blog Tô na cola Tirinhas Tuntes Seu Estranho Bobagento A Vaca Foi Pro Brejo Malukões! Erro 404 Vale a pena dar uma olhada nesses blogs. Valeu!!! P.S.: Obrigado Marcos Lemos

Download Esse é o novo template GB Blue Squared. Pronto para consumo,vem com alguns hacks instalados. Hack para Posts Resumidos ( Tutorial ) Ícones Para Redes Sociais Posts Relacionados Rodapé do Artigo Personalizado Formulário de Comentários Embutido ( Tutorial ) Efeito Glossy ( Tutorial ) Duas Colunas no Rodapé Tres colunas principais Antes de fazer o upload do novo template, faça um backup do seu tema antigo. Vá em Layout > Editar HTML > Expandir Modelos de Widget. Para que o tema funcione corretamente, sem erros, vá em Layout > Editar HTML > Clique em expandir modelos de widget, e procure (CTRL + F) por http://feeds.feedburner.com/seublog/ e substitua pelo endereço do seu feed. NÃO REMOVAM OS CRÉDITOS!!! Por enquanto, é só. Valeu!!!

Download O template GB II tem um visual estilo Glossy mas é bem simples, com duas colunas (POST e SIDEBAR). Informações: Colunas: 2 (post e sidebar) + 2 Colunas no footer; Ícones para redes sociais; Formulário de Comentários Embutido; Hack de Artigos Relacionados; Hack de Efeito Glossy; Hack para resumir postagens; Destaque na primeira letra de cada artigo; Comentários do Autor Em Destaque; Configurando o Template: Vá na sessão Editar HTML do seu blog e marque a opção Expandir Modelos de Widgets. Depois procure por <div class='feedse' id='feedse'> (CTRL + F) e embaixo dela, altere a parte que está em vermelho como mostrado abaixo pelo endereço do seu blog: ' http://seublog.blogspot.com/ feeds/posts/default' Salve. Agora, procure por http://feeds.feedburner.com/SEUBLOG/, e onde está escrito SEUBLOG, altere pelo nome do seu feed no feedburner. Salve as modificações. Para colocar uma imagem no cabeçalho, você pode pode fa

Este script eu encontrei no site NETZGESTA, ele permite que você adicione cantos e sombreamento para imagens em suas páginas. Ele funciona em todos os principais navegadores (Mozilla Firefox, Internet Explorer, Safari e Opera). Demonstração: Imagem sem o Script: * Imagem com o script: * Vamos começar a instalar. Faça o download do arquivo Glossy.zip clicando AQUI . Faça o upload dos arquivos Glossy.js e do arquivo cvi_glossy_lib.js no seu servidor de preferência. Eu recomendo o SkyDrive (Qualquer dúvida sobre como usar os scripts hospedados no SkyDrive, veja ESSE TUTORIAL do Dicas Blogger ). Depois, vá em Layout > Editar HTML , procure por </head> e cole esse código antes dela (Substituia os endereços em negrito pelo endereço dos arquivos que você hospedou a pouco): <script type="text/javascript" src=" http://SEUSERVIDOR.com/glossy.js "></script> <script type="text/javascript" src=" http://SEUSERVIDOR.com/

Download Drop Shadow é um template para wordpress convertido para o blogger. Informações: Duas colunas com barra lateral direita Com a aparência elegante design moderno caixa de pesquisa guia de navegação Google Adsense pronto (468 × 60 banner de 250 × 250 sidebar) Para configurar o menu, procure pelo código abaixo no HTML do template e altere os links. <li><a expr:href='data:blog.homepageUrl'>Home</a></li> <li><a href='http://blogger.com'>Blogger</a></li> <li><a href='http://themelib.com'>ThemeLib</a></li> <li><a expr:href='data:blog.homepageUrl + "feeds/posts/default"'>RSS</a></li> Este template é bem integrado com o Adsense 468 × 60. Para alterar, pesquise por <div class='ads'>, você verá o código do Adsense, substitua-o pelo seu código. Se você não tem anúncios para usar, pode apenas apagar o código, ou colocar al

Tem uma super idéia que possa mudar o mundo? Mande para o Google. O pessoal lá está convocando essas ideias e as idéias mais votadas vão ser concretizadas. O Google vai investir US$ 10 milhões para implementar esses projetos. As incrições vão até o dia 20 de Outubro. Clique AQUI para mais informações. Vejam o video Créditos da Imagem: Google - http://www.google.com.br/

Quer mostrar aos seus leitores, quais foram os últimos comentarios ou comentaristas? Preencha os campos do formulário abaixo, e depois clique em gerar. Pegue o código e cole em um novo elemento de HTML/JAVASCRIPT do seu blog. Não consegue ver o instalador? Clique AQUI

Viu o menu que está embaixo do cabeçalho? Nesse tutorial você irá aprender a fazer um igual a ele. Para começar, vá em Layout > Editar HTML, e faça um backup do seu template clicando em baixar modelo completo. Depois procure pelo código ]]></b:skin> , e cole o código a seguir antes dela: /* Menu Horizontal Com Drop Down by Jean Nunes */ div#container { width: 752 px; position:relative; left:50%; margin:0 -380px; background: #ffffff ; height:30px; } h1 { width: 752 px; margin:1px; color: #4C1B1B ; font:helvetica; font-size:24pt; overflow:hidden; padding:80px 0 0; vertical-align:middle; text-align:right; } p { margin:0; padding:1.2em; } p a:link, p a:visited, p a:hover, p a:active { font-weight:bold; color: #94CE4E ; } ul#navigation-1 { margin:0; padding:1px 0; list-style:none; width:100%; height:21px; border-top:1px solid #94CE4E ; border-bottom:1px solid #94CE4E ; font:normal 8pt verdana, arial, helvetica;} ul#navigation-1 li { margin:0; padding:0; display

Esse tutorial eu encontrei no TEMPLATES PARA NOVO BLOGGER e resolvi reescrevê-lo. Bom, para começar vá em Layout > Editar HTML, e clique em Baixar Modelo Completo. Depois, procure por essa parte no template: /* Outer-Wrapper ----------------------------------------------- */ #outer-wrapper { width: 900px; margin:0 auto; padding:0px; text-align:left; font: $bodyfont; background-color: #bgcolor; } #main-wrapper { margin-left: 3px; width: 468px; float: left; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ } #sidebar-wrapper { margin-right: 0px; width: 210px; float: right; word-wrap: break-word; /* fix for long text breaking sidebar float in IE */ overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ } Atenção! Outer-Wrapper > Todo o template; Main-wrapper > coluna do post; Sidebar-wrapper > é a coluna lateral. Adic

O efeito de texto riscado é muito fácil de fazer e não altera significativamente o desempenho do seu site.

No site NEXODYNE.com você encontra diversos serviços gratuitos para seu site/blog. Foruns, geradores e etc. O gerador de selos para email é um dos serviços da Nexodyne. É bem fácil para adquirir. Ele oferece selos para 25 servidores, entre eles o Yahoo!, MSN, GMail, Hotmail e Live. Para pegar o seu, siga ESTE LINK .

É isso mesmo. A mesma funcionalidade do wordpress, aqui no blogger. Baixe esse arquivo: ADDSMYLE.js Hospede em um local de sua preferência (eu recomendo Google Pages ou SkyDrive). Copie o código abaixo e substitua onde está escrito 'ENDEREÇO/smyle.js' pelo endereço do seu arquivo: <script src='ENDEREÇO/Smiley.js' type='text/javascript'/> Vá em Layout > Editar HTML e procure por </body> e cole o código antes da tag ( /body ) * Para ver o tutorial explicando como usar scripts hospedados no Sky Drive, veja ESSE TUTORIAL do Dicas Blogger . **Créditos da imagem não encontrados. Se alguém souber, me contate por favor! Este hack pode ser feito também através do blog do autor do script (addsmile.js). Clique AQUI , e conheça o Singpolyma . Códigos dos Smiles: :­­) ou :-­) :­­D ou :-­D :­­$ ou :-­$ :­­( ou :-­( :­­p ou :-­p ;­­) ou ;-­) :­­k ou :-­k :­­@ ou :-­@ :­­# ou :-­# :­­x ou :-­x :­­o ou :-­o Update dia 10/

Para adicionar o widget de busca, faça o seguinte: Vá em Layout, Elementos de Página e clique em Adicionar Gadget. Escolha a opção HTML/JavaScript. Copie o seguinte código: <form id="searchthis" action="/search" style="display:inline;" method="get"><input id="search-box" name="q" type="text"/><input id="search-btn" value="Buscar" type="submit"/></form> E cola na caixa Conteúdo. Salve e pronto.

A navbar do blogger tem seus encantos, mas quebra qualquer template. Para ocultá-la, procure pela tag ]]></b:skin]> Cole antes dela o seguinte código: #navbar-iframe { height: 0px; visibility: hidden; display: none; }

Esse hack e muito legal. As imagens podem ser visualizadas sem sair da página. Para ver um exemplo, clique na imagem abaixo: Vamos a primeira parte: 1. Clique AQUI , para baixar os arquivos necessários para esse hack e hospede em um local desejado (anote o endereço dos arquivos). 2. Vá em Editar HTML, marque a opção Expandir Modelos de Widgets e procure pela tag: ]]></b:skin> 3.Depois, cole embaixo dela o seguinte código substituindo as URLs pelos links que você anotou a pouco: <script src="http://URL_DO_ARQUIVO/prototype.js" type="text/javascript"></script> <script src="http://URL_DO_ARQUIVO/effects.js" type="text/javascript"></script> <script src="http://URL_DO_ARQUIVO/scriptaculous.js" type="text/javascript"></script> <script src="http://URL_DO_ARQUIVO/lightbox.js" type="text/javascript"></script> <link rel="stylesheet" h