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:

ver código

imprimir?

01	<b:widget id='HTMLXX' locked='false' title='QUALQUER_TITULO' type='HTML'>

02	<b:includable id='main'>

03	<!-- only display title if it's non-empty -->

04	<b:if cond='data:title != &quot;&quot;'>

05	<h2 class='title'><data:title/></h2>

06

</b:if>

07	<div class='widget-content'>

08	<data:content/>

09

</div>

10

11	<b:include name='quickedit'/>

12	</b:includable>

13	</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:

ver código

imprimir?

1	<!-- only display title if it's non-empty -->

2	<b:if cond='data:title != &quot;&quot;'>

3	<h2 class='title'><data:title/></h2>

4

</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:

ver código

imprimir?

1	#HTMLXX h2 {

2	display:none;

3

height:0;

4	visibility:hidden;

5

}

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:

ver código

imprimir?

01	<b:widget id='HTMLXX' locked='false' title='QUALQUER_TITULO' type='HTML'>

02	<b:includable id='main'>

03	<!-- only display title if it's non-empty -->

04	<!-- <b:if cond='data:title != &quot;&quot;'>

05	<h2 class='title'><data:title/></h2>

06	</b:if> -->

07	<div class='widget-content'>

08	<data:content/>

09

</div>

10

11	<b:include name='quickedit'/>

12	</b:includable>

13	</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:

ver código

imprimir?

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

Até Breve.

Queres ler outro artigo ao calhas?