⚠ Desculpe pela bagunça aqui, eu estou atualizando meu tema então algumas coisas ficarão fora do lugar por um tempo, mas logo logo voltarão ao normal.

⚠ Sorry for the mess in here, I'm currently updating my theme so some things will be out of place for a while, but soon it will be back to normal.

domingo, 13 de outubro de 2019

Como remover blockquote de posts reblogados no Tumblr

Como remover blockquote de posts reblogados no Tumblr

(Última atualização em 13/10/2019)

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.

Mapa do tutorial:

  1. Por que isso acontece?
  2. Como evitar?
  3. Como resolver?
⚠ 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).

Por que isso acontece?

Existem 2 possíveis causas para isso. E, se você usa algum dos meus temas mais atuais, o motivo provavelmente é a causa #02. Mas ainda assim vale a pena ler a causa #01, pois ela vai te "preparar" para entender melhor por que a causa #02 faz isso acontecer.

Se você quiser pular direto para a parte onde eu ensino como remover os blockquotes, clique aqui.

Causa #01: Sistema de comentários do Tumblr

Quando você rebloga um post no Tumblr, você pode adicionar um comentário a ele (com exceção apenas de posts de Citação e Diálogo). Mas, diferente de outras redes sociais, no Tumblr esses comentários ficam embutidos no próprio post, de forma que ao reblogar um post você rebloga também os comentários que foram adicionados a ele por outros usuários (se houver algum e se você não removê-los, é claro).

Ou seja, já que ao reblogar um post você pode adicionar um comentário abaixo do conteúdo original dele, o Tumblr cria automaticamente uma divisão para cada comentário e para o conteúdo original, para eles não ficarem misturados.

Porém, mesmo que você não adicione nenhum comentário, o Tumblr ainda assim irá colocar o conteúdo original do post reblogado em uma divisória, como você pode ver na imagem abaixo (mas não quero me adentrar nos possíveis motivos disso acontecer, para não mudar de assunto e não causar confusão na cabeça de ninguém aqui 😅).

E para fazer essas divisões o Tumblr utiliza "blocos de citação" (ou "blockquotes", em inglês), que é basicamente — estou simplificando aqui — uma tag HTML que serve para destacar uma parte de um texto, envolvendo-o em uma "caixinha particular", mais ou menos assim:

Isso aqui é um texto dentro de um blockquote.

A aparência dos blockquotes varia dependendo do tema que você está usando. Na maioria dos temas, os blockquotes estão estilizados com uma barra do seu lado esquerdo (como mostrado na imagem abaixo), mas independente de sua estilização, eles geralmente deixam os posts, e especialmente os de imagem, com uma aparência não muito agradável para a maioria das pessoas.

A um tempo atrás, o Painel (dashboard) do Tumblr mudou e agora esses "blockquotes" são mostrados de forma mais organizada.

Porém em alguns temas antigos/desatualizados os comentários ainda são mostrados da forma desorganizada e meio confusa de antigamente, e isso é para todos os posts e não apenas posts antigos.

Mas isso não é tudo. Você pode estar usando o tema mais atualizado do momento e ainda experienciar essa característica antiga do Tumblr. Por quê?

Causa #2: Tumblr App

Bom, no Tumblr existe basicamente 10 formatos diferentes de post: Texto, Foto, Citação, Link, Diálogo, Vídeo, Áudio e ainda os Photosets (ou "álbum de fotos", ou ainda "set de imagens" — que é quando você faz o upload de várias imagens através de um post de Foto), os posts de Ask (que é quando você responde uma ask publicamente) e posts de Colaboração (quando você publica um post que outro usuário enviou para o seu blog como uma Colaboração via Submit). Cada formato possui um "template" próprio para que você possa escolher qual deles será melhor para apresentar o conteúdo do seu post.

Cada formato possui uma configuração diferente e, portanto, cada um tem seu código específico no HTML dos temas.

Só que no Tumblr App não é a mesma coisa. Atualmente, no aplicativo móvel do Tumblr, você até tem a opção de escolher se quer postar um Texto, uma Foto, uma Citação, etc., porém todos esses tipos de post possuem a mesma formatação (eles são exatamente a mesma coisa). Todos recebem o formato de um post de Texto. Então quando você posta, por exemplo, uma foto pelo App do Tumblr, você basicamente fez um post de Texto com uma imagem dentro. E por isso, na Dashboard do Tumblr Web e no seu tema, esse post não receberá a formatação de um post de Foto, afinal ele não é um post no formato Foto e sim no formato Texto.

E os posts de Texto, ao serem reblogados, ficam com seu conteúdo dentro de um blockquote (mesmo que você não adicione nenhum comentário, como eu expliquei na causa #01). O que não acontece no formato de Foto, porque esse formato já é configurado para não permitir que isso aconteça, justamente para evitar que os post de foto fiquem "feios".

Ah, e inclusive, toda vez que você rebloga um post através do aplicativo do Tumblr, mesmo que esse post tenha sido criado no Tumblr da Web, o App irá convertê-lo para o formato do App (se você também acha isso muito irritante, toca aqui! 🙋).

Como evitar?

Dadas as explicações, conclui-se que as únicas formas de evitar que isso aconteça seriam:

  1. Usar um tema que "disfarce" esse problema (eu não conheço nenhum até o momento — além do tema padrão do Tumblr — já que a documentação de temas do Tumblr ainda não foi atualizada com essas novas mudanças para que nós, desenvolvedores de temas, possamos ter os recursos necessários para tornar nossos temas mais compatíveis com os posts do Tumblr App);
  2. Parar de postar/reblogar coisas no Tumblr pelo seu celular/tablet;
  3. Ou abrir seu Tumblr pela Web de tempo em tempo e editar todos os seus posts que foram postados ou reblogados através do App, da forma como eu vou ensinar a seguir.

Como resolver?

1. Vá até o post que deseja editar no seu blog, abra a página de link permanente dele e clique no ícone do lápis (que fica no canto superior direito da tela) para abrir a página de edição do post.

2. Copie o conteúdo do post. Se for uma imagem, copie a URL dessa imagem: clique com o botão direito do seu mouse sobre a imagem e escolha a opção "copiar endereço da imagem" (ou "copiar URL da imagem").

3. Agora, no campo de texto do post, na parte em que você pode adicionar um comentário, cole o conteúdo que você copiou (clique no campo de texto com o botão direito do mouse e escolha a opção "Colar"). Se for uma imagem, cole a URL da imagem o Tumblr irá automaticamente carregar a imagem ali pra você.

4. Se o post for apenas texto, você pode pular para o passo 5. Mas se o post for de imagem e possuir uma descrição/texto, não esqueça de incluir a descrição junto. Para que ele fique igual aos posts de Foto clássicos do Tumblr, coloque a URL do autor do post (você pode marcar o autor do post utilizando um arroba [@] seguido da URL desse usuário), pule uma linha e cole a descrição da imagem ali. Depois coloque descrição dentro de um blockquote para que você possa separar seu comentário (caso você coloque algum) da descrição original.

5. Após fazer isso, salve o post. Apenas para se certificar de não perder as alterações que fez.

6. Agora abra a página de edição do post novamente e remova a parte da postagem original, deixando apenas a cópia que você fez. Para isso, passe o mouse por cima da parte original e um botãozinho com um "X" irá aparecer no canto superior direito do post, clique nesse botão para remover aquela parte do post.

Agora salve e pronto! O post ficará mais ou menos assim:


  • Se o tutorial tiver sido útil, por favor, dê like ou reblogue ele lá no tumblr (aqui);
  • Se tiver alguma dúvida ou problema com o tutorial, entre em contato comigo por aqui.