Dicas para Blogger 36 - Botões de compartilhamento na versão Mobile

A versão Mobile (para celulares e certos tablets) do Blogger não é perfeita, ela deixa muito a desejar em várias áreas, tanto é que nós já demos outras dicas sobre como customizar ela em nossa série de dicas para blogueiros, mas hoje nós vamos te ensinar de uma maneira fácil, direta e o mais importante, gratuita, como colocar botões de compartilhamento na versão de celular do seu blog. Mas antes disso tem algo que você tem de saber.

O Blogger normalmente já vem com botões de compartilhamento na versão para celular, só que eles são bem apagados e não incluem o WhatsApp e nem o Telegram, que são duas das ferramentas de compartilhamento mais usadas quando falamos de celulares. Os botões originais são iguais a esse aqui (mostrando também o que aparece quando você clica nele):

Então se você quiser substituir esse botão Compartilhar por uma versão mais completa e chamativa, é só seguir esse passo-a-passo:

Como colocar botões de compartilhamento na versão Mobile do seu Blogger

Primeiro você vai entrar no seu painel do Blogger e clicar em "Tema", depois você vai clicar na flecha ao lado de "Personalizar" e depois em "Editar HTML".

Depois disso você vai procurar a linha de código <b:section-contents id='sidebar-right-1'>, ou a linha de código de qualquer uma de suas sidebars (sidebar-right-2-1, sidebar-right-2-2, sidebar-right-3, etc.) e logo abaixo dessa linha você vai copiar e colar esse código aqui, de propriedade do site de compartilhamento AddToAny e que foi modificado por nós para incluir os botões do Telegram e do WhatsApp.

 <b:widget id='HTML3' locked='false' mobile='only' title='AddToAny' type='HTML'>

    <b:widget-settings>

      <b:widget-setting name='content'>&lt;!-- BEGIN AddToAny for Blogger --&gt;

&lt;script type=&quot;text/template&quot; class=&quot;blogger_addtoany_html&quot;&gt;

&lt;div class=&quot;a2a_kit a2a_kit_size_32 a2a_default_style&quot;&gt;

    &lt;a class=&quot;a2a_button_facebook&quot;&gt;&lt;/a&gt;

    &lt;a class=&quot;a2a_button_whatsapp&quot;&gt;&lt;/a&gt;

    &lt;a class=&quot;a2a_button_telegram&quot;&gt;&lt;/a&gt;

    &lt;a class=&quot;a2a_button_twitter&quot;&gt;&lt;/a&gt;

    &lt;a class=&quot;a2a_button_pinterest&quot;&gt;&lt;/a&gt;

    &lt;a class=&quot;a2a_dd&quot; href=&quot;https://www.addtoany.com/share&quot;&gt;&lt;/a&gt;

&lt;/div&gt;

&lt;/script&gt;

&lt;script async src=&quot;https://static.addtoany.com/js/blogger.js&quot;&gt;&lt;/script&gt;

&lt;!-- END AddToAny for Blogger --&gt;</b:widget-setting>

E pronto, é só isso. Se quiser trocar a ordem dos botões basta trocar a ordem deles no código, por exemplo, se quiser que o WhatsApp venha antes do Facebook substitua a linha:

&lt;a class=&quot;a2a_button_facebook&quot;&gt;&lt;/a&gt;

&lt;a class=&quot;a2a_button_whatsapp&quot;&gt;&lt;/a&gt;

Por:

&lt;a class=&quot;a2a_button_whatsapp&quot;&gt;&lt;/a&gt;

&lt;a class=&quot;a2a_button_facebook&quot;&gt;&lt;/a&gt;

Agora basta conferir se o código foi colocado no seu "Layout", ele deve estar sob o nome de "AddToAny" como um Gadget HTML/JavaScript. Mas você pode sempre mudar sua localização e deletar/mudar o seu nome se preferir.

Se tudo estiver certo basta você conferir a versão mobile do seu site e ver os seus novos botões de compartilhamento. Mas é sempre bom lembrar que dependendo do quanto você já mudou o seu código original esse passo-a-passo pode não funcionar para você.

Segundo método

Se esse passo-a-passo não funcionou para você, tem um outro jeito que você pode tentar. Primeiro vá para o site www.addtoany.com/buttons/, depois clique em Blogger, depois clique no botão escrito "Install Blogger Widget", na próxima tela clique em "Adicionar Widget".
Isso irá fazer com que o site adicione o código no seu Blogger automaticamente, mas como já mencionamos o código deles está incompleto, então agora você deve encontrar o código deles no seu HTML (procure por "AddToAny" e você vai encontrá-lo), e substituir ele pelo código que nós te ensinamos acima, depois é só salvar.

Ah, e se você quiser novos botões de compartilhamento para a versão normal (para computadores) do seu site, basta seguir esse passo-a-passo aqui. Ou, se quiser usar os mesmos botões da versão mobile na versão desktop, basta trocar a linha de código

<b:widget id='HTML3' locked='false' mobile='only' title='AddToAny' type='HTML'>

Por:

<b:widget id='HTML3' locked='false' mobile='yes' title='AddToAny' type='HTML'>

Obrigado pelo seu tempo e até a próxima! Qualquer dúvida basta deixar um comentário ou nos enviar um e-mail. E, claro, não deixe de visitar nossa página oficial para ler mais coisas interessantes.

Dicas para Blogger 31 - Como resolver o erro PageList1

Olá amigos, sejam bem vindos a mais uma parte de nossa série de Dicas para Blogger, onde ensinamos blogueiros iniciantes e profissionais como resolver seus problemas de maneira fácil e direta. Hoje iremos falar de um erro que infelizmente afetou muitos blogueiros por aí, o famoso "As configurações do widget com o código <b>PageList1</b> não são válidas. O título da página é inválido. Error 400". Mas vamos do começo.

O que é o erro "<b>PageList1</b> não são válidas"?

Se você tem um blogger moderno já deve ter encontrado esse erro, ele acontece sempre que você tentar modificar o código HTML do seu site, só que o Blogger não dá mais nenhuma dica do que ele pode ser e muito menos como resolver o problema, mas é pra isso que nós estamos aqui não é mesmo?
A primeira coisa que você deve saber é que ele não é sua culpa, a culpa é do Blogger, mas é você que tem de resolver ele. A segunda é que ele é causado pelo fato do Blogger não saber ler. Mas o que exatamente isso significa? Significa que o Blogger não consegue ler os chamados caracteres especiais, que incluem coisas como ç, ã, é, í, @, $, % e qualquer coisa que não for uma letra simples. Esse erro então acontece quando você usa esses caracteres especiais em suas Páginas, que no meu caso ficam localizados em "História e Evolução do site".
Bom, agora que você sabe o que causa o erro vamos falar do mais importante.

Como consertar o erro "As configurações do widget com o código <b>PageList1</b> não são válidas"

Bom, existem na verdade dois jeitos, vamos começar com o mais fácil e direto, clique no seu perfil Blogger, depois em Páginas e mude o título delas para algo sem caracteres especiais, remova todos os acentos, cedilhas e símbolos especiais. Pronto, problema resolvido.

Mas e se não você não quiser remover eles? Aí é um pouco mais complicado, mas vamos te ensinar passo a passo o que fazer. Primeiro acesse seu Blogger, depois na barra lateral clique em Tema, depois na flecha ao lado de Personalizar, depois em Editar HTML.

Clique no símbolo dos quadrados, "ir para o Widget" e depois clique em Pagelist1, agora você verá o código das suas páginas, você vai ter de achar as palavras que estão erradas e consertar elas manualmente, por exemplo, aqui vamos apagar "Hist\xf3ria e Evolu\xe7\xe3o" e reescrever como "História e Evolução"

Depois de reescrever basta salvar e pronto!... Ou quase. Lembra quando disse que a culpa era do Blogger e não sua? Bom, não é só porque você reescreveu que ele aprendeu a ler, em outras palavras, mesmo depois de salvar as alterações o Blogger vai voltar a ler elas errado da próxima vez, ou seja, você vai ter de consertar manualmente toda vez que quiser editar seu código HTML até a equipe do Google resolver consertar o erro do lado deles, o que deve demorar ainda.

Bom, é isso minha gente, menos um problema para ser resolvido, obrigado a todos que leram, deram like, compartilharam e comentaram nos posts do site, por favor sigam nossa página oficial em RWF e até a próxima!

Dicas para Blogger 41 - Você deveria usar o Ycorn?

Olá e seja muito bem-vindo a mais uma parte de nossa série sobre dicas para pessoas que ainda usam a plataforma Blogspot (que na minha opinião ainda é uma das melhores para blogueiros iniciantes). Mas como você já deve saber o Blogspot não lhe dá uma URL própria (todas elas vem com .blogspot.), por isso muitos sempre apelam para sites como o Registro.br, Hostinger, Hostgator, GoDaddy, Superdomínios, etc. Mas hoje vamos falar de outra alternativa, o Ycorn, conhecido por ser mais barato do que as alternativas ele atrai muita gente, mas será que vale a pena? Bom, vamos fazer uma análise nessa review aqui.

Nossa experiência com o Ycorn

Em 2019 o site Hostinger/Weblink (que nós estávamos usando na época) resolveu parar de aceitar o nosso método de pagamento preferencial (Paypal, sem cartão de crédito) sem aviso prévio. Nós procuramos no site mas não encontramos, enviamos uma mensagem a eles e a atendente disse que eles realmente não avisaram da mudança mas que ela já estava em vigor.
Com pressa tivemos de rapidamente encontrar outro registrador de domínios para não perdermos a URL. Depois de procurar os melhores preços o melhor de longe era o Ycorn, que nós então utilizamos sem problemas até 2024... e aí começaram os problemas.

O que nós descobrimos

A primeira coisa que notamos quando contratamos o serviço do Ycorn foi que ele na verdade não é "compatível" com o Blogger, mas o que isso quer dizer? Bom, vamos explicar da maneira mais simples o possível: Na hora de usar um domínio próprio o Blogger pede que você utilize duas coisas, um Registro A (que indica o endereço de IP de um determinado domínio) e um CNAME (que mapeia um nome de domínio para outro). Mas acredite ou não o Ycorn não oferece nenhum dos dois, ele utiliza apenas Nameservers (os servidores que fornecem serviços DNS para esse nome de domínio). Bom, ao notarmos isso imediatamente contatamos o site Ycorn para entendermos como prosseguir, e ai nós descobrimos outra peculiaridade do Ycorn, seu atendimento ao consumidor é... abaixo da média.

Tickets, e-mails e nada de respostas

Como o próprio site da Ycorn diz: "Para mantermos nossos preços muito baixos, nosso Atendimento ao Cliente é feito apenas via e-mail. No entanto, estamos disponíveis 24/7/365. Visite nossa página de Atendimento."
Se você quiser pedir ajuda a eles você tem de criar um ticket, esse ticket então será respondido via e-mail, você pode colocar qual a urgência de sua pergunta junto ao ticket, mas (em minha experiência), eles não necessariamente vão responder os urgentes mais rápidos que os médios e assim por diante, eles normalmente respondem no dia seguinte.

Mas então qual o problema se eles sempre respondem? Bom, é que as respostas são simplesmente ruins, ao ponto de muitos acharem (sem evidências concretas) que eles usam uma inteligência artificial barata para responder as reclamações. As respostas são sempre curtas e muitas vezes com erros básicos de português, para piorar eles ás vezes ignoram a pergunta completamente e respondem algo que não tem nada a ver com nada.

Por exemplo, quando um de nossos colaboradores (que não entende muito de informática) perguntou de maneira direta se eles eram compatíveis com o Blogger, e se a resposta fosse positiva, um passo-a-passo de como proceder, eles nunca responderam a resposta de forma direta, apenas dizendo: "Na compra de apenas um domínio apenas é possível ter acesso à gestão dos DNS. Teria de contratar uma hospedagem para ter acesso à zona de DNS e dessa forma alterar ou criar novas entradas para o domínio." E aí quando foram perguntados "qual a diferença entre Gestão DNS e Zona DNS?" eles nunca responderam.

Ou seja, nunca espere muito de seu atendimento ao cliente.

Outros problemas e respostas rudes?

Uma rápida checagem na página do Ycorn no Reclame Aqui irá mostrar várias reclamações não respondidas, grande parte reclamando de seu Atendimento ao Cliente, mas também de seus outros serviços. Eles tem uma nota geral dos consumidores de 2.0 de 10. Dos que avaliaram apenas 25% voltariam a fazer negócios com a empresa. E o mais bizarro é que eles tem um tempo médio de resposta de 72 dias e 12 horas! Já no Google sua nota é de atualmente 1,2 de 5.

Isso sem contar que quando eles respondem talvez a resposta não seja a que você quer ouvir. Quando um usuário disse: "EMPRESA TEM UM PÉSSIMO SUPORTE TECNICO. MEU DOMINIO FOI CONGELADO POIS ESQUECE DE PAGAR. UM DIAS APOS O CONGELAMENTO EFETUIE O PAGAMENTO E CONTINUO SEM ACESSO AOS MEUS E-MAILS"

Eles responderam: "O senhor não paga atempadamente as suas responsabilidades e a empresa é que tem culpa! Os domínios quando não são pagos nas datas devidas, são automáticamente congeladas pela registro.com.br. Quando procede ao pagamento há um tempo definido pela registro para que se perceba se seu domínio foi entretanto tomado. Da próxima vez pague atempadamente para que seu dominio não seja tomado por outros e e deixe de culpabilizar os outros pelos seus atrasos." É o famoso quem fala o que quer ouve o que não quer.

E para piorar, e isso não é uma piada, quando tentamos mudar nossos dados no sistema ele simplesmente resolveu mudar de língua, indo do português para o estoniano sem motivo aparente:

O por que e como isso aconteceu nunca foi explicado a nós, acho que eles na verdade nem notaram nada de errado.

Mas então como nós usamos eles?

Bom, se eles não são compatíveis com o Blogger como nós usamos eles por quase 4 anos? Bom, aparentemente, e isso não é outra piada, eles cometeram um erro na hora de conectar nosso site que permitiu a nós utilizarmos o serviço deles. Eu sei, parece bizarro, e é, mas é a verdade. 

Como foi um empregado deles que ajustou nossa conta quando movemos nosso domínio do Hostinger para eles, foi provavelmente esse empregado que cometeu o erro também. Só notamos o erro quando nosso site parou de pegar sem motivo aparente e tivemos de contatar o Blogger e o Ycorn, com esse último dizendo que nós não havíamos contratado o serviço deles para hospedagem, apenas para domínio... e mesmo assim aparentemente estávamos usando a hospedagem deles por 4 anos?

O que aconteceu é que eles pediram nossos dados, e nós demos a eles, e ai eles mandaram uma mensagem dizendo: "As entradas forma inseridas. Melhores Cumprimentos". E foi isso, com erros de português e tudo:

Seria engraçado... se a gente não tivesse perdido muitas visualizações no processo é claro.

Em resumo: Eles são baratos, mas você recebe pelo o que você paga, e sem modificações (ou serviços extras) eles não são compatíveis com o Blogger.

Bom, é isso esperamos que tenha aprendido algo, boa sorte e até a próxima! 

Dicas para Blogger 32 - Como customizar a versão mobile do Blogger

Hoje em dia mais do que nunca as pessoas acessam sites pelo celular, por isso quase todos recomendam que você tenha um site compatível com celulares e tablets, mas o Blogger infelizmente não tem um menu de customização mobile, você pode escolher entre usar um template comum, ou customizar um, mas como você customiza um? Bom, você vai descobrir isso agora mesmo, sem enrolação nenhuma!
Primeiro se você quiser customizar algo você tem de clicar em "Tema" depois na flecha ao lado de personalizar e por último em "Configurações do celular":

Depois disso coloque o tema personalizado, do contrário você apenas usará um template comum, não que tenha algo de errado com isso. 

E pronto, você agora pode customizar sua versão mobile, mas cada área de customização tem um jeito diferente de ser customizado, então para facilitar vamos dividir elas em categorias.

Como customizar o tamanho das imagens de sua versão mobile no Blogger

A primeira coisa que você deve notar ao usar a versão para celular do seu site é que as imagens ficaram ruins, isso porque elas podem ter ficado muito pequenas ou muito grandes, o que você quer são imagens adaptáveis, que sempre ficam otimizadas com o melhor tamanho de maneira automática. Para fazer isso acontecer clique em "Tema", "Personalizar", vá até "Avançado", depois vá para "Adicionar CSS" e cole o código abaixo:

.mobile .post-body img {

width:100%;

height:100%;

display: block;

}

Pronto! Isso fará suas imagens ficarem sempre do tamanho correto na versão mobile do seu site. Confira o antes e depois abaixo:

Como colocar comentários do facebook no celular?

Nós já falamos sobre isso nessa matéria aqui, então se você ainda usar o facebook recomendamos ler ela com atenção.

Como colocar gadgets/widgets na versão mobile do seu Blogger?

Gadgets e widgets podem ser adicionados de uma maneira muito fácil na versão para celular do seu site, basta ir em "Tema" depois em "Editar HTML", depois clicar nos quadradinhos e escolher qual deles você quer levar para a versão mobile.

Depois disso basta você adicionar tags condicionais para fazer eles aparecerem no seu celular, elas são mobile='yes' para fazer eles aparecerem no computador e no seu celular, e mobile='only' para fazer eles aparecerem apenas no celular, mas não no computador. Você ainda pode usar a tag mobile='no' para retirar algo da versão para celular. Mas onde você coloca a tag? No comecinho mesmo, por exemplo, se a linha de código é:

<b:widget id='HTML11' locked='false' title='' type='HTML' version='1'>

Você fará a linha ficar assim:

<b:widget id='HTML11' locked='false' mobile='yes' title='' type='HTML' version='1'>

Notou a diferença? Basta fazer isso com todos os gadgets/widgets que você quiser agora e pronto, eles irão aparecer no celular a partir de agora.

Como customizar o tamanho das letras do Blogger em mobile?

Por último, mas não menos importante, temos as letras, fontes gigantes ficam ruins no celular, e muito pequenas ficam difíceis de ler e podem fazer seus leitores desistirem de você. Para customizar elas vá até "Tema", "Personalizar", "Avançado", "Adicionar CSS" e escolha qual código você quer adicionar da lista abaixo.

Títulos de posts individuais: 

.mobile h3.post-title {
font: normal 20px Kenia;

}

Títulos de posts na página principal:

.mobile-index-title {

font: normal 20px Kenia;

}

Descrição do Blogger em Mobile:

.mobile .Header .description {

font: normal 16px Kenia;

}

Título do Blogger em posts individuais:

.mobile .Header h1 a {

font: normal 20px Kenia;
}

Título do Blogger na página principal: 

.mobile .Header h1.title {

font: normal 22px Kenia;

}

Conteúdo da matéria: 

.mobile .post-body {

font: normal 12px Kenia;

}

Data da publicação: 

.mobile .date-header {

font: normal 12px Kenia;

}

Agora que você colou o seu escolhido vamos customizar ele. O número seguido por px é o tamanho da fonte, aumente ou diminua ele conforme o desejado. E Kenia é a fonte, substitua ela por sua fonte desejada, como por exemplo Ariel, Fonte padrão, Helvetica, etc. E pronto, é isso! Você customizou com facilidade a sua versão mobile do seu site. Agora é só aproveitar... ou quase.

Se você fez tudo certinho você agora só tem mais um problema, dependendo de qual template do Blogger você usa você irá notar que os títulos dos seus posts (por algum motivo idiota) só chegam até a metade da página antes deles continuarem em uma segunda linha. Ficou confuso? Vamos explicar melhor, na imagem abaixo nós colocamos o título a direita da página para você ver que depois de um certo ponto ele simplesmente para e desce para uma segunda linha:

Como você pode ver o seu título acaba ficando "preso", com um espaço em branco gigante que deixa o seu blog com uma cara estranha e amadora, mas agora nós vamos lhe ensinar a resolver isso, abaixo você fica com o antes e depois do nosso passo-a-passo:

Se você quiser que os seus títulos também fiquem assim você irá no seu "Editar HTML" e irá encontrar o seu código (se você já tiver colocado ele é claro) de Títulos de posts na página principal:

 .mobile-index-title {

 font: normal 20px Kenia;

 }

E agora você vai substituir esse código por esse aqui:

.mobile-index-title {

  font: bold 22px Fonte padrão;

  text-align: left;

  width: 100%;

  box-sizing: border-box;

}

Esse novo código irá fazer o seu título parar de ficar "preso" e usar todo o espaço possível, se adaptando para cada tipo de tela automaticamente.

E pronto! Bom, esperamos que tenha curtido, se ainda quiser ver mais dicas fáceis e rápidas para blogueiros clique aqui agora mesmo! Até a próxima e boa sorte!

Dicas para Blogger 20 - Por que você não deve confiar no Blogger?

Na hora de criar um site um blogueiro iniciante tem mais perguntas do que respostas, e uma delas é sempre em qual plataforma criar seu site, afinal com tantas opções as coisas podem sempre ficar confusas, mas o Blogger (a plataforma do Google) ainda é bem utilizada, o problema é que você não pode confiar nela.

Por que você não deve confiar no Blogger?

Uma grande parte de se ter um site é saber quantas pessoas estão visitando o seu site diariamente, isso é necessário para várias coisas, inclusive gerar lucro, e é exatamente aí que o Blogger começa a mentir para você.

De uma maneira fácil e direta, todos os dados que você encontra na seção "Estatísticas" estão errados! Mas o que isso quer dizer? Quer dizer que se o Blogger mostra que você teve por exemplo 1000 visualizações em um dia, o número real de visitas é provavelmente muito mais baixo do que isso. 

O fato é que na hora de calcular os visitantes do seu site, o Blogger contabiliza quase tudo que entra no site, incluindo robôs, cliques falsos e spam. Esses cliques não contam pra nada, empresas não te pagam por eles, eles servem apenas para fazer o site parecer maior do que realmente é.

Então como saber qual é o número real de visitantes do seu blog?

Blogger Vs Analytics

O melhor jeito (e o mais fácil) de você saber quantas visitas reais seu site esta tendo é usando o Google Analytics, uma ferramenta recomendada pelo próprio Blogger, já que ambos pertencem ao Google.

O Google Analytics não contabiliza robôs, spams e visitas falsas, que são muito comuns em blogs que usam agregadores e banners em sites parceiros. Basta criar uma conta no Anlytics, fazer o link entre ela e seu site e pronto, você tem uma ferramenta que contabiliza visualizações que são úteis, do tipo que empresas te pagam para ter.

Mas já avisamos desde cedo, a diferença entre suas visitas no Blogger e no Analytics pode ser enorme, o que provavelmente pode te deixar com vontade de desistir de continuar postando.

Se você, blogueiro iniciante, quiser mais dicas como essa para ter um site melhor, clique aqui. E se quiser fazer uma parceria de algum tipo nós mande um e-mail, nós sempre respondemos eles.

E não deixe de visitar o nosso facebook em Real World Fatos.

Dicas para Blogger 24 - Como colocar posts relacionados no Blogger

Olá e bem-vindo a mais uma parte da série de matérias onde nós damos dicas para blogueiros iniciantes e profissionais de maneira rápida e simples. Hoje nós vamos falar sobre posts relacionados, afinal, desde a morte do Linkwithin e dezenas de outros serviços vários blogueiros ficaram perdidos sem saber o que fazer para remediar a situação. Mas hoje você vai aprender como colocar esses posts relacionados no seu blogger de maneira fácil e gratuita.

Antes de mais nada...

... tenha certeza de que você já não está usando um sistema de posts relacionados antes de tentar colocar outro sistema em seu blog, se você já tiver um, o novo sistema simplesmente não vai funcionar.

E saiba que seguindo esse tutorial o seu gadget vai ficar igual ao nosso, mas tudo bem, como cada site é diferente vamos te ensinar a customizar ele também.

Dicas para Blogger 34 - Como remover o espaço em branco na versão mobile

A versão Mobile (para celulares e certos tablets) de seu site ainda é difícil de ser customizada, por isso hoje vamos mostrar mais um tutorial para quem precisa de ajuda, hoje vamos mostrar como retirar os espaços em branco que normalmente ficam entre o título, as imagens e as palavras de sua matéria:

Como remover TODOS os espaços em branco na versão mobile de uma só vez

Esses espaços em branco normalmente acontecem devido a formatação de sua matéria, mas eles normalmente só ficam visíveis na versão mobile do seu site, o que irrita muitos blogueiros por aí, o lado bom é que vamos te ensinar a resolver todos os espaços de uma só vez.
Primeiro entre na sua conta do Blogger, depois clique em "Tema" no lado esquerdo, depois em "Personalizar".

Agora no novo menu você vai clicar em "Avançado", e na flecha ao lado de "Página", nesse novo menu você vai descer até o fim e escolher a opção "Adicionar CSS":

Nesse novo campo você vai colar o seguinte código:

.mobile .post-body a[style*='margin'] {margin-left: auto !important; margin-right: auto !important;}

Esse código vai eliminar os espaços em branco do seu site, mas apenas da versão Mobile. E pronto, basta salvar e ver a diferença... só que... ainda devem ter alguns espaços em branco no seu site.

Esses espaços entre imagens e texto são causados pelo código br (<br> e <br />) e normalmente eles vem depois do código a, ficando algo como </a><br /><div no seu HTML, para piorar eles também normalmente só ficam visíveis na versão mobile do seu site. Se você quiser resolver esses espaços você tem então duas opções:

Primeiro, entre no seu Blogger, escolha a matéria que você quer arrumar, depois clique no lápis no canto esquerdo e escolha a opção "< >Visualização em HTML". 

Agora basta achar o código br (que se traduz como uma linha de espaço em branco), e deletar ele, indo de algo como </a><br /><div para </a><div. Pronto, a linha invisível foi deletada de todas as versões do seu site.

O problema com isso é que você tem de arrumar todos os espaços em branco manualmente, indo de matéria em matéria, mas existe outro jeito.
Vá novamente para a sua conta do Blogger, depois clique em "Tema" no lado esquerdo, depois em "Personalizar". Mais uma vez no novo menu você vai clicar em "Avançado", e na flecha ao lado de "Página", nesse novo menu você vai descer até o fim e escolher a opção "Adicionar CSS", agora você vai colar esse código aqui:

@media(max-width: 800px) {

 a + br  {

    display: none;

  }

Esse código irá fazer com que todas as tags a seguidas da tags br sejam "deletadas" de qualquer tela menor do que 800 px (você pode mudar o tamanho da tela se quiser).
O problema desse método é que dependendo do quanto seu site já foi customizado, e seu estilo de formatação, você pode acabar deletando coisas que não queria, sem contar que "deletar" a tag a (que é a tag do hyperlink, que é usado para ligar uma página a outra) pode não ser uma boa ideia para você, por isso esse método não é recomendado para todos os blogueiros. Tente adicionar o código e ver se ele funciona para você, se não funcionar basta deletar ele e salvar.

Bom, depois disso tudo fica apenas uma pergunta, de onde vem esses espaços em branco "invisíveis"? Bom, eles são colocados pelo próprio Blogger de forma automática por vários motivos diferentes, incluindo formatação de tag errada, dar espaços com Shift + Enter, tags HTML não suportadas, colar diretamente textos copiados de fontes externas no corpo do editor de postagem e muito mais. Por isso esse tipo de coisa deve acontecer com você em algum momento quer você queira ou não.

Se você chegou até o fim desse tutorial que tal agora dar uma passadinha em nossa página oficial em RWF? Lá você vai encontrar nossas matérias mais engraçadas, artísticas e curiosas. Obrigado pelo seu tempo e até a próxima!

Dicas para Blogger 17 - Como colocar comentários do facebook no celular

Bem vindos a mais uma parte da série de matérias Dicas para Blogger, onde o RWF ensina alguns truques que vão ajudar blogueiros iniciantes e até aqueles mais experientes que precisam de uma mãozinha. Hoje vamos falar sobre comentários do facebook na versão mobile do seu blog, ou seja em celulares, tablets etc.

Para ser honesto hoje em dia é difícil que as pessoa realmente comentem em blogs, principalmente os menores, mesmo assim é bom sempre ter a opção caso algum leitor queira deixar um recado no seu site.

Comentários do Facebook no seu site

Aqui no Real World Fatos nós já ensinamos antes como colocar os comentários do facebook via plugin no seu site, normalmente quando você faz isso eles também aparecem automaticamente na versão mobile do seu site. Mas como o Facebook e o Blogger mudam seus códigos e plugins com frequência, e ficam cada vez piores de serem usados no processo, é possível que o seu site não tenha eles nas duas versões. Se isso está acontecendo com você siga o passo-a-passo a seguir para resolver o problema.

Comentários do Facebook em mobile

Clique em "Tema" e depois em "editar HTML" e vá até o seu código body que normalmente é escrito como <body.

Ache o código <div id='fb-root'/> e embaixo dele cole o seguinte: 

<script>(function(d, s, id) {

  var js, fjs = d.getElementsByTagName(s)[0];

  if (d.getElementById(id)) return;

  js = d.createElement(s); js.id = id;

  js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=ID&version=v2.0";

  fjs.parentNode.insertBefore(js, fjs);

}(document, 'script', 'facebook-jssdk'));</script>

Onde está o ID em azul você vai substituir pelo seu Facebook ID, o código numeral que eles te deram quando você criou seu plugin de comentários.

É possível que você já tenha esse código no seu HTML, nesse caso apenas vá para o passo seguinte.

Abaixo do código acima cole esse segundo código:

<p align='center'>
<span style='font-size: 15px;font-weight:bold;'>Facebook Comment Box </span>
</p>
<div style='text-align: center;'>
<fb:comments expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' mobile='yes' numposts='10'/>
</div>

E pronto! Se isso não fez os comentários aparecerem no seu blog significa que seu HTML pode estar "quebrado", ou seja, outras modificações que você já fez nele podem estar impedindo os códigos dos comentários de agirem no seu site.

Dicas para Blogger 40 - Problemas com o Blogger (blogspot.com) "DNS_PROBE_FINISHED_NXDOMAIN"

Muitas pessoas estão relatando que o Blogger está com vários problemas, um deles é o fato de que sites que utilizam o URL com o blogspot.com estão simplesmente fora do ar por motivos desconhecidos. O Google não se pronunciou oficialmente sobre o caso mas sabe-se que a empresa anos atrás esqueceu de renovar o domínio blogspot.in e perdeu o controle dele para outra empresa. Agora se isso está ligado de alguma maneira com os outros domínios blogspot saírem do ar hoje em dia ninguém sabe.

Ainda não se sabe como arrumar esse erro e os sites vão ficar fora do ar por tempo indeterminado. O bug não afetou sites de domínio próprio do Blogger (.com, .com.br, etc).

O Blogger também perdeu a capacidade de visualizar suas próprias matérias, levando apenas a uma página de erro.

Update: O Support.google.com falou sobre o caso nesse link aqui e ainda deram dicas de como tentar arrumar o problema. As dicas não funcionaram para todos, apenas para alguns, mas pelo menos é uma iniciativa.

Dicas para Blogger 16 - Os melhores agregadores

Continuando nossa série de dicas para blogueiros iniciantes, hoje vamos falar e fazer um review honesto sobre os Agregadores, sites que juntam vários links de blogs diferentes para que as pessoas possam ler os que mais chamam a atenção delas.

Foto de Agence Olloweb na Unsplash

Começar um site é fácil com as dicas certas, mas conseguir visualizações nem tanto, por isso é comum que blogueiros iniciantes usem os chamados agregadores para conseguir visitas extras. Mas será que vale a pena?

O lado bom dos agregadores

Se você quer apenas conseguir visitas então os agregadores podem fazer milagres, um link que normalmente recebe 100 visitas pode conseguir 1000 com o site certo, agregadores também costumam deixar que você mande mais de um link por vez, então eles podem aumentar suas visualizações iniciais em mais de 100%, mas nem tudo é simples.

O lado ruim dos agregadores

Usar um agregador não faz com seu site fique mais popular, ele apenas ganha mais visualizações, a pessoa que usa os agregadores raramente vai entrar de maneira direta no seu site, se você parar de mandar links para esses tipo de site, você vai perceber que as pessoas provavelmente nem se lembram do nome do seu blog. Sem contar que muitos agregadores não duram muito, e quando o site fechar todos os seus links vão junto com ele.

Usar agregadores e ganhar essas visitas indiretas também pode fazer você cair no sistema de ranking do Google, o que faz com que fique cada vez mais difícil achar o seu site.

Dicas para Blogger 5 - Glossário para blogueiros iniciantes

Glossário para blogueiros iniciantes

Se você criou seu blog a pouco tempo, é provável que você nem sempre saiba o que os termos que você encontra por aí significam. Então aqui vai um glossário rápido:

Post: é o conteúdo que você coloca no seu blog, cada matéria escrita é um post.

URL: é o endereço do seu site,  significa  Uniform Resource Locator  ou Localizador Padrão de Recursos.

Meta Tags: é uma das várias ferramentas que os buscadores utilizavam para formar seus resultados, com elas ficava mais fácil utilizar palavras chaves para achar determinado conteúdo entre os milhões de sites que existem por aí (se quiser saber mais clique aqui).

Layout: é o "rosto" do seu site, tudo que você enxerga é parte do layout, desde o título até a borda.

Banner: imagens de diversos formatos utilizadas principalmente para propaganda, são feitas utilizado código HTML (se quiser saber mais clique aqui).

HTML: é a sigla de HyperText Markup Language, expressão inglesa que significa "Linguagem de Marcação de Hipertexto". É um código utilizada para produção de páginas na internet, ele faz com que os documentos possam ser lidos em praticamente qualquer tipo de computador sem precisar converte-los. 

JavaScript: é definido como uma "linguagem de programação interpretada", no caso do blogger é com o JavaScript que você utiliza os códigos HTML, o programa os lê e os transforma, isso é muito usado na criação dos banners.

Caixa alta e Caixa baixa: é a expressão usada em tipografia para referir a escrita com letras maiúsculas e minúsculas respectivamente. Você deve ficar atento a alguns avisos, em alguns programas e ferramentas nem sempre você pode escrever algo em caixa alta ou baixa.

Links: É uma palavra, texto, ou imagem que permite o acesso imediato à outra página, documento ou site, bastando ser clicado. É comum o link estar sublinhado ou em cor diferente do resto do texto.

Tags: Tag significa etiqueta. Elas são uma maneira rápida de separar os seus posts por categorias.

Gadgets ou Widgets: ambos tem o mesmo significado, eles podem ser um software, módulo, ferramenta ou serviço que pode ser incorporado no seu site. Os gadgets são mais conhecidos como ferramentas (você pode escolher quais  utilizar usando as opções do próprio blogger), e os widgets são mais conhecidos como pequenos menus com diversas finalidades, tais como: mostrar as horas, clima, acesso a posts de outros sites etc. Eles são feitos em códigos HTML.

RSS: Significa "RDF Site Summary", mas também é conhecido como "Really Simple Syndication" ou "Rich Site Summary". Os feed RSS são uma maneira fácil e rápida de divulgação em sites e blogs, ela é muito usada por agregadores. Funciona assim: o link e um resumo do conteúdo escolhido (ou o conteúdo inteiro) é armazenado em um arquivo de extensão , tais como .xml, .rss ou .rdf. Com um leitor de feeds RSS você escolhe entre ver ou não o conteúdo, basta clicar nele.

CSS: Cascading Style Sheets é uma "folha de estilo". Composta por várias “camadas”, ela é utilizada para definir a aparência em páginas da internet que são produzidas com linguagens de marcação (como por exemplo: XML, HTML e XHTML).

Curtiu? Então venha curtir o nosso facebook para nós ajudar a crescer.

Dicas para Blogger 25 - O Facebook só quer te ferrar

Vamos ser sinceros, você pode odiar o facebook, mas a maioria dos blogs e sites tem uma página nessa rede social, mas nem tudo é o que aparenta. Confira mais uma parte incrível de nossa série de dicas para blogueiros iniciantes e profissionais. E se você quiser ver mais dicas (nós temos várias) clique aqui agora mesmo.

O Facebook não funciona como prometido

De uma maneira simples esse é o grande problema da rede social quanto se trata de blogueiros, mas o que isso quer dizer? Vamos explicar de uma maneira fácil. Você fez a página do seu blog e conseguiu 200 seguidores, ótimo não é mesmo? Mas aí você começa a notar que quando compartilha um post via facebook você nota que seu alcance não está nem perto de 200, mas tudo bem, certo? Afinal nem todo mundo que segue a sua página vai ver suas matérias todos os dias, mas aí você compartilha outro link e percebe que menos de 10 pessoas realmente viram a matéria, então o que diabos está acontecendo?

Alcance orgânico

Infelizmente isso tudo é normal, e se trata do fato de que o facebook está propositalmente diminuindo seu alcance orgânico. Mas o que é o alcance orgânico de uma página? É quantas pessoas você pode alcançar via facebook de maneira gratuita, sem pagar por isso. Se você tem 200 seguidores, deveria ter um alcance orgânico de pelo menos 100 pessoas mais ou menos certo? Mas ás vezes seu alcance é de apenas 7 pessoas, ou ainda menos do que isso.

Mas por que o facebook está ferrando com seus próprios usuários desse jeito? Afinal, se mais pessoas verem suas matérias não significa que o facebook também ganharia com isso? A resposta pra isso depende de quem você pergunta, segundo o facebook a restrição imposta no seu alcance orgânico é para ajudar as pessoas a não ficarem sobrecarregadas com muitas matérias e fake news em suas páginas principais, mas isso é verdade?

Alcance pago

O verdadeiro motivo para o facebook restringir seu alcance pode ser muito mais simples do que isso, eles querem que você pague por ele. O facebook tem o chamado "impulsionamento de matérias" que é um nome chique para "nós pague e nós mostramos sua matéria para mais pessoas, talvez até mesmo aquelas que curtiram sua página".

Em outras palavras está cada vez mais difícil conseguir novos fãs via facebook, e isso não deve mudar tão cedo, mas você deve saber que isso, por pior que seja, é normal, e vai ser assim por um bom tempo.

Se você quiser venha curtir nosso facebook, lá temos nossas melhores matérias que você pode acessar de maneira direta.

Dicas para Blogger 1 - Centralizar o nome, Criar um site bilíngue, Criar Tags e menus.

Existem muitos tutoriais na internet sobre como fazer determinadas ações no Blogger, mas poucos estão atualizados. Veja agora algumas dicas, quem sabe isso possa te ajudar a entender melhor o seu Blog.

Como centralizar o nome do site

Vá em Layout, procure o título do blog e digite "<center>nome do seu blog</center>". Para centralizar a descrição basta fazer a mesma coisa "<center>descrição do seu blog</center>". ATENÇÃO: nem todos os Layouts conseguem modificar a descrição de maneira satisfatória, ás vezes aparece um texto pequeno e quase invisível, e se você quiser resolver isso terá de procurar um outro Layout.

Como criar um site bilíngue

O jeito mais fácil de criar um site em duas ou mais línguas é ir até seu Layout, clicar em adicionar um Gadget e escolher o "Translate", fornecido pelo próprio Google. O outro jeito é muito mais cansativo, você teria de criar um outro site (com outro URL) e escrever um texto para cada uma das línguas, postar um em um site e depois postar de novo (já traduzido) no outro.

Como criar Tags ou Marcadores

Os marcadores são um jeito fácil de "dividir" os seus post em categorias. Funciona assim: quando alguém clica em uma de suas tags, ele é redirecionado para uma página onde só se encontra os posts com aquela mesma tag. Para fazer isso basta clicar em postagens, escolher uma ou mais postagens, depois clique no simbolo ao lado de publicar, novo marcador, digite o que você quer (Ex: notícia, moda, esporte, etc). clique em ok e pronto. Você pode ter vários marcadores diferentes e colocar mais de um marcador na mesma postagem. Para deletar basta clicar no editar, e os marcadores estarão no lado direito em "configurações de postagem" e deletar o que estiver escrito na caixa de texto.

Como criar um "menu" para os marcadores

Clique em Layout, clique em adicionar um Gadget no lugar aonde você quer o menu, escolha o Gadget "Marcadores" e o menu vai aparecer. Você pode editar esse menu assim como o resto do blog.

Como criar um "menu" para páginas

Antes de mais nada é bom saber a diferença entre páginas e marcadores. Exemplos de marcadores: curiosidades, esporte, noticia, moda, culinária, etc. Exemplos de páginas:  Início (voltar ao blog), sobre, entre em contato, anuncie, etc. 
Primeiro clique em Páginas, logo abaixo de Postagens clique em nova página, coloque o titulo da Página, escreva o que quiser, depois vá  até Layout, adicionar o Gadget aonde você quiser que o menu fique, escolha o Gadget "Páginas", escolha o que você quer mostrar e o menu está pronto.

Real World Fatos tem ainda mais dicas pra você, que tal curtir o nosso facebook e sempre ficar atualizado nesses assuntos?

Dicas para Blogger 22 - Matérias boas não dão visualizações

Chegou a hora de mais uma matéria onde damos dicas para blogueiros iniciantes e profissionais, e também falamos sobre fatos que muitos preferem ignorar. Hoje vamos falar sobre uma verdade que muitos simplesmente se recusam a acreditar, "matérias boas não dão visualizações". Mas o que isso significa exatamente? Continue lendo e você vai entender.

Matérias boas ≠ Visualizações

Vamos ser sinceros e ir direto ao ponto, só porque suas matérias são boas isso não quer dizer que as pessoas vão ler elas. Não importa o quão bem você use suas palavras, imagens, piadas e citações, as pessoas simplesmente não vão entrar em seu site e ler o que você escreveu? Mas por que isso? Primeiro de tudo porque as pessoas nem vão saber como encontrar sua matéria no meio de milhões de sites.

A verdade é que visualizações podem vir de vários meios, por indicação de outros sites (como agregadores), por meio de mídias sociais, ou por pesquisas no Google, e, infelizmente, uma matéria bem escrita não é o suficiente para atrair leitores hoje em dia.

Vale a pena se esforçar?

A verdade é que nos tempos modernos as pessoas preferem coisas mais fáceis e que requerem menos esforço quando se trata de conteúdo, por exemplo, uma matéria que é apenas um print de uma conversa engraçada pode ter tantas visualizações (ou até mais) do que seu Top 10 incrível que você passou meses pesquisando e organizando.

Um estudo realizado em 2018 confirmou que a maioria das pessoas compartilham artigos baseados apenas em seus títulos, ou seja, elas não estavam lendo eles de verdade. E segundo outro estudo 70% das pessoas no facebook comentam em links antes mesmo de lerem as matérias dentro deles. E segundo outro estudo 55% dos leitores leem as matérias em média por apenas 15 segundos antes de sair do site.

Então como conseguir visitas?

Se existisse uma maneira fácil de fazer pessoas entrarem em seu site você com certeza já teria ouvido falar dela, mas ela não existe. Hoje em dia parece que ter um site bem sucedido é uma mistura de sorte, conexões e ás vezes dinheiro, até mesmo agregadores normalmente colocam links pagos no topo do site, deixando matérias boas no fundo onde quase ninguém vê elas.

Se você quer mesmo seguir a "carreira" de blogueiro sugiro que comece lendo as outras partes dessa série de dicas, você provavelmente não vai ficar famoso da noite pro dia, mas também não vai piorar a sua situação.

Não deixe de curtir o nosso facebook em Real World Fatos para mais matérias incríveis, dicas, prints, vídeos e tudo que você pode imaginar.