Postagens

Mostrando postagens com o rótulo tutoriais

Como juntar vários arquivos PDF num só

Imagem
Quando você recebe uma série de arquivos no formato PDF, que correspondem a apenas um documento físico, é interessante juntá-los num só arquivo PDF para facilitar seu armazenamento e conservação.

URLs personalizadas para páginas no Blogger

Imagem
Há algum tempo descobri como personalizar as URLs dos posts no Blogger, para usar nas páginas estáticas, mas na época ainda não estava utilizando nosso domínio (http://compulsivo.com.br/) aqui no UsuárioCompulsivo, o que me impedia de implementar este recurso de forma completa. Se você não sabe do que estou falando, acesse uma de nossas páginas estáticas: Autores ou Contato , por exemplo, e verifique que a URL que aparece na barra de endereços do seu navegador, é personalizada e curta. Algo inédito em blogs hospedados no Blogspot no mundo inteiro! Pelo menos eu nunca vi nada parecido.

Posts relacionados com miniaturas no Blogger

Imagem
Conteúdo relacionado é sempre bem vindo. É interessante para o leitor, que pode aprofundar sua leitura com facilidade e principalmente para o blogueiro. Pois mantém o leitor por mais tempo no seu site, promovendo um aumento no número das visualizações de páginas.

Otimização e compressão do CSS no Blogger

Imagem
Uma das principais etapas na construção de um template é a otimização do seu código fonte . Apesar de não trazer nenhum benefício estético aparente, a otimização trará resultados no tempo de carregamento da página, o que melhora muito a experiência do seu leitor. A otimização do código fonte do seu template também ajuda a melhorar a indexação do seu blog junto aos mecanismos de busca. A lógica é simples: quanto menos lixo no seu código, mais fácil para os robôs do Google (e outros indexadores) trabalharem.

Todos os posts de cada autor no Blogger

Imagem
Se o seu blog tem mais de um autor, aposto que você já pensou neste recurso: Como separar os posts de cada autor no Blogger ? Blogs coletivos que usam o Blogspot tem este problema, pois não existe uma forma nativa de organizar os posts dependendo do seu autor .

O Que é Tumblr? Guia Básico Para Iniciantes

Imagem
O que é Tumblr ? O Tumblr é um sistema de rede social e micro-weblog que permite aos seus usuários compartilhar links, textos, vídeos, e audio. Como no Twitter , você pode seguir outras pessoas e ver no seu painel de controle ( Dashboard ) os últimos posts destas pessoas que você segue. Uma das coisas interessantes é que, assim como no Twitter existe a possibilidade de " Retweet ", ou seja, repostar o twit postado por outra pessoa, você pode " reblogar " os posts de outros usuários, ou apenas favoritá-los, e todos podem fazer o mesmo com o seu conteúdo, tudo de maneira muito simples e rápida. Você pode customizá-lo com temas pré-existentes no próprio sistema ou copiar códigos html já prontos criados por outros usuários e disponíveis em diversos sites pela internet ou, ainda, criar seu próprio layout. Além disso, o site permite integração com outras plataformas, como o site de bookmarks Del.icio.us , o Digg , ou sites como Wordpress, Blogger, Livejournal, Fac...

Elementos (anúncios) por autor no Blogger*

Seu blog tem mais de um autor e você gostaria de poder exibir elementos específicos (como anúncios, widgets ou rodapés individuais e personalizados) dependendo de quem publicou determinado post? Então seus problemas acabaram! No tutorial a seguir você vai aprender como configurar elementos de página por autor no Blogger / Blogspot. Assim cada um poderá veicular sua própria publicidade, seus links para redes sociais ou o que mais der na telha. É necessário um nível de conhecimento razoável nas características específicas do código do Blogger para aplicar este tutorial. Se você não entender nada, não arrisque. Nunca é demais lembrar que antes de qualquer modificação no código do seu blog é importante fazer um backup do template , para prevenir qualquer problema durante as alterações e conseqüentes reclamações a minha pessoa ou minha progenitora. Configurando widgets por autor no Blogger Para configurar qualquer tipo de elemento de página, conforme o autor do post, vamos usar um...

Hospedar JavaScript no Blogger / Blogspot

Melhor que isso, só a hospedagem no 7 estrelas Burj Al Arab... OBS : Se você está procurando hospedagem grátis para arquivos externos, dê uma olhada neste post: Armazene, Sincronize e Compartilhe na Faixa Uma problema antigo que atormenta alguns usuários avançados do Blogspot é quanto a hospedagem externa de arquivos JavaScript . Como o Blogger não disponibiliza um abrigo para estes arquivos, muita gente acaba recorrendo a serviços gratuitos de terceiros para hospedar externamente estes códigos. Mas a hospedagem externa de arquivos JavaScript pode gerar alguns problemas para os usuários do Blogger. Caso o serviço onde seu arquivo JavaScript está hospedado apresentar alguma instabilidade, isto com certeza comprometerá o desempenho do seu site. Além disso, estes serviços externos podem ser descontinuados, como aconteceu com o Google Pages , ou sofrer alterações no seu funcionamento que acarretem perdas de funcionalidades e exijam revisões de código, como está acontecendo agora com Sk...

Personalizar caixa de comentários do Blogger

Imagem
Deixe a área dos comentários no seu blog, com a sua cara! (imagem: Adrien ) Que tal deixar a sua caixa de comentários incorporada as páginas de postagem do Blogger / Blogspot melhor integrada ao seu template? Neste tutorial você vai aprender como colocar bordas na mensagem que aparece antes do formulário de comentários. Como deixar a área do formulário de comentários mais larga , igual a largura da coluna das postagens, e como otimizar o cabeçalho da área de comentários . Desde que a equipe de desenvolvimento liberou o recurso de comentários incorporados as páginas de postagens do Blogger, que estava com este tutorial na manga. Até que uma mensagem do AndersonZ1 no Grupo de Discussão Blogspot Brasil , me despertou o interesse em publicá-lo. Quando estiver pronta a sua caixa de comentários ficará assim: Imagem 1 : Caixa de comentários personalizada no Blogger. Antes de começar, você já deve ter habilitado o formulário de comentários embutido nas páginas internas do seu blo...

Posts resumidos na página inicial do Blogger

Já postei um tutorial mostrando como resumir todas as postagens da página inicial nos blogs hospedados no Blogspot , sem inclusão de códigos adicionais nos posts. Porém esta abordagem não é a mais apropriada quando intenção é resumir apenas alguns posts e não todos eles. No tutorial a seguir vou mostrar como configurar seu template para resumir seletivamente apenas algumas postagens no seu blog no Blogger , através de um pequeno delimitador que deve ser incluído diretamente no código dessas postagens. Antes de começar, faça um backup do seu template . Marque a opção Expandir modelos de widgets e cole o script abaixo antes da tag </HEAD> : <b:if cond='data:blog.pageType != "item"'> <script type="text/javascript"> function checkFull(id) { var post = document.getElementById(id); var spans = post.getElementsByTagName('span'); var found = 0; for (var i = 0; i &lt; spans.length; i++) { if (spans[i].id == "fullpost...

Corrigindo a exibição do Favicon no Blogspot

Olá amiguinhos, depois de muito pastar tentando solucionar o problema da exibição do Favicon para os blogs hospedados no Blogspot, eis que a solução surge, por intermédio do Amílcar do Grupo Blogspot Brasil , no Blogger Tips and Tricks . Se você já usa o código anterior para exibir o Favicon no seu site, basta mudar sua posição dentro do template, para logo depois da linha abaixo: ]]></b:skin> Se você ainda não utiliza, hospede duas imagens com tamanho de 16x16 pixels, uma no formato PNG e outra convertida para o formato ICO , no local de sua preferência e anote as URLs dos arquivos hospedados. Localize a linha ]]></b:skin> dentro do código html do seu template e logo após cole o seguinte trecho, adaptando o endereço dos arquivos que você acabou de hospedar: ]]></b:skin> <link href=' URL_DA_IMAGEM_FORMATO_ICO.ico ' rel='shortcut icon'/> <link href=' URL_DA_IMAGEM_FORMATO_PNG.png ' rel='shortcut icon'/> Vi...

Imagem aleatória no cabeçalho do Blogspot

Quando publiquei o tutorial Como exibir uma descrição aleatória abaixo do título no Blogspot , prometi mostrar também como fazer o mesmo com imagens. Ou seja, como exibir uma imagem diferente no topo (ou cabeçalho) do Blogspot, a cada carregamento da página. Para felicidade geral da nação, digo ao povo que exibir uma imagem aleatória no cabeçalho do Blogger é tão fácil quanto exibir uma descrição aleatória. Antes de começar, a primeira coisa que você precisa fazer é checar no painel de controle do Blogger, dentro das opções de Elementos da página, se o seu template permite a inclusão de novos elementos no cabeçalho . Feito isso, vamos ao que interessa: Como exibir uma imagem aleatória no cabeçalho do Blogger Prepare as imagens que pretende usar, elas devem ter exatamente o mesmo tamanho entre sí e a mesma largura total do seu template. Hospede-as e anote a URL de cada uma delas. Nas opções de Elementos da página remova o cabeçalho original do seu template. Em seu lugar inclu...

Imagens grandes no editor do Blogger

Se você usa o editor do Blogger para redigir e publicar suas postagens, já deve ter reparado que há uma limitação no tamanho das imagens dentro dos posts, de apenas 400 pixels de largura para imagens em formato paisagem (horizontal), ou 400 pixels de altura no formato retrato (vertical). Creio que esta limitação tem como base o layout padrão dos templates oferecidos pela plataforma, onde a coluna dos posts não tem mais que 470 pixels de largura, portanto imagens de até 400 pixels "encaixariam" perfeitamente. Mas como muita gente utiliza templates personalizados, com a coluna dos posts mais larga que 470 pixels, esta limitação acaba atrapalhando bastante quando é necessário postar imagens maiores do que este padrão de publicação permite. Para contornar esta limitação e exibir as imagens publicadas através do editor do Blogger no seu tamanho original é necessário editar o código HTML dos artigos, alterando os parametros incluídos automaticamente nas imagens. Ao incluir ...

Permissões para comentaristas no Blogspot

Imagem
No Blogspot, as opções de autenticação para os comentaristas são definidas nas configurações de comentários no painel de controle. Dependendo da opção escolhida estarão disponíveis diferentes opções para os comentaristas se autenticarem antes de comentar: Qualquer um - inclui usuários anônimos - Libera todas as opções de autenticação disponíveis, inclusive comentários anônimos e a opção Nome/URL. Use apenas se você habilitou a moderação de comentários. Usuários registrados - inclui OpenID - Esta opção desabilita os comentários anônimos e a opção Nome/URL, permitindo apenas comentaristas autenticados, através do OpenID, o que inclui usuários do LiveJournal, WordPress, TypePad e AIM ou através de uma conta do Google,  o que inclui usuários do Blogger. Usuários com Contas do Google - Permite apenas comentaristas autenticados com uma Conta do Google, não necessariamente usuários do Blogspot, basta ser usuário do Gmail, por exemplo. Somente membros deste blog - A melhor for...

Descrição aleatória abaixo do título no Blogspot

Imagem
Muita gente tem me perguntado como exibir uma descrição aleatória abaixo do título no cabeçalho dos blogs hospedados no Blogspot, cada vez que uma nova página é carregada. Por incrível que pareça, este recurso é muito fácil de implementar e talvez você nem precise mexer no código html do seu template, para configurar os biscoitos da sorte no seu blog. Antes de começar, você precisa verificar se é possível incluir novos elementos no cabeçalho, através do painel de controle do Blogger nos Elementos de página, conforme a imagem abaixo: Verifique se existe a opção Adicionar um Gadget no seu cabeçalho Se ainda não houver a opção Adicionar um Gadget no cabeçalho do seu template, aplique o tutorial compulsivo Como adicionar imagens no topo do Blogger , antes de prosseguir. Descrição aleatória abaixo do título no Blogspot 1. A primeira coisa a fazer é remover qualquer descrição que você esteja usando. Isso pode ser feito, nas opções de configuração básica do painel de controle ...

Personalize seu template sem editar códigos

Imagem
Já vi muita gente reclamando que é muito difícil personalizar os templates do Blogspot, pois é necessário conhecer códigos HTML, CSS e JavaScript. Mas isso não é 100% verdadeiro. Existe um recurso gráfico para personalizar seu template no Blogspot, que permite realizar diversas alterações na aparência do seu blog, sem necessidade de editar nenhuma linha no código. Esta opção está disponível através do painel de controle do Blogger, em Layout /  Fontes e Cores : Clique para ampliar (em nova janela) Apesar do acesso ao código fonte completo permitir uma personalização muito mais completa e profunda do layout, a edição gráfica é mais confortável para a maioria dos usuários, pois é rápida e não requer nenhum conhecimento técnico. O único problema é que para utilizar este recurso, o template do seu blog precisa seguir a padronização de variáveis , utilizada nos templates originais do Blogger...

Como criar links para janelas PopUp

Se você precisa criar um link para abrir uma janela PopUp, vai encontrar diversos tutoriais por ai. Algumas técnicas usam JavaScript e alterações no código fonte do template, quando não há necessidade disso tudo. É bem simples, antes de mais nada você precisa criar e hospedar a página que pretende abrir dentro da janela PopUp. Anote a URL desta página e substitua nos dois campos destacados em vermelho no código abaixo: <a href=" URL_PAGINA_DA_POPUP " target="popupwindow" onclick='window.open(" URL_DA_PAGINA_POPUP ", "popupwindow", "scrollbars=yes,width= 550 ,height= 520 ");return true'> Link </a> Nos campos em azul são definidos a largura e a altura da janela PopUp respectivamente e em verde é o texto que vai aparecer na página. Veja como fica o resultado: Formulário de Contato Compulsivo em PopUp Imagem: Gamleys Toys

Ganhe mais dinheiro com anúncios relevantes

Quer ganhar mais dinheiro com os anúncios no seu blog? Usando o direcionamento por seção do AdSense , você pode aumentar a relevância dos anúncios exibidos na sua página em relação ao seu conteúdo. O que aumenta potencialmente a possibilidade de cliques convertidos. Mas o que é direcionamento por seção? Segundo a Ajuda do AdSense : O direcionamento por seção permite a você sugerir frações de texto e conteúdo HTML que você gostaria que fossem enfatizadas ou ignoradas quando fazemos a correspondência entre anúncios e o conteúdo do seu site. Ou seja, com o direcionamento por seção, você pode dizer ao robozinho do AdSense para ignorar o conteúdo fixo do seu blog, como a coluna lateral, por exemplo e enfatizar o conteúdo dos posts, quando for contextualizar os anúncios. Mas como eu configuro isso no meu site? Para implementar o direcionamento por seção, você precisa adicionar ao seu código uma série de tags especiais de comentário HTML. Essas tags marcarão o início e o fim das seções ...

Como personalizar o navegador do Blogger

Sabe aqueles links que aparecem no rodapé da coluna dos posts nos blogs hospedados no Blogspot, que permitem avançar e retornar as páginas de postagem? Esse elemento de página chama-se navegador ou 'blog-pager'. Por padrão são exibidos apenas os links: "Postagens mais antigas", "Início" e "Postagens mais recentes", centralizados e sem muito charme, assim: Postagens mais antigas      Início      Postagens mais recentes Já mostrei como personalizar o navegador do Blogger usando ícones intuitivos e mais recentemente também informei sobre o novo recurso de navegação em páginas numeradas , tão aguardado pelos usuários do serviço oferecido gratuitamente pela (empresa) Google. Eu particularmente acredito que o recurso de navegação numerada não é o ideal para um site no formato blog. Pois o navegador não é exibido quando o usuário acessa uma página individual, apenas na home page. Pensando nisso resolvi personalizar o blog-pager do Blogspot, segu...

Títulos expansíveis nos arquivos e categorias

Imagem
Outro dia me perguntaram como exibir apenas os títulos dos posts nas páginas de arquivo ou categorias (marcadores) no Blogspot. Mas ao invés de explicar só isso, preferi apresentar a vocês como configurar títulos expansíveis nessas páginas. Funciona assim: Quando o usuário clica em algum marcador ou seleciona um mês no arquivo do blog, é conduzido a uma lista que exibe apenas a data e o título clicável dos artigos precedidos pelos símbolos [+/-] . Que funcionam como o sinal de adição no navegador de arquivos do Windows (Explorer). Ao ser clicado o conteúdo do artigo é exibido, se acionado novamente o artigo é escondido. Para configurar no seu blog, primeiramente entre no modo de edição HTML e faça um backup do seu template, ou faça antes no seu blog de testes. Em seguida marque a opção Expandir modelos de widgets e cole o código a seguir imediatamente acima da tag </head> : &lt;script type='text/javascript'&gt; function toggleIt(id) { post = document.getElemen...