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. 💕
(Eu tenho uma versão em Português desse tutorial aqui)
Some of the resources I have avilable for download in here are in PSD files (Adobe Photoshop editable file), like my color filters for photos, for example. But because Photoshop is a paid software not everybody owns it so they could be able to use my resources.
If this is your case, just know that you don't need to be left out, you can still use these resources and in this tutorial I will show you how anybody can open and edit PSD files totally for free.
If this tutorial is relevant to you, please don't forget to give it a like and/or reblog on my Tumblr blog, to offer me a little support. 💕
(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. 💕
On the Theme Options of some of my themes you will find options with the names "Button1 Icon", "Button2 Icon", "Button3 Icon" and so on.
Thes options are responsible for defining the icons that are seen in the menu of the theme (as shown in the first image of this post).
But what to do when you want to modify or remove these icons? Well, this is what I will be teaching in this tutorial.
First of all, using these icons is optional, so if you don't want to include icons in the menu of your theme, simply leave the text field of these options empty:
If you never used a custom theme before and don't know how to install one in your blog, in this tutorial I come to explain how to get and install my Tumblr themes the correct way.
Step by step:
1) Go to my Resources Page, chose a theme and click on its "Download/Install" button:
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:
The layout of a theme can contain the following elements: Posts, Header, Sidebar, Footer and Pagination. These are how different sections of theme are called depending on where they are positioned inside the layout.
It's important to know how to identify them in case you're reading a tutorial that mentions one or more of them, in case you're customizing a theme or thinking about making a commission (since you'll need to provide details about your preferences for all the elements in the layout).
Well, first, here goes a graphic representation of each element of a theme:
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:
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:
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.
Sei que algumas pessoas não sabem o que são essas páginas que eu citei no título, porém eu falo bastante delas nos meus tutoriais então decidi fazer um post explicando o que elas são pra ninguém ficar "boiando" ao ler meus tutoriais.
Neste tutorial eu venho mostrar como colocar efeito degradê/gradiente/arco-íris em textos nos posts do Tumblr, como esses mostrados na imagem acima.
Este método é para o conteúdo de postagens, que funciona no Painel (Dashboard) do Tumblr. Se você quiser adicionar textos em gradiente no seu tema, tem um outro método melhor de fazer isso, porém eu não vou estar mostrando ele neste tutorial aqui.
Se você quer saber como colocar no seu tema aqueles botões de "voltar ao topo" que aparecem quando você rola uma página até o final, é só continuar lendo.
Este é um tutorial rápido de como colocar essa opção em um tema no Tumblr (porém os códigos desse tutorial funcionam em qualquer site) destinado à pessoas que não sabem HTML, CSS ou JavaScript. Portanto estarei mostrando apenas umas opções bem básicas e limitadas de personalização, afinal se eu mostrasse todas as opções de estilização que é possível de se conseguir com CSS3 isso aqui seria um curso e não um tutorial. E infelizmente eu não tenho tempo para escrever um curso inteiro, rs.
Se algumas das imagens que você rebloga no Tumblr aparecem com uma barrinha do lado direito no seu tema que você gostaria de poder remover, neste post você vai entender por que isso acontece, como evitar que continue acontecendo e como remover essa características dos posts.
⚠ ATENÇÃO: Só é possível fazer isso se você estiver usando o Tumblr da Web (ou seja, se você estiver usando o Tumblr no seu PC). Não é possível fazer isso pelo Tumblr App (aplicativo do Tumblr para smartphones e tablets).
(Last updated in 21/04/2019) - (Versão em Português deste tutorial aqui!)
I've been searching for a way to customize "Not found" pages on themes for Tumblr for a while. I found a few tutorials about it, but none of them would work in every blog, they would only work for blogs of a certain language (since the code would select the page basing on the error phrase that it shows, and this phrase changes according to the language of the blog, making it impossible for the script to find it in blogs that are set in other languages).
Until one day, as I was studying JQuery (thanks to W3Schools), I found a method that could work for any blog on Tumblr, since it selects the page based on its status (whether it's an error page or not). I tried it and it worked! 🙌 So, to anyone interested, here is my tutorial on how to customize "not found" pages on Tumblr using Ajax.
(Ú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.
(Last updated in 15/04/2019) - (Versão em Português deste tutorial aqui!)
If, like me, you like your blog to look organized, but at the same time like to reblog a little bit of everything and it ends up messing with the appearance of your blog, you must have already thought "how good it would be if I could hide posts that I reblogged because I liked, but that don't match the aesthetic of my theme very well"... Another similar situation would be if you'd like to hide reblogged posts and show only your original posts in the first page.
Well, that would be possible to do using two different logics based in the use of tags. Let's say that you tagged some of your posts with "#photo", you could make your theme:
Method 1) Show only the posts that contain the tag "#photo";
Method 2) Or, show all posts, except fot the ones that contain the tag "#photo".
I've tried a couple times to use the method 2, but, unfortunately, I still can't make a script that execute this function without messing up with the entire theme. So, for now, the only available option that I know is the method 1, and that's the one I'll be teaching you to use in this post.
How does it work?
You'll install a script in your theme that will make the first page of your blog redirect to a tag page of your choice (if you don't know how to use/access tags, read these articles); this way, when anybody open your blog, the first posts they will see will be the ones tagged with this specific tag.
