Páginas

10 fevereiro 2012

Ocultar gadgets em determinada página


Tumblr_lq55rmjtvt1qawkezo1_500_large
Hello meus amados! Ultimamente tenho postado bastante tutoriais não é? Então lá vai mais um. Esse foi pedido de uma leitora, mas infelizmente não lembro quem foi, só lembro que foi no msn.

Enfim, vou mostrar para vocês como fazer um gadget/widget aparecer apenas na página inicial ou apenas em uma página específica do seu blog, um recurso que é bastante usado em blogs estilo revista, para ocultar o slide ou menu da página inicial nas outras páginas.
Não é complicado, basta prestar atenção para por o código no lugar certo.


Primeiro, abra o painel do blogger. Clique no nome do blog  que você deseja modificar. Clique em "Modelo" no menu lateral. Clique no botão "Editar HTML" abaixo da miniatura do seu blog e no aviso que aparecer, clique em prosseguir.

Marque a opção "Expandir Modelos de Widgets":


Aperte Ctrl+F e procure pelo nome do gadget que você deseja ocultar. Se o gadget não tiver nome, vá no layout e coloque um nome nele, pra ficar mais fácil. Depois você tirar o nome, sem problemas.

Vai aparecer um código mais ou menos assim:

<b:widget id='HTML5' locked='false' title='Nome do gadget' type='HTML'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
  <b:include name='quickedit'/>
</b:includable>
</b:widget>

Só que obviamente, em vez de "Nome do gadget", vai estar o nome do gadget.

Agora vem a parte que requer atenção:
Se você quiser que o gadget apareça apenas na página inicial, você deve adicionar os seguintes códigos no código do seu gadget. Preste atenção para colar no lugar certo.
Abaixo de <b:includable id='main'>, você coloca isso:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Agora abaixo de <b:include name='quickedit'/> você adiciona isso:
</b:if>
Vai ficar assim:
 <b:widget id='HTML5' locked='false' title='Nome do gadget' 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 != &quot;&quot;'>
    <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>
Visualize se não tem nenhum erro e salve.
Agora se você quiser que o gadget apareça apenas nas páginas de posts, faça o mesmo procedimento acima, mas com os códigos que estão em destaque abaixo:
 <b:widget id='HTML3' locked='false' title='Nome do gadget' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<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>

E se quiser que o gadget apareça apenas em uma página específica, adicione os códigos destacados abaixo, e coloque o link da página em que você quer que o gadget apareça no lugar indicado:
 <b:widget id='HTML3' locked='false' title='Nome do gadget' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == "Coloque aqui o link da página"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<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>

Não esqueça de visualizar antes de salvar para ter certeza de que não há nenhum erro. Também é bom lembrar de fazer download do HTML do blog antes de fazer qualquer mudança, pois assim, se der algo errado, você pode recuperar tudo rapidinho.

Espero que tenham gostado. Kissus!

74 comentários:

  1. oiê! :)
    estou tentando fazer um menu e seguindo as dicas do seu tutorial COMO COLOCAR MENU DENTRO DA IMAGEM DO CABEÇALHO, mas o link que você informa o www.image-maps.com não mapea a imagem :/
    tentei isso a manhã toda
    sabe se tem outro site que eu possa fazer isso?

    brigada querida beijos
    @jessica_alves_
    http://ahquerodoce.blogspot.com/

    ResponderExcluir
  2. Adorei o tutorial >.<
    korea-tech.blogspot.com

    ResponderExcluir
  3. Liah , eu postei sobre o novo endereço do blog .
    Eu vou trocar ele amanhã de manhã .
    Se quiser saber mais é só ir nesse link :
    http://clubliahsa.blogspot.com/2012/02/club-cherry-bomb-vai-mudar-de-endereco.html

    ResponderExcluir
  4. Ótimo tutorial Liah!! Tava procurando há um tempo como se faz isso, mas nunca consegui achar um tuto bem explicadinho, hahaha, obrigada *-*
    http://viverserfeliz-renata.blogspot.com/

    ResponderExcluir
  5. Amei Liah!!*--*
    http://www.facebook.com/blogmudancas http://meumundomudando.blogspot.com/

    ResponderExcluir
  6. legal esse tuto *-*
    http://perfeitateen.blogspot.com/

    ResponderExcluir
  7. Liah, obrigada por atender ao meu pedido! Adorei o tuto!

    ResponderExcluir
  8. OMFG Liah você humilha com seus Layouts, na boa, fazia tempo que eu não visitava o CB e juro pra você que to de boca aberta(literalmente to parecendo uma boba de frente ao pc ;p). Parabéns e já não sei mais o que dizer *-*

    xoxo, A.
    wishoffashion.blogspot.com

    ResponderExcluir
  9. Amei, já estou usando no meu blog The Sims Place :)
    Quase fiquei sem ar com o novo layout, muito divo, achei que esse vermelho deixou o blog glamouroso (mais ainda) rsrs
    Bjs
    Girls On-Line
    The Sims Place

    ResponderExcluir
  10. O layout tá lindo de morrer, arrasou! Nossa, obrigada pelo tuto, vou usar no próximo layout, salvo em favoritos :).
    Beijos!

    garota-unbroken.blogspot.com

    ResponderExcluir
  11. Adorei o tutorial- e acho que não tinha falado antes, mas o lay tá lindo! *-* Só eu que tenho trauma/medo/pavor de japoneses/pessoas de olhos puxados/seus derivados e fico meio tensa, kkkkkk' oO Doida demais, hsaushau'
    Beijos ♥

    Conspirantes

    ResponderExcluir
  12. Meu Deus!!!!! Que new lay diviiiiiino!!!! *----------* Parabéns Liah, mais uma vez! Aliás, menina já está na faculdade hein? Que chique!! E pelo jeito "morando sozinha"?? Eita! kkkk

    Que tutô legal! =)

    Liah, sei que é bem corrido pra você, mas por favor preciso de ajuda: o cabeçalho do Teen Blog ~* (que é mapeado) sumiu do nada! (Acho que é algum erro com o image-maps sabe?) Mas não sei o que fazer! Não conheço outro site de mapeamento (que seja seguro) nem algum de hospedagem que não crie confusão!
    Por favor, se puder me explicar qualquer coisinha sobre eu agradeço muitooooo!!!! *o*

    Aliás, olha o que aparece quando clico em "abrir imagem em outra aba":

    404 Not Found

    The requested URL /uploaded_files/5201201011945581_9201112280935115_aquiiiiiiiiiiiiiiiedição.bmp was not found on this server.

    Apache/2.2.16 (Ubuntu) Server at www.image-maps.com Port 80


    Ai meu Deus... isso é muito sério? Tem conserto, né? =/
    kkkkk *Andresa Desesperada*
    Obrigada de coração por gastar seu tempinho lendo meu pedido desesperado kkkk
    Parabéns novamente, arrasou!!!!

    Beijão, ótimo FDS!!!
    http://teenblogumblogpravoce.blogspot.com/

    ResponderExcluir
  13. Liah, boa sorte na sua nova vida, vai começar a faculdade (meu sonho é fazer faculdade, haha.), em morar sozinha.. Depois me conta como é esta experiência, viu?!

    Amei o tutorial, e vou usar no próximo lay do MM! Amo seus tutoriais, mas queria sugerir um: como coloco caixa de texto nos posts? ;)

    Beijos, Manoela.
    www.meninasmalvadasblog.blogspot.com

    ResponderExcluir
  14. Liah, Liah a afobada que sou eu conseguiu arrumar o treco!
    Foi um problema na hospedagem (hospedei no próprio Image-maps)!!
    Então, agora está tudo OK! *o*
    http://teenblogumblogpravoce.blogspot.com/

    ResponderExcluir
  15. Bem legal. Que layout lindo, amei.

    O que acha de ganhar um livro num Super Sorteio? Participe, são 2 GANHADORES e um pode ser você.
    http://iasmincruz.blogspot.com/2012/02/super-sorteio.html

    ResponderExcluir
  16. Liah , já troquei o endereço do Club Cherry Bomb .
    http://clubcherrybomb.blogspot.com

    ResponderExcluir
  17. Liah, ameeeei o tuto *-* Vou usar um dia.
    Então, não foi você que encomendou comigo? :O Nossa, eu jurava que fosse. Bom, eu não uso o Google Docs pra fazer as encomendas, uso o Contact Form 123, mas acho que nesse formulário marca o IP da pessoa. Se você quiser saber, entro no msn e te falo.
    Beijos, Dani Ribeiro - onthefame.tk

    ResponderExcluir
  18. Liah me ajuda eu usei seu layout delicate lindo e a barrinha de separação das postagens ta escrito q ta deletada
    http://mudandodetemaofficial.blogspot.com/

    ResponderExcluir
  19. Ótima dica Liah! Obrigada!


    Blog1 | Blog2 | Vota em mim *aqui* por favor (Sou a : Sonhos De Uma

    Doce Garota)

    ResponderExcluir
  20. Liah, Liah a afobada que sou eu conseguiu arrumar o treco!
    Foi um problema na hospedagem (hospedei no próprio Image-maps)!! kkkkkk
    Então, agora está tudo OK! *o*

    Obrigada pela ajuda Liaah!!!

    http://teenblogumblogpravoce.blogspot.com/

    ResponderExcluir
  21. Adorei Liah arrasou , ensina também a fazer o menu com efeito hover dentro do cabeçalho , tipo o do trechy teen .
    http://perfeitinha-blog.blogspot.com/

    ResponderExcluir
  22. MINHANOSSASENHORA ainda nn tinha visto o lay novo *OOO* ficou lindo Liah (: AH, tava precisando mesmo desse tuto *_*

    xoxo, It’s Becky visita?

    ResponderExcluir
  23. Sorteio de um CD exclusivo personalizado só pra você!http://little-of-everything-blog.blogspot.com/

    ResponderExcluir
  24. Liah, sbae pq eu não gosto de você?

    Por que os seus layouts são perfects demaais e humilham os meus, rhuun! XD
    Adoro-te!
    Beijiinhos !
    meninafuturista.blogspot.com
    (blog em construção :))

    ResponderExcluir
  25. Putz..entrei no blog errado...kkkkk...o layout ficou super lindo liah!nem reconheci q era o cherry!+ o da avril tambem tava lindo!

    bjus*-*

    http://biadouto.blogspot.com

    ResponderExcluir
  26. Adorei o tutorial!! Pensei que tinha entrado no blog errado (kkkkkk) O novo design ficou lindo! Arrasou Liah!

    Bjs

    http://magicmih.blogspot.com/

    ResponderExcluir
  27. Adorei o tuto !!
    Segui meu blog ? http://capture-dream.blogspot.com/

    ResponderExcluir
  28. Adorei o tuto !!
    Segui meu blog ? http://capture-dream.blogspot.com/

    ResponderExcluir
  29. parabéns pelo blog, esou seguindo
    segue de volta?
    http://girlsin-fashion.blogspot.com/

    ResponderExcluir
  30. Liah, te mandei um formulário de contato será que você poderia me responder?

    Cozinhando com o Minduim

    ResponderExcluir
  31. Ótimo tuto, Liah!
    O novo lay ficou perfeito, amei demaaaais *-*
    http://delirios-degarota.blogspot.com

    ResponderExcluir
  32. Muito bom esse tutorial!
    Visite www.alittle--girl.blogspot.com um blog criado hoje!

    ResponderExcluir
  33. Ooi Liah amo esse blog e o tuto me ajudou muiiito vc não tem noção *--*
    Será que poderia dar uma seguidinha??
    ofthecupcake.blogspot.com
    Obrigado espero sua resposta :)

    ResponderExcluir
  34. Segue meu blog??
    http://capture-dream.blogspot.com/

    ResponderExcluir
  35. esse tutorial é muito bom, poderia postar como colcocar aquela caixa de pesquisa que nem a sua ? beijos
    http://libertythings.blogspot.com

    ResponderExcluir
  36. Ameeei o tutorial!
    Uma hora ainda vou usar ele lá no blog...\Õ/

    Beeijo amore!
    http://blogmymemories.tk

    ResponderExcluir
  37. cherry estou usando algumas coisinhas do extras ok? baixei o pacote de natal! muito liindos! :)beiijo

    ResponderExcluir
  38. Adorei o tuto#,quando eu precisar eu vou usar,mais agora não preciso.

    Ta tendo mini concurso participa?

    Beijinhos! ^^
    Lufashionteen.blogspot.com

    ResponderExcluir
  39. O blog está muito lindo *o*
    Parabéns!
    Muito bacana seus tutorias.


    Participe do 1º sorteio do Tecido Doce:
    http://tecido-doce.blogspot.com/2012/01/pinches-vintage-sorteio.html

    ResponderExcluir
  40. Olá, tudo bem???? adorei os tutoriais, mas eu queria mesmo era tirar esse balão de comentários... deixar só na página inicial.. http://breakfastatlores.blogspot.com/p/lore.html sabes como?

    Obrigada!

    ResponderExcluir
  41. Vlw mesmo.. Ajudou até e mais.. Continuem assim.. e visitem: http://fla-maisquerido.blogspot.com.br/

    ResponderExcluir
  42. Ajudou super, parabens pelo tuto super detalhado e organizado, já está nos favoritos!!!

    ResponderExcluir
  43. Aonde colocar o link para uma página especifica?

    ResponderExcluir
  44. Sempre olho aqui quando perciso de ajuda, ! PARABÉNS !

    ResponderExcluir
  45. Não tava dando certo, graças ao seu tutorial funcionou, muito obrigado :)

    Gosta de rock? Entre http://rocknall.blogspot.com

    ResponderExcluir
  46. Olha você está de parabéns Liah !!!
    Muito bom o seu conceito em trabalhar com tutoriais e debates, um conselho deveria trabalhar reformulando blog's e sair ganhando com o seu belo trabalho ...

    ResponderExcluir
  47. Infelismente não me ajudou não conseguir fazer nadaa !! :( mas tudo beem, deixa pra poxima rsrs

    ResponderExcluir
  48. Oi cherry, estou aqui deixando esse comentário para lhe agradecer, vou te falar viu seus tutoriais são de extrema qualidade praticamente você que faz tudo ao nosso blog porque desenhar ja desenha kkkkk só não entende quem é lento, sou muito grato aos seus tuto, parabéns continue assim vlw.

    ResponderExcluir
  49. Muito bom o blog ,, curti pra krl!!!! ajudo muito ,, brigadao aew!!!

    ResponderExcluir
  50. eu queria q vc me ensinasse a botarumslide porq esses q vc mando eu ñ entendo da pra explicar detalhadamente? e q eu possa botar esses slides com links

    ResponderExcluir
  51. obrigada, deu super certo e o slide aparece somente na pagina inicial...olha, da um trabalho mexer no html e requer muita concentração...bj e obrigada, seu blog é muito util,alem de lindo! ja estou seguindo. bjs www.cositasfemininas.blogspot.com.br se alguem quiser dar uma olhada como ficou, pq o tuto da certo!!!
    vo te falar que é dificil encontrar um tuto q da certo...

    ResponderExcluir
  52. num consegui fazerminhas gadgets aparecerem em determinadas pgs :(, o código do meu está totalmente diferente do escrito aí...

    ResponderExcluir
  53. O meu código não tem o que tem nas instruções, eu precisava demais disso :C

    ResponderExcluir
  54. Tutorial perfeito, Liah! Eu estava precisando muito!
    This Time

    ResponderExcluir
  55. oi.. fazer esse tutorial para colocar somente na página inicial, mas não deu muito certo... e nem sei o que estou fazendo errado... --"

    ResponderExcluir
  56. Deu certo, beijos ;)
    http://eletrolitica.blogspot.com.br

    ResponderExcluir
  57. Querida, só você deu jeito nesse imenso problema! Depois de horas lendo orientações em outras línguas foi reconfortante ler a sua e ter êxito no processo. Obrigada pela colaboração.

    ResponderExcluir
  58. OMG MT OBRIGAAAAADO!!! s2 Tavo procurando mt isso, os q eu achava era mt complicado é tal
    Mt obg msm! Bjos

    ResponderExcluir
  59. Cara amiga. Preciso urgentemente saber como criar uma página só de banner (imagens), sem aquela parte do post, só de gadgets. Poderia me ajudar nisto, pois já usei de todo o meu parco conhecimento e não consegui nada. Em tempo, sou seu leitor assíduo e quero lhe parabenizar pelo fabuloso blog. Abraço.

    ResponderExcluir
  60. Este comentário foi removido pelo autor.

    ResponderExcluir
  61. É interessante, mas eu só não consigo ocultar nas paginas o gagdet seguidores, eu li, reli, li novamente mas não consegui, ficou somente o seguidores, não consigo ocultar, pois as linhas de html de seguidores é diferente, é mais extenso e demasiado confuso.

    me ajuda? http://studio-kalebe.blogspot.com.br/

    ResponderExcluir
  62. Complicadinho... mas vale a pena!
    http://delicadaeimperfeita.blogspot.com.br/

    ResponderExcluir
  63. Ola obrigado pelo tutorial, conheço bastante de layouts mais sempre aprendemos cada vez mais, a sempre o que aprender.
    Você ensina no tutorial colocar gadget somente na postagem inicial e colocar gadget em postagem especifica, mas você sabe colocar um gadget que apareça em todas as postagens menos na postagem inicial. (esse sistema vai ser bem util em meu site) ta ai um desafio, bom vc sabe fazer.

    ResponderExcluir
  64. Visita e segue, voceis vão gostar;;
    http://ddiariodeumagarotas2.blogspot.com.br/

    ResponderExcluir
  65. Olá. Quero agradecer a sua ajuda. Foi fantástica.

    Obrigado

    ResponderExcluir
  66. Muito bom o tutorial. Com criatividade, dá para fazer muita coisa legal no blog.

    Cigarette Smoke - http://cigarettesmokeblog.blogspot.com.br/

    ResponderExcluir
  67. Este comentário foi removido pelo autor.

    ResponderExcluir
  68. Este comentário foi removido pelo autor.

    ResponderExcluir
  69. OI amiga, de todos os tutoriais que li sobre isso o seu foi o único que funcionou, obrigado !

    ResponderExcluir
  70. Não consigo colocar o gadget em uma página específica, já fui em vários sites, todos ensinam o mesmo código mas não funciona. O de colocar apenas na página principal pega mas os de por numa página específica não.:( Se alguém puder me ajudar eu agradeceria muito. :(

    ResponderExcluir
  71. Parabéns pelo excelente post. Obrigado, pois me ajudou muito. Se desejar, posso divulgar se blog no meu. Aguardo se retorno! http://roshshaul.blogspot.com.br/

    ResponderExcluir