Como inserir uma galeria de fotos em seu blog wordpress
Você pode usar a janela do WordPress Insert mídia para inserir uma galeria de fotos completa em seus posts. Carregar todas as suas imagens e, em seguida, em vez de clicar Inserir em botão Post, clique no link Criar Gallery no lado esquerdo da janela Inserir mídia. A janela Criar Gallery abre e exibe todas as imagens que carregou para o seu site.
Siga estes passos para inserir uma galeria de fotos em um post no blog:
Na janela Criar Gallery, selecione as imagens que deseja usar em sua galeria.
Clique em cada imagem uma vez para selecioná-lo para uso na galeria. A imagem selecionada exibe uma pequena marca de verificação no canto superior direito.
Clique no botão Criar nova galeria.
A página Editar Gallery abre.
(Opcional) Adicionar uma legenda para cada imagem clicando na Caption This área de Imagem e digitando uma legenda ou breve descrição para a imagem.
(Opcional) Definir a ordem das imagens aparecem na galeria usando a opção de arrastar-e-soltar na página Editar Gallery.
Clique e arraste e solte imagens para alterar a ordem.
(Opcional) Especifique as seguintes opções na seção Configurações Galeria no lado direito da página Editar Gallery:
Link para: Arquivo de mídia ou de anexos página.
Aleatória Ordem: Seleccione para embaralhar a ordem em que as imagens são exibidas na galeria.
Colunas galeria: Selecione quantas colunas de imagens que você deseja que apareça em sua galeria.
Clique no botão Inserir Gallery.
WordPress insere em seu post um pedaço de shortcode que se parece com isso:.
(Opcional) Altere a ordem de apresentação das imagens na galeria, assim como a marcação (tags HTML ou seletores CSS).
Use a galeria WordPress shortcode para mudar diferentes aspectos da exibição da galeria em seu post:
captiontag: Alterar a marcação que rodeia a legenda da imagem, alterando a galeria shortcode. Por exemplo, coloca as tags em torno da legenda da imagem. (A marca é considerado um elemento de nível de bloqueio e cria um recipiente separado para o conteúdo.)
Se você quer ter a galeria aparecer em uma linha própria, o código coloca etiquetas em torno da legenda da imagem. A marcação padrão para o captiontag opção é dd.
icontag: Define a marcação HTML ao redor de cada imagem em miniatura individual em sua galeria. Alterar a marcação ao redor do (ícone de miniatura) icontag da imagem, alterando a galeria shortcode para algo como, o que coloca as tags em torno de cada ícone de miniatura. A marcação padrão para icontag é dt.
itemtag: Define a marcação HTML em torno de cada item em sua galeria. Alterar a marcação ao redor do itemtag (Cada item) na galeria, alterando a galeria shortcode para algo como, o que coloca as tags em torno de cada item da galeria. A marcação padrão para o itemtag é dl.
ordenar por: Define a ordem em que as imagens são exibidas em sua galeria. Alterar a ordem usada para exibir as miniaturas na galeria alterando a galeria shortcode para algo como, que exibe as miniaturas na ordem de menu ascendente. Outro parâmetro que você pode usar é ID_order ASC, que exibe as miniaturas em ordem crescente de acordo com suas identificações.
Galeria de código curto | Saída |
---|---|
A galeria de quatro colunas contendo imagens médias | |
A galeria de dez coluna contendo imagens em miniatura puxado o post com o ID 215 | |
Uma galeria de três colunas (padrão) em que cada imagem é cercada por tags e a legenda da imagem é cercada por tags |
Defina o estilo do marcas em sua folha de estilo CSS.
o Tags Criar um elemento inline. Um elemento contido dentro de um tag permanece na mesma linha que o elemento antes ele- não há nenhuma quebra de linha. Você precisa de um pouco de conhecimento de CSS para alterar a Tag. Clique na aba Design no seu WordPress Dashboard e, em seguida, clique na sub-seção Theme Editor para editar a folha de estilo para seu tema.
Aqui está um exemplo do que você pode adicionar à folha de estilo (style.css) Para o seu tema atual:
span.gallery-icon img {padding: 3px; background: white-border: 1px solid black-margin: 0 5px;}
Colocar este pouco de CSS na folha de estilo (style.css) Do seu tema ativo automaticamente coloca uma borda preta de 1 pixel em torno de cada miniatura, com 3 pixels de preenchimento e um fundo branco. As margens esquerda e direita estão 5 pixels de largura, criando bom espaçamento entre as imagens na galeria.
Clique no botão Atualizar Arquivo para salvar alterações ao seu estilo (style.css) modelo.
A figura mostra um post com uma galeria de fotos exibidas, utilizando as etapas anteriores e exemplo CSS no padrão WordPress tema: Vinte doze.
Matt Mullenweg, co-fundador da plataforma WordPress, criou uma galeria de fotos muito extensa, usando as opções galeria built-in no WordPress. Confira esta galeria de fotos fabuloso.