Blogger: Esconder, Retirar elementos do blogue

Hoje lendo um artigo num blogue de tutoriais e dicas reparei numa coisa que me levou a escrever este tutorial. :)

Como esconder ou retirar algum elemento do blogue.

Imaginemos que num determinado elemento da barra lateral (sidebar) não desejamos mostrar o titulo:

<b:widget id='HTMLXX' locked='false' title='QUALQUER_TITULO' 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>

Existem varias maneiras de fazer isso, as mais comuns e divulgadas em blogues de tutoriais são as seguintes:

1º - Simplesmente, não colocar um titulo.

Resulta, mas aí temos o problema de achar o dito elemento no HTML do blogue se for necessário, caso tenhamos muitos elementos sem titulo.

Não recomendo esta opção.

2º - Apagando a parte do código referente ao titulo no HTML do elemento:

<!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>

Também resulta, e é uma maneira ensinada em muitos blogues de tutoriais (eu mesmo fiz isso muitas vezes), mas caso queiramos recolocar o titulo temos que andar a recolocar essa parte do código em quantos elementos tivermos retirado.

Torna-se cansativo e nada pratico, além de que não é muito recomendado para os navegadores.

3º - Esconde-se no CSS, com display:none e outras regras:

#HTMLXX h2 {
display:none;
height:0;
visibility:hidden;
}

Resulta, e é algo prático porque desta maneira podemos esconder elementos comuns a uma secção se for o caso, bastando para isso substituir #HTMLXX h2 por #NOME-DA-SECÇÃO h2.

A desvantagem neste método é que na verdade, os navegadores continuam a ler o elemento escondido/invisível. E isso em termos de carregamento das páginas não traz vantagens porque demora o mesmo tempo do que se o elemento estivesse visível.

Então qual o melhor método?

Bem, isso depende da situação e do que cada um quer fazer.

A minha maneira de retirar algo que não quero visível no blogue:

<b:widget id='HTMLXX' locked='false' title='QUALQUER_TITULO' 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>

Simplesmente coloco essa parte entre <!-- e -->, como demonstrado acima. ;)

Dessa maneira, o elemento continua disponível no HTML mas não será lido pelos navegadores.

E caso seja necessário que volte a estar visível, basta retirar <!-- e -->.

E podemos usar este método para qualquer elemento, por exemplo aquela mensagem quando navegamos pelas etiquetas que diz "Mostrando mensagens com a etiqueta tal...", se não quisermos que essa mensagem seja exibida basta colocar da seguinte maneira:

  <!--   <b:include data='top' name='status-message'/>  -->

Até Breve. :-F

Queres ler outro artigo ao calhas?