{"id":235357,"date":"2021-11-25T10:43:00","date_gmt":"2021-11-25T07:43:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=235357"},"modified":"2022-05-16T14:07:55","modified_gmt":"2022-05-16T11:07:55","slug":"como-alinhar-imagens-lado-a-lado-no-wordpress","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/pt-pt\/como-alinhar-imagens-lado-a-lado-no-wordpress\/","title":{"rendered":"Como alinhar imagens lado a lado no WordPress"},"content":{"rendered":"

O alinhamento de imagens \u00e9 uma luta constante para o blogueiro do WordPress.<\/p>\n

Esta postagem \u00e9 para qualquer pessoa que passou mais tempo do que gostaria de admitir mexendo no alinhamento da imagem e no posicionamento no editor.<\/p>\n

Os dois melhores m\u00e9todos para alinhar imagens<\/h2>\n

Existem duas t\u00e9cnicas que voc\u00ea deve considerar para colocar imagens uma ao lado da outra. Vou compartilhar como usar cada um, bem como os pr\u00f3s e contras inclu\u00eddos.<\/p>\n

1 Alinha imagens com uma galeria<\/h3>\n

O m\u00e9todo mais confi\u00e1vel para colocar imagens lado a lado \u00e9 usar uma galeria do WordPress<\/a>.<\/p>\n

Se voc\u00ea nunca criou uma galeria antes, siga este tutorial sobre como criar galerias<\/a>.<\/p>\n

O truque \u00e9 usar uma vers\u00e3o de tamanho m\u00e9dio das imagens e escolher duas colunas, mesmo se voc\u00ea estiver incluindo apenas duas imagens. O resultado ser\u00e1 mais ou menos assim:<\/p>\n

\"Como<\/a><\/p>\n

Ao contr\u00e1rio das imagens que voc\u00ea coloca em sua postagem, as galerias t\u00eam um HTML especial que mant\u00e9m as imagens pr\u00f3ximas umas das outras. Essa estrutura torna mais f\u00e1cil e menos complicado alinhar as imagens em linhas \/ colunas.<\/p>\n

2 Coloque imagens com c\u00f3digos de acesso de coluna<\/h3>\n

Se voc\u00ea n\u00e3o se importa em adicionar um novo plugin ao seu site, Column Shortcodes<\/a> \u00e9 uma \u00f3tima solu\u00e7\u00e3o para alinhar imagens.<\/p>\n

\"Como<\/a><\/p>\n

Column Shortcodes \u00e9 um daqueles plug-ins incr\u00edveis que n\u00e3o enchem seu site com novos menus. Na verdade, a \u00fanica coisa que ele adiciona ao seu painel de administra\u00e7\u00e3o \u00e9 este bot\u00e3o conveniente acima do editor.<\/p>\n

\"Como<\/a><\/p>\n

Para mostrar como funciona, vou criar uma \u00fanica linha de tr\u00eas imagens.<\/p>\n

Como usar c\u00f3digos de acesso de coluna<\/h4>\n

O primeiro passo \u00e9 colocar o cursor em uma linha vazia no editor. Em seguida, clique no bot\u00e3o de atalho e selecione uma op\u00e7\u00e3o de coluna.<\/p>\n

Criando uma linha com tr\u00eas colunas.<\/p>\n

Repita esta etapa para adicionar uma segunda coluna 1\/3 e, em seguida, repita mais uma vez, mas desta vez usando a op\u00e7\u00e3o de um ter\u00e7o (\u00faltima). O resultado s\u00e3o os seguintes c\u00f3digos de acesso adicionados ao editor.<\/p>\n

\"Como<\/a><\/p>\n

Se voc\u00ea nunca usou shortcodes antes, voc\u00ea pode querer seguir este tutorial<\/a> primeiro.<\/p>\n

Como voc\u00ea pode ver, cada shortcode possui uma tag de abertura e fechamento. Agora voc\u00ea pode colocar uma imagem dentro de cada shortcode, assim:<\/p>\n

\"Como<\/a><\/p>\n

Parece uma bagun\u00e7a, n\u00e3o \u00e9?<\/p>\n

Isso ocorre porque os c\u00f3digos de acesso n\u00e3o podem estilizar as imagens no editor, mas n\u00e3o \u00e9 um problema. Depois de visualiz\u00e1-los no site, eles se alinhar\u00e3o perfeitamente em colunas, como esta:<\/p>\n

\"Como<\/a><\/p>\n

C\u00f3digos abreviados de coluna em compara\u00e7\u00e3o com galerias<\/h4>\n

Embora os c\u00f3digos de acesso n\u00e3o sejam exibidos bem no editor como galerias e possam ser mais dif\u00edceis de trabalhar, voc\u00ea tamb\u00e9m obt\u00e9m um pouco mais de controle. Por exemplo, as galerias obrigam todas as imagens a vincularem a:<\/p>\n