{"id":3336,"date":"2025-06-24T16:09:59","date_gmt":"2025-06-24T16:09:59","guid":{"rendered":"https:\/\/tableberg.com\/?p=3336"},"modified":"2025-06-24T16:10:02","modified_gmt":"2025-06-24T16:10:02","slug":"como-colocar-texto-e-imagem-lado-a-lado-no-wordpress","status":"publish","type":"post","link":"https:\/\/tableberg.com\/pt\/how-to-put-text-and-image-side-by-side-in-wordpress\/","title":{"rendered":"Como colocar texto e imagem lado a lado no WordPress"},"content":{"rendered":"<p>Ao cobrir an\u00e1lises de produtos, tabelas de compara\u00e7\u00e3o, tutoriais, hist\u00f3rias de viagens, infogr\u00e1ficos, conte\u00fado educacional etc., talvez voc\u00ea precise colocar textos e imagens lado a lado. H\u00e1 v\u00e1rias maneiras de fazer isso no WordPress. <\/p>\n\n\n\n<p>Neste artigo, mostraremos a voc\u00ea v\u00e1rias maneiras eficazes de colocar texto e imagem lado a lado no WordPress. Portanto, fique conosco at\u00e9 o fim. Voc\u00ea realmente aprender\u00e1 algo interessante.<\/p>\n\n\n<div data-is_sticky=\"false\" data-sticky_toc_position=\"left\" data-hide_sticky_on_mobile=\"false\" data-sticky_button_icon='&lt;svg style=\"color:#000000;\" class=\"ub_sticky-toc-open-button-icon\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" height=\"34px\" width=\"34px\" viewBox=\"0, 0, 448, 512\"&gt;&lt;path fill=\"currentColor\" d=\"M0 96C0 78.33 14.33 64 32 64H416C433.7 64 448 78.33 448 96C448 113.7 433.7 128 416 128H32C14.33 128 0 113.7 0 96zM0 256C0 238.3 14.33 224 32 224H416C433.7 224 448 238.3 448 256C448 273.7 433.7 288 416 288H32C14.33 288 0 273.7 0 256zM416 448H32C14.33 448 0 433.7 0 416C0 398.3 14.33 384 32 384H416C433.7 384 448 398.3 448 416C448 433.7 433.7 448 416 448z\"&gt;&lt;\/svg&gt;' data-sticky_button_color=\"#000000\" data-sticky_toc_width=\"320px\" class=\"wp-block-ub-table-of-contents-block ub_table-of-contents\" id=\"ub_table-of-contents-771754c5-6e52-4edb-ac05-6e6176ad9d96\" data-linktodivider=\"false\" data-showtext=\"show\" data-hidetext=\"hide\" data-scrolltype=\"auto\" data-enablesmoothscroll=\"false\" data-initiallyhideonmobile=\"false\" data-initiallyshow=\"true\"><div class=\"ub_table-of-contents-header-container\" style=\"\">\n\t\t\t<div class=\"ub_table-of-contents-header\" style=\"text-align: left; \">\n\t\t\t\t<div class=\"ub_table-of-contents-title\">Colocar texto e imagem lado a lado no WordPress:<\/div>\n\t\t\t\t\n\t\t\t<\/div>\n\t\t<\/div><div class=\"ub_table-of-contents-extra-container\" style=\"\">\n\t\t\t<div class=\"ub_table-of-contents-container ub_table-of-contents-1-column\">\n\t\t\t\t<ul style=\"\"><li style=\"color: #636381; \"><a href=\"https:\/\/tableberg.com\/pt\/how-to-put-text-and-image-side-by-side-in-wordpress\/#0-method-1-using-the-media-amp-text-block\" style=\"\">M\u00e9todo 1: Usando o bloco de m\u00eddia e texto<\/a><\/li><li style=\"color: #636381; \"><a href=\"https:\/\/tableberg.com\/pt\/how-to-put-text-and-image-side-by-side-in-wordpress\/#5-method-2-using-the-columns-block\" style=\"\">M\u00e9todo 2: Usando o bloco Columns<\/a><\/li><li style=\"color: #636381; \"><a href=\"https:\/\/tableberg.com\/pt\/how-to-put-text-and-image-side-by-side-in-wordpress\/#9-method-3-using-the-tableberg-block\" style=\"\">M\u00e9todo 3: Usando o bloco Tableberg<\/a><\/li><li style=\"color: #636381; \"><a href=\"https:\/\/tableberg.com\/pt\/how-to-put-text-and-image-side-by-side-in-wordpress\/#14-method-4-using-the-sliderberg-block\" style=\"\">M\u00e9todo 4: Usando o bloco Sliderberg<\/a><\/li><\/ul>\n\t\t\t<\/div>\n\t\t<\/div><\/div>\n\n\n<h2 class=\"wp-block-heading\" id=\"0-method-1-using-the-media-amp-text-block\">M\u00e9todo 1: Usando o bloco de m\u00eddia e texto<\/h2>\n\n\n\n<p><strong>M\u00eddia e texto<\/strong> \u00e9 um bloco padr\u00e3o do editor de blocos do Gutenberg. Com esse bloco, voc\u00ea pode colocar texto e imagens lado a lado sem depender de nenhuma ferramenta de terceiros.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"1-step-01-add-the-media-amp-text-to-the-editor\">Etapa 01: Adicione a m\u00eddia e o texto ao editor<\/h3>\n\n\n\n<p>Clique no bot\u00e3o <strong>\u00edcone de mais (+)<\/strong> no editor. Tipo <strong>M\u00eddia e texto<\/strong> na barra de pesquisa. Adicione o bloco ao editor.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Media-Text-block-to-WordPress.webp\" alt=\"Adicione o bloco M\u00eddia e texto ao WordPress\" class=\"wp-image-3337\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Media-Text-block-to-WordPress.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Media-Text-block-to-WordPress-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Media-Text-block-to-WordPress-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Media-Text-block-to-WordPress-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Media-Text-block-to-WordPress-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"2-step-02-addupload-an-image-to-the-block\">Etapa 02: Adicionar\/carregar uma imagem no bloco<\/h3>\n\n\n\n<p>Voc\u00ea pode adicionar uma imagem fazendo upload da unidade local, da biblioteca de m\u00eddia ou da imagem em destaque. Escolha a op\u00e7\u00e3o de sua prefer\u00eancia.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/AddUpload-an-Image-to-the-Block.webp\" alt=\"Adicionar\/carregar uma imagem ao bloco\" class=\"wp-image-3338\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/AddUpload-an-Image-to-the-Block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/AddUpload-an-Image-to-the-Block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/AddUpload-an-Image-to-the-Block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/AddUpload-an-Image-to-the-Block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/AddUpload-an-Image-to-the-Block-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Voc\u00ea pode ver que a imagem foi adicionada ao bloco.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-the-Media-Text-block.webp\" alt=\"A imagem \u00e9 adicionada ao bloco M\u00eddia e Texto\" class=\"wp-image-3339\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-the-Media-Text-block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-the-Media-Text-block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-the-Media-Text-block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-the-Media-Text-block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-the-Media-Text-block-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"3-step-03-add-text-to-the-media-amp-text-block\">Etapa 03: Adicionar texto ao bloco de m\u00eddia e texto<\/h3>\n\n\n\n<p>Escreva o texto desejado na coluna direita do bloco. Voc\u00ea pode personalizar a cor do texto, o alinhamento e muito mais, se desejar.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Text-to-the-Media-Text-Block.webp\" alt=\"Adicionar texto ao bloco de m\u00eddia e texto\" class=\"wp-image-3340\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Text-to-the-Media-Text-Block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Text-to-the-Media-Text-Block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Text-to-the-Media-Text-Block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Text-to-the-Media-Text-Block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Text-to-the-Media-Text-Block-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"4-step-04-alternate-the-text-and-media-file-position\">Etapa 04: Alternar a posi\u00e7\u00e3o do texto e do arquivo de m\u00eddia<\/h3>\n\n\n\n<p>O bloco permite alternar a posi\u00e7\u00e3o dos arquivos de texto e de m\u00eddia clicando nas respectivas op\u00e7\u00f5es na barra de ferramentas.<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"720\" style=\"aspect-ratio: 1280 \/ 720;\" width=\"1280\" autoplay controls loop muted src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Switch-the-Text-and-Media-File.mp4\"><\/video><\/figure>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"5-method-2-using-the-columns-block\">M\u00e9todo 2: Usando o bloco Columns<\/h2>\n\n\n\n<p>O <strong>Colunas<\/strong> tamb\u00e9m \u00e9 um bloco padr\u00e3o do editor. \u00c9 um dos blocos mais usados na cria\u00e7\u00e3o de conte\u00fado do WordPress.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"6-step-01-add-the-columns-block-to-the-editor\">Etapa 01: Adicionar o bloco Columns ao Editor<\/h3>\n\n\n\n<p>Voc\u00ea pode exibir texto e imagem lado a lado adicionando a tag <strong>Par\u00e1grafo<\/strong> e <strong>Blocos de imagem<\/strong> separadamente nos blocos de colunas.<\/p>\n\n\n\n<p>Portanto, <strong>adicionar o bloco Columns<\/strong> primeiro para o editor.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Columns-block-to-the-editor.webp\" alt=\"Adicionar o bloco Columns ao editor\" class=\"wp-image-3342\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Columns-block-to-the-editor.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Columns-block-to-the-editor-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Columns-block-to-the-editor-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Columns-block-to-the-editor-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Columns-block-to-the-editor-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Selecione um layout de duas colunas.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-two-column-layout.webp\" alt=\"Selecione um layout de duas colunas\" class=\"wp-image-3344\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-two-column-layout.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-two-column-layout-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-two-column-layout-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-two-column-layout-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-two-column-layout-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"7-step-02-add-the-image-block-to-the-columns-block\">Etapa 02: Adicionar o bloco de imagem ao bloco de colunas<\/h3>\n\n\n\n<p>\u00c9 melhor exibi-los \u00e0 esquerda. Portanto, <strong>adicionar o bloco Image<\/strong> para a coluna da esquerda.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-Block-to-the-Columns-Block.webp\" alt=\"Adicionar o bloco de imagens ao bloco de colunas\" class=\"wp-image-3345\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-Block-to-the-Columns-Block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-Block-to-the-Columns-Block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-Block-to-the-Columns-Block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-Block-to-the-Columns-Block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-Block-to-the-Columns-Block-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Aqui, novamente, adicione a imagem desejada, seja da unidade local, da biblioteca de m\u00eddia ou por meio de um URL.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-an-image-to-the-columns-block.webp\" alt=\"Fazer upload de uma imagem para o bloco de colunas\" class=\"wp-image-3346\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-an-image-to-the-columns-block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-an-image-to-the-columns-block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-an-image-to-the-columns-block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-an-image-to-the-columns-block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-an-image-to-the-columns-block-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Voc\u00ea pode ver que a imagem foi adicionada ao bloco.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-columns-block.webp\" alt=\"A imagem \u00e9 adicionada ao bloco de colunas\" class=\"wp-image-3347\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-columns-block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-columns-block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-columns-block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-columns-block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Image-is-added-to-columns-block-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"8-step-03-add-text-to-the-cloumns-block\">Etapa 03: Adicionar texto ao bloco Cloumns<\/h3>\n\n\n\n<p>Adicione o <strong>Bloco de par\u00e1grafos<\/strong> para a coluna da direita. Isso permitir\u00e1 que voc\u00ea adicione texto.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Paragraph-block-to-the-Columns-block.webp\" alt=\"Adicionar o bloco Paragraph ao bloco Columns\" class=\"wp-image-3348\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Paragraph-block-to-the-Columns-block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Paragraph-block-to-the-Columns-block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Paragraph-block-to-the-Columns-block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Paragraph-block-to-the-Columns-block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Paragraph-block-to-the-Columns-block-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Voc\u00ea pode ver que o texto foi adicionado \u00e0 coluna.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Text-is-added-to-the-columns-block.webp\" alt=\"O texto \u00e9 adicionado ao bloco de colunas\" class=\"wp-image-3349\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Text-is-added-to-the-columns-block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Text-is-added-to-the-columns-block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Text-is-added-to-the-columns-block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Text-is-added-to-the-columns-block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Text-is-added-to-the-columns-block-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Em seguida, voc\u00ea pode personalizar o bloco de colunas, inclusive a imagem e o texto nele contidos.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"9-method-3-using-the-tableberg-block\">M\u00e9todo 3: Usando o bloco Tableberg<\/h2>\n\n\n\n<p><a href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Tableberg<\/a> \u00e9 um maravilhoso plug-in de cria\u00e7\u00e3o de tabelas que permite que voc\u00ea crie v\u00e1rias partes para o seu site. Esse plug-in tamb\u00e9m permite que voc\u00ea coloque texto e imagens lado a lado. Fa\u00e7a o download do plug-in clicando nos bot\u00f5es anexados ao banner abaixo.<\/p>\n\n\n\n<div class=\"wp-block-group has-border-color has-global-padding is-layout-constrained wp-container-core-group-is-layout-8db5ca72 wp-block-group-is-layout-constrained\" style=\"border-color:#671feb;border-style:solid;border-width:1px;border-radius:4px;padding-top:var(--wp--preset--spacing--medium);padding-right:var(--wp--preset--spacing--small);padding-bottom:var(--wp--preset--spacing--medium);padding-left:var(--wp--preset--spacing--small)\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-505d3e6d wp-block-group-is-layout-flex\" style=\"padding-top:var(--wp--preset--spacing--small);padding-bottom:var(--wp--preset--spacing--small)\">\n<p style=\"font-size:clamp(18.959px, 1.185rem + ((1vw - 3.2px) * 1.175), 30px);\"><strong>Criar mesas bonitas <\/strong><br><strong>Com o Block Editor<\/strong><\/p>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-f2baa792 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-background wp-element-button\" href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" style=\"background-color:#671feb\" target=\"_blank\" rel=\"noreferrer noopener\">Experimente gratuitamente<\/a><\/div>\n\n\n\n<div class=\"wp-block-button is-style-outline is-style-outline--1\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/tableberg.com\/pt\/precificacao\/\" target=\"_blank\" rel=\"noreferrer noopener\">Obter um profissional<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"540\" height=\"540\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Tableberg.png\" alt=\"\" class=\"wp-image-1545\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Tableberg.png 540w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Tableberg-300x300.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Tableberg-150x150.png 150w\" sizes=\"auto, (max-width: 540px) 100vw, 540px\" \/><\/figure>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<p>Comece a seguir o tutorial agora.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"10-step-01-add-the-tableberg-block-to-the-editor\">Etapa 01: Adicionar o bloco Tableberg ao Editor<\/h3>\n\n\n\n<p>Esse plug-in adiciona um bloco chamado Tableberg \u00e0 biblioteca de blocos do Gutenberg. <strong>Adicionar o bloco Tableberg<\/strong> para o editor.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor.webp\" alt=\"Adicione o bloco TableBerg ao seu editor do Gutenberg\" class=\"wp-image-481\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Selecione o n\u00famero de colunas e linhas de que voc\u00ea precisa para o layout. Selecionaremos 2*1.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns.webp\" alt=\"Definir o n\u00famero de linhas e colunas\" class=\"wp-image-3014\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Voc\u00ea pode ver que as colunas e as linhas est\u00e3o prontas.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Rows-and-columns-selecte-for-designing-the-Amazon-product-table.webp\" alt=\"Linhas e colunas s\u00e3o adicionadas ao editor\" class=\"wp-image-3309\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Rows-and-columns-selecte-for-designing-the-Amazon-product-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Rows-and-columns-selecte-for-designing-the-Amazon-product-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Rows-and-columns-selecte-for-designing-the-Amazon-product-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Rows-and-columns-selecte-for-designing-the-Amazon-product-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Rows-and-columns-selecte-for-designing-the-Amazon-product-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"11-step-02-add-an-image-to-a-cell-of-the-table-\">Etapa 02: Adicionar uma imagem a uma c\u00e9lula da tabela <\/h3>\n\n\n\n<p>O Tableberg permite adicionar v\u00e1rios blocos personalizados \u00e0s suas c\u00e9lulas. Ao clicar no \u00edcone <strong>\u00edcone de mais (+)<\/strong>, encontrar e <strong>adicionar o bloco Image<\/strong> para uma de suas c\u00e9lulas.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-Amazon-Product-box.webp\" alt=\"Adicionar um bloco de imagem ao Tableberg\" class=\"wp-image-3310\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-Amazon-Product-box.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-Amazon-Product-box-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-Amazon-Product-box-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-Amazon-Product-box-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-Amazon-Product-box-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Carregue a imagem para a unidade local ou adicione uma da sua biblioteca de m\u00eddia.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-or-add-an-image-to-Tableberg.webp\" alt=\"Carregue ou adicione uma imagem ao Tableberg\" class=\"wp-image-3350\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-or-add-an-image-to-Tableberg.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-or-add-an-image-to-Tableberg-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-or-add-an-image-to-Tableberg-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-or-add-an-image-to-Tableberg-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-or-add-an-image-to-Tableberg-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Adicionamos uma imagem, que voc\u00ea pode ver abaixo.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/An-image-is-added-to-the-table.webp\" alt=\"Uma imagem \u00e9 adicionada \u00e0 tabela\" class=\"wp-image-3351\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/An-image-is-added-to-the-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/An-image-is-added-to-the-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/An-image-is-added-to-the-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/An-image-is-added-to-the-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/An-image-is-added-to-the-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"12-step-03-add-text-to-the-table\">Etapa 03: Adicionar texto \u00e0 tabela<\/h3>\n\n\n\n<p>Basta adicionar texto \u00e0 coluna da direita usando o bloco de par\u00e1grafos.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-text-to-Tableberg.webp\" alt=\"Adicionar texto ao Tableberg\" class=\"wp-image-3352\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-text-to-Tableberg.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-text-to-Tableberg-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-text-to-Tableberg-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-text-to-Tableberg-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-text-to-Tableberg-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"13-step-04-modify-the-tableberg-border\">Etapa 04: Modificar a borda do Tableberg<\/h3>\n\n\n\n<p>Voc\u00ea pode tornar essa se\u00e7\u00e3o mais atraente removendo ou colonizando a borda da tabela. <strong>Ir para <\/strong>o <strong>Guia Estilos<\/strong>.<\/p>\n\n\n\n<p><strong>Borda do Come to Table<\/strong> rolando a guia para baixo. Voc\u00ea ter\u00e1 op\u00e7\u00f5es para remover ou colorir a borda da tabela nessas op\u00e7\u00f5es.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Remove-borders-from-the-table.webp\" alt=\"Remover bordas da tabela\" class=\"wp-image-3353\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Remove-borders-from-the-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Remove-borders-from-the-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Remove-borders-from-the-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Remove-borders-from-the-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Remove-borders-from-the-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Assim, \u00e9 poss\u00edvel criar se\u00e7\u00f5es da Web para colocar texto e imagem lado a lado no WordPress.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"14-method-4-using-the-sliderberg-block\">M\u00e9todo 4: Usando o bloco Sliderberg<\/h2>\n\n\n\n<p>Deseja exibir texto e imagens lado a lado em um controle deslizante interativo? O <strong><a href=\"https:\/\/wordpress.org\/plugins\/sliderberg\/\" target=\"_blank\" rel=\"noreferrer noopener\">Sliderberg<\/a><\/strong> permite que voc\u00ea fa\u00e7a exatamente isso, usando o conhecido bloco Media &amp; Text, com total flexibilidade. Veja como configur\u00e1-lo em apenas alguns minutos:<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"15-step-1-install-and-activate-the-sliderberg-plugin\">Etapa 1: Instalar e ativar o plug-in Sliderberg<\/h3>\n\n\n\n<p>Primeiro, v\u00e1 para <strong>Plugins \u2192 Adicionar novo<\/strong> no painel do WordPress, procure por \"Sliderberg\" e clique em <strong>Instalar agora<\/strong>. Em seguida, ative o plug-in.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"512\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Install-the-Tableberg-Plugin-1024x512.png\" alt=\"\" class=\"wp-image-9815\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Install-the-Tableberg-Plugin-1024x512.png 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Install-the-Tableberg-Plugin-300x150.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Install-the-Tableberg-Plugin-768x384.png 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Install-the-Tableberg-Plugin-1536x768.png 1536w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Install-the-Tableberg-Plugin-2048x1024.png 2048w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Install-the-Tableberg-Plugin-18x9.png 18w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"16-step-2-insert-the-sliderberg-block\">Etapa 2: Inserir o bloco do Sliderberg<\/h3>\n\n\n\n<p>Edite sua postagem ou p\u00e1gina. Clique no bot\u00e3o <strong>+<\/strong> procure por \"Sliderberg\" e insira o bloco Sliderberg onde deseja que o controle deslizante apare\u00e7a.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"518\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Insert-the-Sliderberg-Block-1024x518.png\" alt=\"\" class=\"wp-image-9816\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Insert-the-Sliderberg-Block-1024x518.png 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Insert-the-Sliderberg-Block-300x152.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Insert-the-Sliderberg-Block-768x389.png 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Insert-the-Sliderberg-Block-1536x778.png 1536w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Insert-the-Sliderberg-Block-2048x1037.png 2048w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Insert-the-Sliderberg-Block-18x9.png 18w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"17-step-3-select-the-%E2%80%98blocks-slider%E2%80%99-type\">Etapa 3: Selecione o tipo \"Blocks Slider\" (controle deslizante de blocos)<\/h3>\n\n\n\n<p>Quando solicitado, escolha a op\u00e7\u00e3o <strong>Controle deslizante de blocos<\/strong> op\u00e7\u00e3o. Isso permite que voc\u00ea adicione qualquer bloco do Gutenberg dentro de cada slide.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"510\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-the-Blocks-Slider-Type-1024x510.png\" alt=\"\" class=\"wp-image-9817\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-the-Blocks-Slider-Type-1024x510.png 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-the-Blocks-Slider-Type-300x149.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-the-Blocks-Slider-Type-768x383.png 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-the-Blocks-Slider-Type-1536x765.png 1536w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-the-Blocks-Slider-Type-2048x1020.png 2048w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-the-Blocks-Slider-Type-18x9.png 18w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"18-step-4-choose-a-background-color-for-the-slider\">Etapa 4: Escolha uma cor de fundo para o controle deslizante<\/h3>\n\n\n\n<p>Escolha uma cor de fundo para o controle deslizante que combine com o estilo do seu site ou mantenha-o transparente para obter uma apar\u00eancia limpa.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"584\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Choose-a-Background-Color-of-the-Slider-1024x584.png\" alt=\"\" class=\"wp-image-9818\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Choose-a-Background-Color-of-the-Slider-1024x584.png 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Choose-a-Background-Color-of-the-Slider-300x171.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Choose-a-Background-Color-of-the-Slider-768x438.png 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Choose-a-Background-Color-of-the-Slider-1536x877.png 1536w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Choose-a-Background-Color-of-the-Slider-2048x1169.png 2048w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Choose-a-Background-Color-of-the-Slider-18x10.png 18w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"19-step-5-add-the-%E2%80%98media-amp-text%E2%80%99-block-inside-the-slider\">Etapa 5: Adicione o bloco \"Media &amp; Text\" dentro do controle deslizante<\/h3>\n\n\n\n<p>Dentro de seu primeiro slide, clique no bot\u00e3o <strong>+<\/strong> e insira o bot\u00e3o <strong>M\u00eddia e texto<\/strong> bloco.<\/p>\n\n\n\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\" style=\"border-width:1px;border-radius:3px\">\n<figure class=\"wp-block-video\"><video height=\"1796\" style=\"aspect-ratio: 3158 \/ 1796;\" width=\"3158\" autoplay loop muted src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Media-Text-Block.mp4\"><\/video><\/figure>\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"20-step-6-add-image-and-text-to-the-slider\">Etapa 6: Adicionar imagem e texto ao controle deslizante<\/h3>\n\n\n\n<p>Use o bloco Media &amp; Text para carregar sua imagem (lado esquerdo) e adicionar seu texto (lado direito). Voc\u00ea pode usar t\u00edtulos, par\u00e1grafos, bot\u00f5es ou qualquer outro bloco que precisar.<\/p>\n\n\n\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\" style=\"border-width:1px;border-radius:3px\">\n<figure class=\"wp-block-video\"><video height=\"1732\" style=\"aspect-ratio: 3152 \/ 1732;\" width=\"3152\" autoplay loop muted src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Image-Text-to-the-Slider-.mp4\"><\/video><\/figure>\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"21-step-7-add-or-duplicate-slides\">Etapa 7: Adicionar ou duplicar slides<\/h3>\n\n\n\n<p>Deseja mais slides? Clique aqui <strong>Adicionar slide<\/strong> para criar um novo, ou <strong>Duplicar slide<\/strong> para copiar um layout existente.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"554\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-or-Duplicate-the-Slider-1024x554.png\" alt=\"\" class=\"wp-image-9820\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-or-Duplicate-the-Slider-1024x554.png 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-or-Duplicate-the-Slider-300x162.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-or-Duplicate-the-Slider-768x416.png 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-or-Duplicate-the-Slider-1536x832.png 1536w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-or-Duplicate-the-Slider-2048x1109.png 2048w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-or-Duplicate-the-Slider-18x10.png 18w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"22-step-8-customize-the-slider-and-publish\">Etapa 8: Personalize o controle deslizante e publique<\/h3>\n\n\n\n<p>Ajuste as configura\u00e7\u00f5es do controle deslizante (anima\u00e7\u00e3o, reprodu\u00e7\u00e3o autom\u00e1tica, setas de navega\u00e7\u00e3o etc.) de acordo com sua prefer\u00eancia. Quando estiver pronto, clique em <strong>Publicar<\/strong> para entrar no ar!<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"635\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-Slider-and-Publish-1024x635.png\" alt=\"\" class=\"wp-image-9822\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-Slider-and-Publish-1024x635.png 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-Slider-and-Publish-300x186.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-Slider-and-Publish-768x476.png 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-Slider-and-Publish-1536x952.png 1536w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-Slider-and-Publish-2048x1270.png 2048w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-Slider-and-Publish-18x12.png 18w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Agora voc\u00ea tem um controle deslizante suave e responsivo que mostra texto e imagem lado a lado, perfeito para apresenta\u00e7\u00f5es de equipes, produtos, depoimentos e muito mais.<\/p>\n\n\n\n<p><strong>Dica profissional:<\/strong> Voc\u00ea pode usar <em>qualquer<\/em> dentro de seus slides do Sliderberg - n\u00e3o apenas M\u00eddia e Texto! Seja criativo com bot\u00f5es, \u00edcones, colunas ou at\u00e9 mesmo blocos de terceiros.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"23-conclusion\">Conclus\u00e3o<\/h3>\n\n\n\n<p>De fato, voc\u00ea pode aproveitar os blocos padr\u00e3o do Gutenberg para criar e projetar seus posts e p\u00e1ginas da Web. Mas, como eles n\u00e3o t\u00eam muitos recursos avan\u00e7ados, voc\u00ea geralmente precisa de plug-ins de blocos adicionais que v\u00eam com muitos recursos interessantes. <\/p>\n\n\n\n<p>O Tableberg \u00e9 um plugin interessante que voc\u00ea pode usar nesse caso. O Ultimate Blocks \u00e9 outro excelente plug-in de blocos que voc\u00ea deve considerar. Explore as vers\u00f5es gratuitas desses dois plug-ins clicando nos bot\u00f5es anexados abaixo.<\/p>\n\n\n\n<p><strong>Leia tamb\u00e9m<\/strong>: <\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/tableberg.com\/pt\/como-colocar-imagens-lado-a-lado-no-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">Como colocar imagens lado a lado no WordPress<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/tableberg.com\/pt\/como-adicionar-texto-em-cima-de-uma-imagem-no-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">Como adicionar texto \u00e0 parte superior de uma imagem no WordPress<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/tableberg.com\/pt\/como-redimensionar-blocos-no-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">Como redimensionar blocos no WordPress<\/a><\/li>\n<\/ul>","protected":false},"excerpt":{"rendered":"<p>While covering product reviews, comparison tables, tutorials, travel stories, infographics, educational content, etc., you may have to put texts and images side by side. There are numerous ways to do this in WordPress. In this article, we&#8217;ll show you several effective ways of how to put text and image side by side in WordPress. So, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":3355,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[7],"tags":[111,112,102],"class_list":["post-3336","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-how-to","tag-amazon-product-marketing","tag-create-web-sections","tag-web-design"],"featured_image_src":"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/How-to-Put-Text-and-Image-Side-by-Side-in-WordPress.webp","author_info":{"display_name":"Istiak Rayhan","author_link":"https:\/\/tableberg.com\/pt\/author\/wpx_irayhan\/"},"_links":{"self":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/posts\/3336","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/comments?post=3336"}],"version-history":[{"count":7,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/posts\/3336\/revisions"}],"predecessor-version":[{"id":9823,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/posts\/3336\/revisions\/9823"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/media\/3355"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/media?parent=3336"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/categories?post=3336"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/tags?post=3336"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}