Como fazer cursor personalizado para Tumblr

Uma das principais coisas que fazem do Tumblr uma rede social única é a liberdade que temos para personalizar nossos blogs da forma como quisermos por conta do total acesso que a plataforma nos dá ao HTML dos nossos blogs. Com isso é possível expressar nossa personalidade até mesmo nos mínimos detalhes das nossas páginas.

Hoje eu vou mostrar como você pode personalizar o cursor do seu tema no Tumblr, para variar um pouco do padrão clássico branco com preto e usar algo que combine melhor com o tema que estiver usando.

O tutorial é focado em mostrar como usar cursores personalizados no Tumblr, mas o método que eu estarei mostrando aqui funciona para qualquer código HTML, independente de ser um tema para Tumblr ou não.

• Se o tutorial for útil pra você, não esqueça de deixar um like e/ou reblogá-lo lá no meu blog do Tumblr, para me dar uma forcinha. 💕

Como abrir arquivos PSD sem Photoshop

(I have an English version for this tutorial here)

Alguns dos materiais que eu disponibilizo aqui são em formato PSD (arquivo editável do Adobe Photoshop), como meus filtros de cor para fotos, por exemplo. Porém como o Adobe Photoshop é um software pago, nem todos o possuem para que possam utilizar meus materiais.

Se esse é o seu caso, fique sabendo que isso não significa que você ficou de fora, que você não tem como usar esses materiais, pois neste tutorial eu vou mostrar como qualquer pessoa pode abrir e editar um arquivo PSD de forma totalmente gratuita.

• Se o tutorial for útil pra você, não esqueça de deixar um like e/ou reblogá-lo lá no meu blog do Tumblr, para me dar uma forcinha. 💕

Como instalar meus temas para Tumblr

Se você nunca usou um tema personalizado antes e não sabe como instalar um em seu blog, nesse tutorial eu venho explicar como pegar meus temas e instalá-los do jeito certo.

Passo a passo:

1) Vá até a minha Página de Materiais, escolha um tema e clique no botão "Download/Instalar" dele:

Elementos de um tema: o que é Sidebar, Header, Pagination e Footer

O layout de um tema pode conter os seguintes elementos: Posts, Header, Sidebar, Footer e Pagination. Isso são apenas a forma como são chamadas diferentes seções de um layout dependendo de onde elas estão posicionadas.

E é importante saber identificá-las caso você leia um tutorial que mencione alguma delas, caso você esteja customizando um tema ou caso esteja pensando em encomendar um tema (já que precisará dar detalhes sobre como você irá querer cada elemento do layout).

Bom, primeiramente, aqui vai uma representação gráfica dos elementos de um tema:

Como colocar/editar ícones nos meus temas

Nas Opções de Tema de alguns dos meus temas você encontrará opções com o nome de "Button1 Icon", "Button2 Icon", "Button3 Icon" e etc.

Essas opções são responsáveis por definir os ícones que se encontram nos botões do menu principal do tema (demonstrados na primeira imagem desse post).

Mas o que fazer quando você quiser modificar ou remover os ícones do menu? Bom, isso é o que eu vou estar mostrando nesse tutorial.

Primeiramente, a utilização desses íncones não é obrigatória, então se você não quiser incluir ícones nos botões do seu menu, basta deixar o campo de texto dessas opções vazio:

Como fazer o background do tema se ajustar à tela

Eu vejo muitos tutoriais por aí ensinando que para fazer um background (bg/imagem de fundo) que fique do tamanho da tela você precisa de uma imagem que seja exatamente do tamanho da tela... E isso não é errado, porém precisamos levar em consideração o fato de que nem todos os monitores possuem a mesma resolução. Por exemplo, o seu monitor pode ser de 1366x768, então uma imagem desse tamanho vai cobrir toda a tela do seu monitor, mas para quem usa um monitor de 1280x768 essa mesma imagem irá ficar com um pedaço “faltando”, pois ela é maior que a resolução desse monitor.

Porém existem códigos CSS que podem resolver esse problema, e é isso o que eu vim mostrar neste tutorial.

Como personalizar páginas de erro "404 Page Not Found" (Tumblr)

(Última atualização em 21/04/2019) - (English version of this tutorial here!)

Já fazia um tempo que eu vinha procurando uma forma de personalizar páginas de erro em temas para o Tumblr. Encontrei alguns tutoriais sobre o assunto, mas nenhum deles funcionava para todo tipo de blog, funcionavam apenas para blogs de um determinado idioma (já que o código selecionava a página baseando-se na frase de erro que ela mostra e essa frase muda de acordo com o idioma do blog, tornando impossível para o script encontra-la em blogs que estejam em outros idiomas).

Até que um dia, enquanto estudava JQuery (meus agradecimentos ao W3Schools), eu encontrei um método que poderia funcionar para qualquer blog no Tumblr, pois ele seleciona a página baseando-se em seu status (se é uma página de erro ou não). Eu testei e ele funcionou! 🙌 Então, para quem estiver interessado(a), aqui está o meu tutorial sobre como customizar "páginas não encontradas" no Tumblr utilizando Ajax.

Como solucionar/evitar erros em temas no Tumblr

(Última atualização em 04/03/2022) - (English version of this post here!)

Nem todo problema que surge em um tema é um defeito que já veio nele. Existem algumas coisas que você pode fazer ao instalar ou personalizar um tema que podem corromper seu código e causar erros.

Neste post eu listei os problemas mais comuns que acontecem em temas e mostrei como resolvê-los e também como prevenir outros.

Leia a tabela a seguir com os problemas listados e se algum deles soar parecido com o que você está tendo, então clique em todas as causas á sua frente. Se esse post não te ajudar, então entre em contato comigo via Ask do Tumblr e explique com bastante detalhes o que está acontecendo com o seu tema (se possível, mande prints para mostrar o que você quer dizer).

Como organizar os captions do Tumblr (sem scripts)

Clique aqui para ver o exemplo mais de perto

⚠ Searching for an English translation for this tutorial? Click here! ⚠

Neste tutorial eu estarei mostrando como organizar os captions (comentários) dos posts do Tumblr sem precisar de nenhum script.

Eu encontrei esse método na "Documentação não documentada" que a @bychloethemes fez, onde ela apresenta algumas variáveis do Tumblr que ainda não estão registradas na documentação oficial da plataforma. Lá ela fala, de forma breve, sobre esses códigos que eu estarei mostrando aqui no tutorial. Porém a documentação dela está toda em inglês, então para quem precisa de uma tradução para o português, aqui está a minha explicação.

Mas, antes de começar, já vou avisando que eu não me aprofundarei muito em explicações neste tutorial, então ele pode ficar um pouco confuso para quem não tem muita experiência com códigos. Já que a forma como os códigos estão organizados em um tema pode variar dependendo do tema, eu não tenho como prever de que jeito você encontrará os códigos no HTML do tema que você usa. Portanto esse tutorial é mais recomendado para quem já tem experiência com HTML e com as variáveis do Tumblr.