Uma das coisas que mais gosto de ver em blogs são headers aleatórios que como o próprio nome indica, rodam de forma aleatória e sempre que o utilizador refresca a página que está a visualizar. Para quem utiliza blogs com headers bem definidos e de preferência rectangulares, como por exemplo no meu blog de ganhar dinheiro.
Para criar esta nossa aleatoriedade, vamos recorrer à função PHP rand() que nos permite escolher um número aleatório compreendido entre o 1 e o 99 (neste exemplo).
Se por exemplo o número for igual ou inferior a 33, será apresentada a primeira imagem. Superior a 33 ou igual/inferior a 66, apresenta a segunda imagem do nosso header, e o mesmo aplica-se para a terceira imagem que fica compreendida no 99. Obviamente que se quiser apresentar 4 deverá dividir 100 por 4, e por ai adiante.
Para apresentar a aleatoriedade, coloque o seguinte código no ficheiro header.php:
<?php
$result_random=rand(1, 99);if($result_random<=33){ ?>
<div id=”header” style=”background:transparent url(images/header1.png) no-repeat top left;”>
<?php }elseif($result_random<=66){ ?>
<div id=”header” style=”background:transparent url(images/header2.png) no-repeat top left;”>
<?php }elseif($result_random<=99){ ?>
<div id=”header” style=”background:transparent url(images/header3.png) no-repeat top left;”>
<?php } ?><!– Código do Header aqui –>
</div>
Bons truques!
Wagner Beethoven
Olá, gostaria de saber se estes códigos servem para qualquer outra parte do wordpress, claro que com as devidas mudança.
E gostaria de saber se há possibilidade de inserir isso, banner rotativo numa página de html, se não, tem como ensinar?
Forte abraço e parebs pelo trabalho!
Wagner Reis
Eu ia implementar isso, mais o visitante iria carregar 3 imagens, resolvi deixar um estatico mesmo
Wagner Beethoven
Mas por que não fez hein? custa nda pow carregar três JPG. Faz ai e da um up neste post, please e encima como fazer isso numa página em HTML.
In_darkness
Eu uso o Header Image Rotator
http://mhough.com/wordpress/2008/header-image-rotator-plugin/
Paulo Faustino
In_darkness, excelente recurso! Obrigado
Valter Simões
Paulo penso que o link do “ganhar dinheiro” está errado. O sitee para onde está apontar. Podes apagar este comentário já agora..
abraço amigo.
Paulo Faustino
Obrigado pela dica Valter. Já coloquei bem
Marcelo Mesquita
Boa dica Paulo… Se quiser uma versão mais compacta:
<?php $random = rand(1, x); ?>
<div id=”header” style=”background:transparent url(images/header<?php print $random; ?>.png) no-repeat top left;”></pre>
Onde x é o número de imagens que você quer alternar. Por exemplo, se você tem três cabeçalhos basta substituir o x por três.
Kleber
Boa tarde,
Meu tema é: cluttered office desk bue017
o Header.php
<html xmlns="http://www.w3.org/1999/xhtml" >
<meta http-equiv="Content-Type" content="; charset=” />
<script type="text/javascript" src="/script.js”>
<link rel="stylesheet" href="” type=”text/css” media=”screen” />
<link rel="alternate" type="application/rss+xml" title="” href=”" />
<link rel="alternate" type="application/atom+xml" title="” href=”" />
<link rel="pingback" href="” />
<a href="/”>
*******************************
Onde coloco esse código?
Onde coloco as imagens (em que pasta?)
Oque coloco em opções do tema para ele buscar a imagem?
Desculpe, sou leigo no assunto.
Conto com a colaboração de todos
Marcelo Mesquita
Wagner,
o visitante só irá carregar uma imagem, os scripts em php rodam no servidor e enviam para o cliente o html processado, ou seja, o cliente só vai carregar um dos cabeçalhos.
Abraço
Paulo Faustino
Olá Marcelo, muito obrigado por essa versão mais compacta. Muito interessante
Mariana C.
Oi, eu estou tentando utilizar este código, so que ao inves de trocar a aimagem de fundo header, eu preciso randomizar o background do wordpress…
CSS:
body {
color:#b6b6b6;
font:62.5%/1.6 Verdana,Tahoma,sans-serif;
line-height:1.5em;
background: #000 url(images/header.jpg) 50% top no-repeat;
ALGUEM PODE ME AJUDAR? =/
Ivanoel
Obrigado … muito boa dica … ja usei um pouco alterado num site meu em PHP.
Obrigado mais uma vez
Miguel Silva
Olá Paulo
Peço desculpa, afinal já tinha abordado este tema no blog e não tinha reparado.
Continuação de um bom trabalho.
Miguel Silva
Douglas Costa
Oi Paulo, boa tarde!
Procurando por um plugin para colocar background rotativo no blog acabei aqui. Sabe de algum código que pode fazer isso? Tipo colocar uns quatro ou cinco background, e a cada carregamento um novo fundo do blog é mostrado ao visitante?
Abraços