23 de fevereiro de 2014

Paginação PHP 2

No tutorial anterior sobre Paginação PHP aprendemos de uma forma bem simplificada a criação de um script de paginação. Vamos agora estender um pouco mais nosso código e incluir a opção dos botões anterior e próximo para tornar a navegação mais dinâmica.

Utilize o mesmo código e altere a parte do código abaixo do comentário: //exibe a paginação por esse:

//exibe a paginação
if($pagina > 1) {
    echo "<a href='index.php?pagina=".($pagina - 1)."' class='controle'>&laquo; anterior</a>";
}

for($i = 1; $i < $numPaginas + 1; $i++) {
    $ativo = ($i == $pagina) ? 'numativo' : '';
    echo "<a href='index.php?pagina=".$i."' class='numero ".$ativo."'> ".$i." </a>";
}
    
if($pagina < $numPaginas) {
    echo "<a href='index.php?pagina=".($pagina + 1)."' class='controle'>proximo &raquo;</a>";
}

Note que temos agora dois condicionais IF, um no começo que verifica se a página atual é maior que 1 e outro no final que verifica se a página atual é menor que o número de páginas.

Também incluímos uma nova variável chamada $ativo que verifica qual a página ativa no momento e insere uma classe para podermos estilizar o CSS e destacar a página atual. E já que estamos fazendo esta inclusão de classe, segue um código pronto para ser inserido como estilo da página:

<style>
	.numero{
		text-decoration: none;
		background: #2A85B6;
		text-align: center;
		padding: 3px 0;
		display: block;
		margin: 0 2px;
		float: left;
		width: 20px;
		color: #fff;
	}
	.numero:hover, .numativo, .controle:hover{
		background: #1B3B54;
	}
	.controle{
		text-decoration: none;
		background: #2A85B6;
		text-align: center;
		padding: 3px 8px;
		display: block;
		margin: 0 3px;
		float: left;
		color: #fff;
	}
</style>

Espero que seja útil pra você.

Um abraço e até o próximo tutorial.

Visualizações: 16.601



Sérgio Toledo | Full-Stack Web Developer | LinkedIn | GitHub | YouTube

Todos os direitos reservados ©