Category Archives: Plugins

Nivo Slider For WordPress

Posted on by
93

DOWNLOAD: http://wordpress.org/extend/plugins/nivo-slider-for-wordpress/

NivoSlider for WordPress é baseado no plugin S3Slider desenvolvido por Vinicius Massuchetto, adaptado para a sua utilização JQuery plugin NivoSlider.

COMO USAR:

Adicionar imagem

Adicionando imagem:
Para adicionar uma nova imagem no seu slider, clique no botão Adicionar nova imagem, em seguida, selecione a imagem desejada (são suportados JPG, PNG e GIF) e clique no botão enviar e editar imagem.

Configurações da imagem:
Depois que a imagem foi enviada, defina a área de recorte e escreva abaixo a legenda e no link da imagem, se desejar.

Editando imagem:
Para editar a imagem depois de já definida suas configurações, clique no link Editar ao lado da coluna da legenda.

Excluindo imagem:
Para excluir a imagem, clique no link Remover ao lado da coluna da legenda.

Alterando a ordem de apresentação das imagens:
Para definir a ordem de apresentação das imagens, clique na linha da imagem desejada e arraste para cima ou para baixo até a ordem das imagens ficar como deseja.

Opções

Tamanho do recorte (será também o tamaho do slider):
Esta opção define a largura e altura em pixels nos campos correspondentes. Essa será as dimensõ;es do slider e do recorte da imagem após o upload da mesma.

Importante: caso altere essas dimensões depois de já ter inserido alguma imagem, terá que recortar as imagens novamente, para que elas se adequarem as dimensões definidas.
Configurações do Nivo Slider:

Efeitos de transição:
Selecione um dos efeitos para alterar a transição entre cada imagem.

Velocidade da transição do slide:
Velocidade em que será mostrada a transição escolhida.

Tempo de pausa entre as transições:
Tempo que uma imagem do slider ficará sendo mostrada, até que acontçaa a transção para a próxima.

Setas de navegação:
Se esta opção estiver habilitada, o uso das setas para avançar ou voltar a passagem das imagens no slider aparecerão.

Mostrar as setas de navegação somente quando o mouse estiver sobre o slide:

Se esta opção estiver habilitada, as setas de navegação só irão aparecer quando o cursor do mouse estiver sobre o slider.

Mostrar navegação por “bullets”

Se esta opção for ativada, o usuário pode avançar ou retroceder as imagens utilizando os bullets abaixo do slider

Usar esquerda & direita no teclado:
Se esta opção estiver habilitada, o usuário poderá avançar ou voltar as imagens do slider pelas setas de navegação esquerda (←) e direita (→) do teclado.

Parar a animação enquando o mouse estiver sobre o slide:
A animação (transições e legenda) não irão acontecer enquanto o mouse estiver sobre do slider.

Forçar transição manual:
Se esta opção estiver habilitada, as transições não acontecerão de forma automática.

Cor de fundo da legenda:
Altera a cor de fundo da legenda de todas as imagem do slider. Para alterar a cor clique no botão ao lado do campo de texto, e selecione a cor desejada no seletor de cor.

Cor do texto da legenda:
Altera a cor do texto da legenda de todas as imagem do slider. Para alterar a cor clique no botão ao lado do campo de texto, e selecione a cor desejada no seletor de cor.

Opacidade do fundo da legenda:
Altera a transparência do fundo da legenda de todas as imagem do slider. Digite o valor desejado dentro de uma escala de 0.0 à 10.0, por exemplo, 0.3.

Opções Avançadas

Qualidade da imagem:
Coloque um value entre 0 a 100 para definir a qualidade do recorte das imagens. A qualidade varia de 0 (qualidade ruim, arquivo menor) até 100 (melhor qualidade, arquivo grande). O padrão é 80.
Inserir JavaScript:
Selecione uma das opções, head ou footer, para definir onde será carregado os scripts Jquery do Plugin Nivo Slider. Recomenda-se carregar o JavaScript no footer, pois permite que uma página de carregamento mais rápido, porém o slider é carregado por último.

Usando o Slider no seu Tema:

Para adicionar o Slider no seu tema basta colocar o seguinte codigo:

if (function_exists(nivoslider4wp_show())) { nivoslider4wp_show(); }

Screenshots:

Painel para adicionar e configurar as images:

Painel de configuração do Nivo Slider

Nivo Slider em ação!

Nota:

O plugin está disponivel em Inglês e Português, porém vou ser sincero e falar que meu inglês é muito ruim ainda, então se alguem achar alguma “bizarrisse”, peço desculpa, favor me avise para eu corrigir nas próximas versões ;D.

GitHub:

Se quizer contribuir para o desenvolviemento do plugin pode usar a página no github:https://github.com/marcelotorres/Nivo-Slider-for-WordPress.

Tradução:

  • hungarian by Németh Balázs

Agradecimentos:

Agradeço pelos testes e sugestões: