Como criar área de mostrar / ocultar no Blogger

Hoje vou ensinar um recurso que permite ocultar partes de um post e mostrá-las quando o leitor clicar em expandir (simbolo +). Pode-se esconder textos, imagens, vídeos e também pode ser utilizado para diminuir o tamanho do post quando tempos algo muito extenso dentro do artigo.

Para que possa fazer o mesmo no seu blog, é necessário seguir os passos abaixo. Em primeiro lugar vamos incluir algumas tags no código HTML do seu template para adicionar JavaScript.

1.Entre no Blogger > Design > Editar HTML.

2. Procure pela tag a seguir:

</head>

3. Acima dela cole o código abaixo:

<!-- Prototype y Scriptaculous-->
<script src='http://www.google.com/jsapi'/>
<script>
google.load(&quot;prototype&quot;,&quot;1.6.0.3&quot;);
google.load(&quot;scriptaculous&quot;, &quot;1.8.2&quot;);
</script>
<!-- Prototype y Scriptaculous-->

  IMPORTANTE: Se já tiver utilizado o código JavasScript acima, em outros Hacks (Mostrar/Ocultar Gadget HTML/JavaScript e Arquivo do Blog) não volte a adicioná-lo.

4. Clique em Pré-Visualizar/Visualizar, se tudo estiver no seu devido lugar, clique em Guardar/Salvar Modelo.

Agora sempre que quiser utilizar este hack nos seus artigos, adicione-lhes o seguinte código:

<a href='#' onclick='Effect.toggle("expandir1","slide"); return false'>[+/-] Mostrar/Ocultar</a><div id='expandir1' style='display: none;'>CÓDIGO A OCULTAR</div>

  NOTA: Tome em conta que deverá alterar expandir1 sempre que o utilizar no post, por exemplo, se utilizar 2 vezes em um post, o primeiro ficará expandir1 e o segundo ficará expandir2 e assim por diante.

  NOTA 2: Altere CÓDIGO A OCULTAR pelo código que deseja ocultar, seja uma imagem, um vídeo ou um texto. Qualquer elemento que tenha dentro de um artigo pode ser ocultado.

Agradecimento especial ao Manoel do blog Rascunhosblogger por ter permitido compartilhar este recurso também com vocês leitores.

Tweet

Share

Adriano Luz Pós-graduado em Sistemas de Informação e Banco de dados, atualmente atua com consultoria em sistemas, SEO e marketing digital. Amante por blogs, é responsável pela administração do blog Publicidade na web.

Postado em: Blogger / Blogspot,Dicas