Uma das coisas que eu mais gosto no Blogger são as suas condicionais. Elas permitem personalizar e controlar muitas coisas em nossos blogs!
Não sabe o que é e nem para o que servem?
Vou explicar:
O que são e o que fazem as condicionais do Blogger?
Por exemplo, vamos supor que eu não quisesse que as postagens relacionadas que estão ao final dos meus posts aparecessem na página inicial do blog, mas somente nas páginas internas dos posts.
Com a condicional que exibe apenas nas páginas internas eu consigo isso.
Outro exemplo:
Suponha que eu tenha um slide em meu blog e não queira que ele apareça nas páginas estáticas e nem nas páginas internas dos posts, somente na Home. Com a condicional certa eu consigo isso.
Quais são as condicionais do Blogger?
Tem outras, mas hoje vou focar nas mais usadas.
Vou separar por função, pra ficar mais simples.
Você pode copiar todos os códigos clicando no botão abaixo:
Como aplicar essas condicionais?
Agora vou ensinar como inserir as condicionais em seu template.
Requer paciência e conhecimento ao menos básico em HTML, mas não é impossível de fazer, com dedicação a gente consegue quase tudo!
Vou dar 2 exemplos, preste atenção.
Exemplo 1:
Suponhamos que você tenha em seu blog um slide (mas pode ser qualquer elemento de página inserido via Layout) e queira que ele apareça apenas na página inicial do blog.
Faça assim:
Antes de mais nada descubra qual a ID do elemento de página que deseja aplicar a condicional. No meu exemplo vou aplicar a condicional que mostra o elemento apenas na home do blog.
Vá ao seu gadget e clique para edita-lo; no alto da caixa com o código do gadget veja qual seu ID.
Assim, usando meu slide slide da loja como exemplo:
Cada gadget/widget possui um ID, ok?
Agora, sabendo qual o ID do seu gadget ao qual será aplicada a condicional vá ao painel do seu blog, clique na aba Modelo, clique em Editar HTML, e localize seu widget.
Assim:
Ao clicar na setinha expandem os widgets, clique naquele que deseja achar; ao fazer isso você será levado direto ao que procura.
Será um código mais ou menos assim (claro que com o ID de seu widget):
<b:widget id='HTML2' locked='false' title='' type='HTML'>
<b:includable id='main'><!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
Não se assuste, o importante é saber que cada widget começa com <b:widget e termina com </b:widget>, conforme marquei em azul.
Aplicando a condicional
Assim:
<b:includable id='main'><b:if cond='data:blog.url == data:blog.homepageUrl'>
Se for preciso abra um espaço e cole a condicional.
Agora essa condicional precisa ser fechada.
Veja o trecho que marquei em laranja.
Após esse trecho cole a tag de fechamento </b:if>
Fica assim:
<b:include name='quickedit'/></b:if>
Então o código do widget, completo, com a condicional que faz o slide ser exibido somente na página inicial fica assim:
<b:widget id='HTML2' locked='false' title='' type='HTML'>
<b:includable id='main'><b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/></b:if>
</b:includable>
</b:widget>
Exemplo 2:
Aqui vamos supor que o elemento ao qual você deseja aplicar a condicional tenha sido inserido direto no código fonte.
Neste segundo exemplo vamos supor que você tenha em seu blog os posts relacionados e queira que eles apareçam apenas nas páginas internas dos posts.Se for do tipo Linkwithin siga o mesmo procedimento que expliquei acima.
Contudo, se for um código inserido direto no template, como é o caso das Postagens relacionadas sem precisar do Linkwithin que ensinei aqui no blog proceda da seguinte maneira:
Localize o código que faz o script aparecer, no caso do meu tutorial é o 3º código.
Antes do começo do código aplique a condicional escolhida, no caso é aquela que exibe o elemento apenas nas páginas internas.
Ao final do código coloque a tag se fechamento </b:if>
Salve e veja se deu certo.
Caso não tenha dado releia o tutorial e refaça os passos.
Como eu disse esse tutorial requer paciência e um conhecimento ao menos básico em HTML, mas é simples e com dedicação todo mundo vai conseguir.
Guarde esse tutorial em seus favoritos, acredite: cedo ou tarde você vai precisar...
Elaine amei os templates,todos ficaram lindos.
ResponderExcluirParabéns sucesso para você,beijos
Amei essas dica Elaine. Provavelmente vou testar. E usar. Abraços
ResponderExcluircara, exatamente o que estava procurando =o
ResponderExcluirObrigada Elaine
BlogSemDrama.blogspot.com
Oi querida!
ResponderExcluirEstou chocada!!! Que aula foi essa????
Quanta informação, quantas novidades, quanto empenho!
Te admiro tanto, tanto, tanto...
Obrigada pelas dicas e por dividir seu conhecimento!
Beijos,
Cris
Muito obrigado pela dica Elaine. Todas as suas dicas são sensacionais, ajudam em tudo.
ResponderExcluirAs condicionais ajudam a esconder a barra de rolagem horizontal? Porque em meu blog apareceu e não sai, aumento e diminui a largura ela continua, achei código (overflow-x:hidden}) na internet que esconde, mas desconfigura a página e plano de fundo. Desde já agradeço :).
O blog é este: http://temploremano.blogspot.com.br/
✡Olá Elaine, sua explicação foi perfeita olhei varios tutoriais e nenhum dava certo.. Parabéns pela ótima didática ✡Beijos do atelier encantado Com Mãos de seda✡✡
ResponderExcluirOlá Elaine, acompanho sempre seu blog e tem me ajudado mt.
ResponderExcluirGostaria de uma dica sua, que tenho certeza que algumas pessoas tem e eu estou enfrentando uma dificuldade para tirar a data da pagina contato e sobre mim. Acho desnecessário e gostaria de saber se tem como? Obrigada desde ja . Um grande beijo
Vai em layout e procura páginas ou pages e desmarca as que você não quer que apareçam. =)
ExcluirMuito obrigado pelo tutorial Elaine Gaspareto, foi de grande ajuda
ResponderExcluirObrigada! Quis mudar a configuração do meu layout e acabei tendo problemas com o slide aparecendo em todas as páginas, mas seu tutorial me salvou.
ResponderExcluirMuito bom!!! Muito útil! muuuito obrigada, mais uma vez rs
ResponderExcluirOi Elaine, obrigada pelas dicas. Sao muito úteis.
ResponderExcluirEstou tentando exibir os widgets apenas na página inicial. Consigo ocultar do jeito que vc falou. O problema é que fica um espaço vazio no lugar que teria o conteúdo ocultado. Se puder me ajudar, agradeço.
Marcela, dependendo de seu template o espaço vazio se notará mesmo.
ExcluirInfelizmente não há o que fazer pois como eu disse, depende muitas vezes do template.
Qual seu blog?
Aaah que coisa. Estou nas páginas de teste ainda. http://teste6delicatta.blogspot.com.br/
ExcluirOi. Você já fez um post sobre como instalar esse gadgete que você usa para compartilhamento das redes sociais, como facebook e WhatsApp?
ResponderExcluirQueria aprender. Bjs
Joabson, fiz sim, procure por botões de compartilhar.
ExcluirTem alguma condicional pra ocultar de acordo com o tamanho da tela? No caso, certo elemento apareceria no computador, mas não no celular.
ResponderExcluirSim, é o último código na página de códigos.
ExcluirOlá Elaine, gostaria de ocultar toda a sidebar na home do blogger, é possível? Se sim, saberia como fazer isto? Estou a procura a meses e não encontro como fazer isto!
ResponderExcluirJoão, tem jeito sim. Mas depende do template que você usar.
ExcluirQual seu blog?
O jeito de fazer é combinar 2 tutoriais: este, que usa a condicional Para ocultar um elemento apenas na página inicial e este:
https://www.elainegaspareto.com/2016/11/ocultar-sidebar-em-paginas-ou-posts-especificos.html
Aí é só aplicar os 2 códigos combinados acima de e sua sidebar terá sumido, ficando só a coluna dos posts.
Dá inclusive pra controlar a largura dessa coluna única, aplicar estilos nela, etc
Eu testei e dá certinho mas como eu disse precisa ver se seu template aceita.
Boa noite, Gostaria de saber se tem como usar uma condicional para Exibir o Gadget somente em uma URL especifica?
ResponderExcluirTem sim, atualizei a página dos códigos.
ExcluirNão havia colocado porque nem sempre funciona sem erros...
Olá! Segui certinho os passos para exibir somente na página inicial porém está justamente ocultando. O que será que fiz de errado?
ResponderExcluirExperimente de novo, acho que tinha um erro, eu verifiquei e creio que consegui corrigir...
ExcluirEeeeee deu super certo! Muitooo obrigada pela ajuda! =D
ExcluirUm dos melhores bloggers do mundo, Obrigado pela dica ajudou muito!!!!
ResponderExcluirOi Elaine!
ResponderExcluirComo aplico isso ao slide do tema ROSALIE?
Caíque, na faq do tema tem a explicação sobre o slide, mas vc pode aplicar a condicional antes desse trecho:< div class ='carousel_slider' >
ExcluirE não esqueça de fecha-la ao término do código do slide, tá?
Então ficaria < b:if cond='data:blog.homepageUrl == data:blog.url' >< div class='carousel_slider' > ?
ExcluirNão consegui identificar o término do código do slide, pode me ajudar informando qual seria o trecho?
Caíque, na faq do tema Rosalie tem o código completo, com as explicações sobre onde ele está, como começa e como termina.
ExcluirSe não me engano é antes de começar a seção Tabs...
Este comentário foi removido pelo autor.
ResponderExcluirElaine, me ajuda de novo, por favor!
ResponderExcluirEstou usando agora o tema Rebecca (achei mais bonito esse que o Camille).
Gostaria que o slide aparecesse só na página inicial.
Estou tentando aplicar este tutorial, porém como não entendo nada de HTML, não consigo nem descobrir qual é o gadget que gera o slide, logo, não sei qual é o seu ID.
Me ajude, por favor.
Obrigada pela atenção.
Olá, Elaine. Boa noite.
ResponderExcluirEu acho que te mandei um comentário, porém, como ele não apareceu aqui, devo ter só visualizado e não publicado. Hehehe...
Estou usando o template Rebecca, porém, mesmo lendo o tutorial não encontro o widget ou o código HTML para configurar o slide. Na verdade, gostaria que o slide aparecesse somente na página inicial.
Você poderia, por favor, me indicar exatamente em qual linha e antes de qual "palavra" devo colocar a condicional? Ah, e também, onde devo colocar a tag de fechamento?
Agradeço muito sua atenção. Estou adorando o conteúdo do seu blog. Parabéns pela generosidade de compartilhar seu conhecimento.
Meu blog (em construção) é: https://caentreasmaes.blogspot.com/
Cá entre as Mães
O slide do tema Rebecca é inserido no código fonte do tema e não como gadget.
ExcluirLeia a faq do tema, lá tem a informação completa sobre o slide.
A condicional é colocada antes do começo do código do slide e o fechamento dela é colocado ao final do código.
Leia a faq, o código que precisa achar está lá :)
bjssss
Olá, Elaine. Tudo bem?
ExcluirTentei seguir a FAQ do tema, porém, o resultado não deu certo. O slide continua aparecendo de forma desformatada nas páginas do blog (exceto na página inicial, na qual está perfeito). Veja como alterei o HTML:
!--COMEÇO DO CÓDIGO DO SLIDE-
b:if cond='data:blog.homepageUrl == data:blog.url' (foi aqui que inseri a condicional)
/b:if (foi aqui que inseri o fechamento da tag)
!--FINAL DO CÓDIGO DO SLIDE--
O que eu fiz de errado?
Obrigada, mais uma vez, pela ajuda.
Beijo.
PS: apenas para este comentário, retirei alguns caracteres dos códigos, pois o blogger não permitia que eu publicasse o meu comentário.
Uhuuuu!!!!
ExcluirAgora entendi!!! E o melhor: consegui!!!!
Eu estava colocando antes do código javascript e não do código html. Deu para perceber que não entendo nadinha sobre linguagem de computação.
Mais uma vez, obrigada pela ajuda! Você é demais!!!!
Oi, eu queria saber como eu faço pra que na homepage apareça apenas postagens da categoria "#" e na pagina de pesquisa apareça apenas posts da categoria "anime"? Eu consegui fazer a primeira parte, fazendo posts da categoria "#" aparececem apenas na homepage, mas a segunda parte eu nnão consigo fazer :(
ResponderExcluirOlá Elaine! Estou tirando muitas dúvidas por aqui, desculpa o incômodo :)
ResponderExcluirMeu template é do bloggr mesmo, não baixei nenhum aí estou tentando ocultar o gadget de marcadores da página inicial mas não estou conseguindo fechar com o , dá erro. Antes de "includable widget" tem "div" e é ele que não me deixa salvar o html. O que devo fazer?
(não consigo dizer pra você os códigos certinhos porque o blog não permite colocar códigos html nos comentários)
Emily, qual seu blog?
ExcluirEu teria que ver pra poder dizer se tem algo que eu possa dizer...
Boa de regra esse método é o que eu sempre usei e sempre deu certo.
Tem certeza que não está deixando de notar algum detalhe?
bjsss
Obrigada por retornar :)
Excluiro código ficou assim:
https://lh3.googleusercontent.com/-w1aWHH1BIho/X-udgHKlT1I/AAAAAAAAAAo/ujhwaWpKsEgFlOJ0JTnhGQILGvaC1h3HACLcBGAsYHQ/w1587-h618/image.png
o "b if" ta vermelho e, apesar de não ter pego no print, tem uma parte logo abaixo que começa com "div" e também tá vermelho acho que é essa parte que não deixa eu salvar o html e ocultar o widget de marcadores. eu também tentei ocultar o widget de posts do blog da página inicial e deixar só na dos posts mesmo (porque eu queria que na página inicial ficasse só as duas colunas laterais ocupando todo o blog) e não consegui :(
Resumindo: eu queria exibir o widget de marcadores apenas na página inicial e queria ocultar o widget de posts da página inicial e deixar na página inicial só os widgets das duas colunas laterais
Emily, qual o blog? Sem ver não posso dizer se é ou não algo do template.
ExcluirA área de postagem não funciona como os elementos de página. Até daria pra ocultar mas o procedimento é outro. Tem que definir pra não exibir nenhum post na home e fazer outros ajustes. Nem sempre fica viável.
Mas adianto que é péssimo pra SEO.
Para resolver o problema dos marcadores cole a tag que fecha a condicional depois do fechamento da div que ficou em vermelho. Deve funcionar.
Aliás a dica é sempre essa: gente outros lugares até achar o lugar certo 😘
bjsss
ahh sim desculpe kk to usando meu blog de teste pra fazer o template: https://anotablogteste.blogspot.com/
Excluiraaaaaaaaa deu certo o widget do marcador :) muito obrigada mesmo, você é demais!
ai no caso esse de ocultar os posts da página inicial você não recomenda por causa do seo?? é que eu realmente queria fazer isso porque eu prefiro um template bem básico, como você pode ver no blog teste, nem cabeçalho eu coloquei, pretendo colocar a "logo" do blog numa tela pre-loader, mas ainda não encontrei nenhum tutorial pra fazer isso pelo blogger...