Ocultar trechos do post- botão spoiler simplificado! - Elaine Gaspareto- Dicas para blogs e inspirações para a vida

Ocultar trechos do post- botão spoiler simplificado!

Publicado em 26/08/2019

Ocultar trechos do post- botão spoiler simplificado!
Tempos atrás eu ensinei aqui no blog um botão muito legal que oculta parte do post, ideal para quem quer dar ao leitor a opção de ler ou não um spoiler de série, livro, filme, etc...
Recorde:


Funciona, mas é trabalhoso.
Aí achei esse código mega antigo, que faz um trabalho semelhante, muito mais simples e básico.
Veja:


CLIQUE NA SETINHA PARA EXPANDIRAqui vai o texto que você deseja ocultar.
Pode incluir imagens, aliás:

Não é legal? Simples mas funciona e é muito mais fácil de usar!
Vamos aprender?


Como usar o botão Ocultar nos posts do blog


Copie o código:

Copiar o código


Clique em HTML, no alto do editor de postagens.
Essa ação vai reverter o seu post para o modo HTML.
Cole o CÓDIGO DO BOTÃO OCULTAR e no campo marcado escreva o trecho que deseja ocultar.
Pode adicionar imagens, se desejar.
Terminou?
Clique em Escrever, no alto do editor de postagens, e termine seu post normalmente.
Publique como está acostumada e pronto!

Explicando o código:
O código que disponibilizei é assim:

<details>
<summary>CLIQUE NA SETA PARA VER O TEXTO OCULTO</summary>
Aqui vai o texto que você deseja ocultar.
</details>

O trecho CLIQUE NA SETA PARA VER O TEXTO OCULTO pode ser modificado, escreva o que desejar.
Em Aqui vai o texto que você deseja ocultar. escreva, claro, o texto que desejar.
O lance é manter as divs que comandam o botãozinho: summary e details.
Não as apague, nem as que abrem e nem as que fecham. São essas divs que fazem a mágica acontecer.
Entendeu?

Tem um porém: não funciona no Explorer/Edge.
No Firefox, no Chrome, no Vivaldi, Opera e Safari funciona sem erros.
No smartphone Android também.
Não testei no Iphone, testa aí e me diz :)

Ah, diferentemente do botão Ocultar spoilers que havia ensinado anteriormente, essa versão simplificada dá pra usar mais de um por post.
Veja o exemplo abaixo, onde usei o recurso para criar uma lista:






O que é blog? Blog é um termo que se originou e se popularizou graças a internet. A palavra tem origem na língua inglesa e trata-se de uma forma simplificada da expressão original weblog.

Weblog surge com a junção dos termos web, que significa rede, e log, que é um termo que advém da área da informática e designa os registros das atividades do computador ou de seu desempenho.



Quem pode ter um blog?Toda e qualquer pessoa pode ter um blog, basta querer!




Quanto custa ter um blog? Se você optar pelo Blogger é totalmente de graça. O único custo é o registro de domínio personalizado, caso queira. Mas não é indispensável.




O que eu posso escrever em um blog?
Há blogs de todo e qualquer assunto, de comida a beleza, de tecnologia a maternidade. Blogs literários, blogs pessoais, com assuntos variados e infindáveis. Escreva sobre o que desejar, sobre o que gostar, sobre sua paixão!




É possível ganhar dinheiro com o blog?
Sim, é. Um blog bem feito, bem escrito e que consiga atrair um tráfego bom pode lucrar com anúncios via Adsense, com divulgações de produtos e serviços, com publicidade direta e com programas de afiliados. O tráfego é o segredo. E para ter bom tráfego um blog feito com capricho e dedicação é o caminho.




Dá pra usar de formas diversas, né?
Simples e funcional, a gente ama?
Sim!






Um comentário

Olá! Muito obrigada por ler meu blog e obrigada também por se dispor a comentar meus posts. Seja muito bem-vindo(a)!

Importante!
Devido à falta de tempo hábil eu não me comprometo a responder perguntas referentes aos tutoriais postados neste blog.
Pedidos de ajuda individual serão respondidos conforme o meu tempo e disponibilidade permitirem.
Deixe sua pergunta ou solicitação sempre nos comentários, eu infelizmente não tenho como responder pedidos de ajuda por email.
Por favor, entenda: comentários sem relação alguma com o post não serão liberados e nem respondidos.

Para saber mais sobre a melhor forma de utilizar este blog leia Termos de uso do blog.



Muito obrigada, fique à vontade para interagir.
Mas lembre-se:
Gentileza, educação e boas maneiras servem também para a vida nos blogs…