Exibir frases aleatórias no Blogger

Exibir frases aleatórias no Blogger

6 10 99
Exibir frases aleatórias no Blogger 10 6 99
Um gadget que eu acho muito bacana, é aquele que permite-nos exibir frases aleatórias nas páginas de nossos blogs. Isso significa que a cada vez que as páginas forem carregadas, uma nova frase será mostrada ao visitante.


Para colocar esse gadget, é super simples. Entre em "layout"  e clique em "adicionar gadget". Escolha o gadget "html/javascript" e cole o código abaixo:

<div style="border-left: 5px solid #ccc; padding:6px; font-style: italic; ">
<script language="JavaScript">
citas = new Array(4)
citas[0] = "FRASE 0 "
citas[1] = "FRASE 1"
citas[2] = "FRASE 2"
citas[3] = "FRASE 3"
citas[4] = "FRASE 4"
aleatorio = Math.random() * (citas.length)
aleatorio = Math.floor(aleatorio)
document.write(citas[aleatorio])
</script></div>
Onde está escrito FRASE, substitua pelas frases que você deseja exibir em seu blog. É possível colocar quantas frases quiser; para tanto repita a seguinte linha:
citas[0] = "FRASE 0 "
Substitua [0] pelo número subsequente, ou seja, 4, 5, 6 e assim sucessivamente.
Para mudar a o tipo de borda, cor de fundo e etc, é só alterar o CSS desta outra parte:
border-left: 5px solid #ccc; padding:6px; font-style: italic;
Vejam um exemplo que encontra-se em um outro blog meu:
 Para colocar a borda em todo o espaço, use o código assim:
 <div style="border: 5px solid #ccc; padding:6px; font-style: italic; ">
<script language="JavaScript">
citas = new Array(4)
citas[0] = "FRASE 0 "
citas[1] = "FRASE 1"
citas[2] = "FRASE 2"
citas[3] = "FRASE 3"
citas[4] = "FRASE 4"
aleatorio = Math.random() * (citas.length)
aleatorio = Math.floor(aleatorio)
document.write(citas[aleatorio])
</script></div>
 A parte que assinalei em vermelho é a da cor. Para trocá-la é só usar uma tabela de cores. A parte assinalada em azul se refere à espessura da borda.
23 Comments
Comments
  1. É muito bom esse script, já uso faz tempo.

    ResponderExcluir
  2. Gostei da dica ! Eu já usava um script parecido, mas que não dá nenhuma opção de personalizar com itálico, negrito, o que eu consegui fazer com este. Irei substituir no meu blog ! obrigado !!

    ResponderExcluir
  3. Dica ótima, ainda mais pra quem adooora uns frufrus como eu :DD

    Boa semana Juliana, beijo!

    ResponderExcluir
  4. Uma dica realmente muito boa, um script curto e simples que funciona perfeitamente.

    Recomendo!

    ResponderExcluir
  5. Legal, adorei da dica! Uma dúvida: como faço para forçar a mudança das frases, utilizando um temporizador e de forma automática, durante o tempo em que um visitante estiver no blog?

    ResponderExcluir
  6. é possivel ao inves da frase inserir uma imagem?
    abraço

    ResponderExcluir
    Respostas
    1. Dá! Você tem que criar um array de pré-carregamento de imagens e colocá-las para serem exibidas no lugar das frases. Eu uso exatamente um script desse num dos meus blogs, mas agora não lembro qual é o código! Meu JS está enferrujado :s

      Excluir
  7. Obrigado por esta dica de gadget! Já se encontra no meu blog e gostei!
    Continuação do óptimo trabalho que vem desenvolvendo!

    ResponderExcluir
  8. Muito bom esse gadget, estou utilizando :)

    ResponderExcluir
  9. Não apareceu as frases que eu coloquei no meu.

    ResponderExcluir
    Respostas
    1. Aparentemente ele não aceita enter(mudar de parágrafo) nas frases.Deixe as frases em parágrafo simples. Acho que pode ser isso.

      Excluir
  10. Gostaria de saber se tem como fazer isso com popup? To com uma ideia aqui pra fazer no meu e usar pequenos popups no canto da tela, sem que polua visualmente o blog e informe o usuário curiosidades políticas.

    ResponderExcluir
    Respostas
    1. Oi!
      Não sei como fazer com popup, mas veja como fiz no meu blog. Modifiquei um pouco o código para escolher onde as frases ficam e o estilo. O meu ficou assim;
      @b:if cond='data:blog.url == data:blog.homepageUrl'@
      @div style="position: absolute; margin-top: 0px; left: 0px;"@
      @div style=";border: 0px solid #000;padding-left:110px; padding-right:265px ; color:#FFFAFA; font-family:Monotype Corsiva;font-size:20px;font-style: normal; "@

      @script language="JavaScript"@ ( a partir daqui ficou igual)
      (troque @ por <,> os comentários não aceita html)

      Modifique margin-top e left para escolher em que local da sua página as frases vão ficar, se necessário use negativo pois a posição é dada a partir da localização da caixa do gadget no menu .
      Também acrescentei os códigos para escolher o tipo, cor e tamanho da fonte.
      O padding (preenchimento) que é o espaço entre o texto e a caixa eu mudei para padding-left e padding-right assim fica mais fácil de controlar as mudanças de linhas das frases.
      Como o fundo do seu blog é branco, acho que colocando a borda pra dá impressão de caixa já fica bom.
      Não sei se isso serve para o que você queria fazer, mas espero ter ajudado!
      Parabéns a autora do blog pela dica!

      Excluir
  11. Eu tinha um script no meu blog que apresentava, a cada acesso, um poema diferente originado de um site. Perdi este script. Você poderia me informar como faço para ter novamente esta opção no meu blog.

    Grato pela atenção´

    J L Silva

    ResponderExcluir
  12. Estou procurando um código que exiba a frase de acordo com o dia da semana Por acaso alguém sabe onde o posso encontrar?

    ResponderExcluir

ATENÇÃO: Caso esteja com dificuldades com seu blog, abra um tópico no Fórum de Ajuda do Blogger que nós iremos te ajudar a resolver.


Os comentários passam por um sistema de moderação. Não serão aprovados os comentários:
- não relacionados ao tema do post;
- com pedidos de parceria;
- com propagandas (spam);
- com link para divulgar seu blog;
- com palavrões ou ofensas a pessoas e marcas;

 
Dicas Blogger© 2007-2015 | Todos os direitos reservados | Design By Duy Templates
Top