Modelos

27 Layouts de portfólio

Grades e masonry. Estilos de filtro e de carregamento. Além dos layouts de projeto individual que servem de base para eles.

Atualizado em

Grades 5

Cada grade aqui é um único bloco Canvas Posts com Layout definido como Portfolio. Columns define quantos projetos dividem uma linha, e Portfolio Gutter define o espaço entre eles, podendo chegar a zero. A versão de uma coluna ativa Alternating Split Cards, então cada projeto fica ao lado da sua descrição e a imagem troca de lado a cada dois cards.

Masonry 6

Mesmo bloco, Grid Engine diferente. Escolha um modo masonry e os cards mantêm as próprias alturas, encaixando em colunas, sem linhas de grade a respeitar. A Card Shape define o ritmo: corte cada imagem em um único formato ou deixe cada projeto manter o seu. A versão mista também move o título para dentro da sobreposição ao passar o mouse.

Estilos de carregamento 5

Essas opções definem como o visitante chega ao restante do seu trabalho. Estilo de paginação oferece um paginador no lado do cliente e rolagem infinita entre as opções. Abrir projetos na própria página carrega um projeto acima da grade sem sair da página, e Abrir projeto em pode exibi-lo em um modal lightbox. Estilos de filtro configura o bloco Canvas Grid Filter, a linha de botões de categoria, em cada um dos seus estilos, com e sem um botão Shuffle.

Projeto único 5

Uma página de projeto recebe o layout de um modelo que você escolhe na configuração Modelo enquanto edita o projeto. Os modelos cobrem quatro tipos de mídia: uma imagem grande, um slider de galeria, uma grade de miniaturas e um vídeo. Cada um vem com uma barra lateral de um lado ou dos dois, em largura total, ou abaixo de um hero em largura total. As páginas vinculadas aqui são uma amostra desse conjunto.

Layouts 6

Onde a grade fica na página. As versões com barra lateral colocam o mesmo bloco em uma coluna principal, ao lado de uma barra lateral com widgets, como posts recentes e um formulário de contato rápido. A opção 100% de largura estende a grade de borda a borda, sem espaçamento entre colunas. A opção Parallax ativa o Parallax Cards, que transforma cada imagem em uma camada de fundo que se move conforme a página é rolada.

Cada link abre uma página real na vitrine ao vivo, criada pelo mesmo tema e pelos mesmos blocos que você instala.

No seu próprio site

Crie qualquer um destes a partir de um único bloco

A vitrine está aí para ser vista. Os blocos e modelos por trás dela vêm com o Canvas, então cada layout acima pode ser recriado no seu site.

Projetos são registros

Seus trabalhos ficam no tipo de conteúdo de portfólio, com um registro por projeto, e com categorias que o Grid Filter lê para criar os botões. Adicione um projeto e toda grade do site que lista essa categoria o exibe automaticamente. A própria página nunca precisa ser editada.

A grade é controlada por configurações

Insira Canvas Posts, escolha o layout Portfolio e, em seguida, percorra os painéis Layout e Paginação usando os nomes desta página. Na própria página do projeto, o Canvas adiciona 8 blocos de portfólio, do título e da lista de metadados até os projetos relacionados.

Ou importe um site pronto

21 dos 88 sites de demonstração são importados com projetos de portfólio já no lugar, montados para uma agência, um fotógrafo ou um ilustrador. Comece por um deles e edite os projetos, não o layout.

Todos os planos, todos os layouts

Não há complemento de portfólio. As grades, o filtro, os estilos de carregamento e os modelos de projeto individual estão no Anual, assim como no Vitalício, porque todo plano inclui todos os blocos.

Como escolher

Qual layout de portfólio combina com o seu trabalho

Comece pelas imagens, já que o layout existe para mostrá-las. Fotografias feitas em uma mesma orientação combinam bem em uma grade ajustada, onde as linhas se alinham. Um mix de trabalhos em retrato e paisagem pertence ao masonry, onde cada cartão pode manter o formato da sua imagem.

Estudos de caso são apresentados de outra forma. Quando cada projeto precisa de um parágrafo de contexto, a grade de uma coluna com cartões divididos oferece espaço para isso, e uma versão com barra lateral funciona para uma agência que quer deixar os dados de contato ao lado dos trabalhos.

Conte seus projetos também. Um conjunto pequeno de trabalhos cabe em uma única tela com um filtro acima. Quando passar de algumas linhas, escolha um estilo de carregamento para que a página continue rápida: o paginador para visitantes que gostam de saber onde estão, a rolagem infinita para quem gosta de navegar. Para um projeto único, escolha o modelo primeiro pela mídia: um slider de galeria para um ensaio ou um vídeo para um filme, e decida sobre as barras laterais por último.

Comece com uma página pronta

Todos os 141 layouts estão incluídos em todos os planos, junto com todos os blocos e todos os sites de demonstração.