Você deseja adicionar conteúdo de várias colunas às suas postagens do WordPress?
As colunas podem ser usadas para criar Layouts atraentes para suas publicações e páginas.
A mídia impressa tradicional, como jornais e revistas, tem usado um layout de várias colunas desde os primeiros dias da impressão. Seu objetivo era permitir usuários É mais fácil ler um texto menor enquanto utiliza o espaço disponível economicamente.
Se você ainda não criou um site ou blog no WordPress, convidamos você a consultar Como instalar um blog WordPress em 7 etapas a seguir, Como encontrar, instalar e ativar um tema WordPress em seu blog
Layouts de coluna única são mais comumente usados na web. No entanto, o grids com várias colunas ainda são úteis para destacar o conteúdo e facilitar a leitura e análise.
Neste tutorial, mostraremos como adicionar facilmente conteúdo com várias colunas às suas postagens do WordPress sem escrever nenhum código HTML.
Adicionando conteúdo com várias colunas no WordPress - a solução fácil
A criação de conteúdo com várias colunas, também conhecido como conteúdo de grade no WordPress, agora é simples porque é um recurso padrão. o novo editor de blocos WordPress Gutenberg propõe um bloco de colunas.
Para adicionar um layout de várias colunas, você precisa criar uma nova postagem ou editar uma. Uma vez na área de edição, clique no botão " adicionar No topo para adicionar um bloco.
Então você tem que selecionar o bloco Colunas "Localizado na guia" Elementos de layout ".
Você verá o ponteiro do mouse pular na coluna da esquerda e um espaço reservado para o texto aparecerá na coluna da direita.
Como você pode ver na imagem acima, o bloco Coluna à primeira vista parece ser uma área vazia. Se você passar o mouse para a esquerda, poderá ver a borda do bloco destacado.
Você também poderá ver os parâmetros do bloco na coluna direita da tela.
Por padrão, o bloco de colunas adiciona duas colunas. Você pode aumentar o número de colunas que deseja adicionar nas configurações de bloco à direita. Isso permite adicionar até seis colunas em uma única linha.
Basta clicar em uma coluna e começar a digitar para adicionar conteúdo. Você pode usar a tecla Tab no teclado para passar para a próxima coluna.
Adicionando conteúdo multimídia e outros às suas colunas
Além do conteúdo de texto, você também pode adicionar imagens e incorporar vídeos em colunas do WordPress.
Bloco de coluna permite adicionar blocos dentro de cada coluna. Basta passar o mouse sobre uma coluna e você notará o "Adicione um novo blocoDentro. Você também pode adicionar um bloco digitando o nome do bloco.
O bloco selecionado aparecerá na coluna. Você pode ir lá e adicionar conteúdo.
Para fazer upload - upload - de sua mídia, descubra nosso artigo sobre Como fazer o upload de sua mídia em massa no WordPress
Esta é a aparência da sua nova coluna no tema WordPress padrão Vinte Dezenove. Neste exemplo estamos usando três colunas e a última coluna contém uma imagem.
Se você deseja adicionar apenas uma imagem e texto ao lado, também pode usar o bloco Mídia e texto Em vez de colunas. Este bloco foi projetado especificamente para exibir mídias, como imagens e vídeos, ao lado do texto.
Adição de várias colunas no editor clássico de WordPress
Se você não atualizou o WordPress para Gutenberg e ainda está usando oeditor clássicovocê precisa instalar um plug-in separado para criar um layout de grade de colunas.
Comece instalando e ativando o plugin Colunas de grade leve.
Para obter instruções detalhadas, siga nosso guia passo a passo sobre como instalar um plugin no WordPress.
Após a ativação, você pode criar uma nova mensagem ou abrir uma mensagem antiga para editar. Em seguida, clique no botão " Adicionar colunas Na barra de ferramentas do editor visual.
Você verá agora uma janela pop-up que permite adicionar sua primeira coluna. Você pode escolher quanta área sua coluna pode cobrir, em desktops, tablets e dispositivos móveis de forma diferente.
Vá além descobrindo Como criar uma largura de página inteira no WordPress
Por exemplo, se você definir a porcentagem de grade da área de trabalho 50%, sua coluna cobrirá metade da linha.
Tem muitas opções para definir a largura da sua coluna, de 5% a 100% com um intervalo 5. Você pode escolher um clicando no menu suspenso.
Em seguida, você deve adicionar o conteúdo de sua coluna na área "Conteúdo", a seguir clicar no botão "OK" para inseri-lo em sua publicação.
O plugin irá gerar o shortcode necessário com o seu conteúdo e adicioná-lo ao seu editor de postagem.
Descubra neste tutorial Como instalar e configurar o plugin WP Super Cache para melhorar o desempenho do seu blog.
Agora que sua primeira coluna foi adicionada, você pode repetir o processo para adicionar mais colunas. Para a última coluna, não se esqueça de marcar a caixa 'Última coluna da linha'.
Depois disso, você poderá salvar e visualizá-la. Aqui está o que parece no nosso site de teste dos Twenty Seventeen.
Se você também deseja encontrar temas do WordPress que podem ajudá-lo a criar colunas em suas páginas ou publicação, aqui estão os temas do WordPress 3 premium perfeito para esta tarefa.
1. TheGem
Há muitos Temas do WordPress que pode alegar oferecer um layout OnePage, mas nenhum pode oferecer a riqueza de opções e recursos que o modelo TheGem WordPress possui.
Todos os elementos de design que você associa a um bom site OnePage estão presentes neste tema WordPress : um controle deslizante de tela inteira (que pode ser criado usando o plugin Revolution Slider fornecido com o tema WordPress), uma escolha de seis estilos de cabeçalho e a capacidade de criar seções de largura total usando o plugin Visual Composer incluído no pacote.
Além disso, possui várias opções de personalização para itens como fontes, cores e ícones. É uma coisa rara, mas também há detalhes que não gostamos no TheGem. Mas basicamente é um tema WordPress que irá atender você, é claro, dado o número de pontos positivos que ele tem. É um forte concorrente, o que facilitaria a criação de um site OnePage.
Descarregar | Demo | hospedagem na web
2. Estocolmo
Estocolmo é um tema WordPress projetado para ajudá-lo a criar o site de uma empresa de construção, engenharia civil ou qualquer empresa relacionada ao mundo da reforma de edifícios. este Modelo WordPress é voltado para profissionais que se preocupam com qualidade e detalhes.
Vem com um painel de opções e um back-end amigável, eles permitem que você gerencie facilmente seu conteúdo. Existem cerca de 20 demos deste modelo apresentando uma ampla gama de atividades nas quais este tema WordPress pode ser usado. E também podem ser usados como base para futuras personalizações, para que seu site tenha um visual único.
Muito responsivo, é exibido perfeitamente em qualquer tipo de tela. Se durante a personalização ou instalação deste modelo, você encontrar dificuldades, a documentação completa incluída no pacote poderá servir como um guia. E se você ainda não pode, o suporte dedicado a esse tema WordPress permanece à sua disposição.
Descarregar | Demo | hospedagem na web
3. Júpiter
Júpiter é outro tema WordPress muito popular. Possui demos 25 que cobrem o 6 de nossas categorias - agência, criativo, educação, dieta, saúde e comércio eletrônico - e mais serão adicionados a ele em futuras atualizações. A maioria de seus layouts tem um design minimalista, com uma tipografia agradável.
Um dos principais pontos de venda de Júpiter é o Creative Header Customizer, que permite personalizar de forma rápida e fácil o design dos cabeçalhos do seu site. O Visual Composer, os controles deslizantes 3 (Layer, Revolution e iCarousel), os novos códigos de acesso 10, mais de ícones do 1800 e os tipos de postagem personalizados do 10 estão incluídos na entrega.
Seus tempos de carregamento de página também são excelentes. Este é um produto excelente, e você terá dificuldade em encontrar tantos Temas do WordPress tendo suas características.
Descarregar | Demo | hospedagem na web
Outros recursos recomendados
Para ir mais longe na otimização do seu blog ou site, sugerimos também que consulte alguns links que o farão mergulhar no mundo de Gutenberg
- Como preparar seu site para Gutenberg
- Como sei se o seu plugin é compatível com o Gutenberg?
- Will Gutenberg melhorará ou quebrará o WordPress?
Conclusão
Aqui ! É isso para este tutorial. Esperamos que este artigo tenha ajudado você a aprender como adicionar colunas às suas postagens e páginas do WordPress. sinta-se livre para compartilhe este tutorial com seus amigos em suas redes sociais.
Se você tiver sugestões ou comentários, eles serão bem-vindos. Mas se você é iniciante, convidamos você a consultar nosso Ressources.
...
Olá, tenho este plug-in…. mas não funciona bem, acontece:
Estou criando duas colunas, uma menor para a foto, outra maior para o texto, de modo que o texto tenha apenas 2 linhas, não na altura total da coluna, ao salvar o texto JUMP abaixo da foto, em vez de fique acano, veja se uma coluna desaparece ...
O que eu faço? por que isso está acontecendo, há outro plg-in melhor e mais simples do que este aqui?
Obrigado, ficaria muito grato pela ajuda!
Olá Irina
Tente ativar o tema padrão do WordPress. Se tudo funcionar bem, o problema está no seu tema atual do WordPress.
Verifique também se você fez atualizações de plugins.
Tudo o que posso dizer é que este é Geniale.
ele funciona muito bem e ca responde a todas as minhas expectativas.
graças nombreu (BCP)
Bom Dia,
Muito obrigado que bom
Como adicionar cor a minha coluna?
Mercii
Bom Dia,
você pode fazê-lo usando um CSS personalizado.
Bom Dia,
Não consegui colar texto em uma coluna. É possível ?
Bom Dia,
como você procederia?
Copiei algum texto e tentei colar por CRTL + V, sem sucesso. O menu de contexto com o clique direito não oferece para colar.
Não encontrei outra solução senão redigitar tudo ...
Desculpe pelo atraso na resposta.
Você pode garantir que, ao clicar com o botão direito em outro elemento da página, o menu de contexto seja exibido? Em caso afirmativo, provavelmente há um problema de JavaScript com sua hospedagem.
Se você estiver no Google Chrome, vá para a página em questão onde está o problema, pressione a tecla "F12" (uma janela será aberta ou será anexada à página) e escolha a guia "Console" . Faça uma captura de tela desta guia e direi se houver um problema.
Bom Dia,
Merci pour votre réponse.
Meu site está sendo hospedado pelo Free, pode haver um problema de javascript.
Você pode me dizer como encaminhar a captura de tela que fiz?
cordialmente
Queremos Mireille mas o tipo de serviço que você precisa é, infelizmente, pagar e nós convidamos você a entrar em contato com nossa equipe técnica blogpascher.com
Como instalei uma versão restrita de graça, acho que o problema está aí.
Vou tentar instalar outra versão ...
Copiei algum texto e tentei colá-lo em uma coluna do plugin. Impossível, nem com o atalho de teclado CTRL + V, nem no menu contextual do clique direito que não oferece esta função.
Existe alguma alternativa para redigitar tudo?
Eu só tenho uma palavra a dizer incrível! Instalei e depois de duas ou três correções consegui fazer colunas, obrigado!
Obrigado Ronnie por este feedback.
Olá, instalei colunas wp avançadas.
mas quando olho a página, vejo um quadrado branco presente no canto superior esquerdo de cada coluna? pode me ajudar. obrigado
Bonsoir,
Você já tentou usar o tema Wordpress padrão para ver se o problema persiste?
Bom Dia,
Nós realmente não podemos ajudá-lo se você não dá detalhes sobre como você fazer para ter um quadrado branco.
Merci.