{"id":21,"date":"2026-04-11T14:30:54","date_gmt":"2026-04-11T17:30:54","guid":{"rendered":"http:\/\/localhost\/AiTemRampa\/?p=21"},"modified":"2026-05-03T20:52:55","modified_gmt":"2026-05-03T23:52:55","slug":"bem-vindo-ao-editor-gutenberg","status":"publish","type":"post","link":"https:\/\/aitemrampa.site\/?p=21","title":{"rendered":"Bem-vindo ao editor Gutenberg"},"content":{"rendered":"\n
\"\"<\/span>
\n

Sobre montanhas e primeiras impress\u00f5es<\/p>\n<\/div><\/div>\n\n\n\n

O objetivo deste novo editor \u00e9 tornar a inclus\u00e3o de conte\u00fado rico no WordPress simples e agrad\u00e1vel. Este post \u00e9 todo composto de peda\u00e7os de conte\u00fado<\/em> \u2014 algo parecido com os blocos LEGO \u2014 que voc\u00ea pode movimentar e com eles, interagir. Movimente o cursor pela tela e voc\u00ea vai notar que os v\u00e1rios blocos s\u00e3o ressaltados por linhas e setas. Clique nas setas para reposicionar os blocos rapidamente, sem o medo de perder alguma coisa no processo de copiar e colar.<\/p>\n\n\n\n

O que voc\u00ea est\u00e1 lendo agora \u00e9 um bloco de texto<\/strong>, o bloco mais b\u00e1sico de todos. O bloco de texto tem seus pr\u00f3prios controles para que seja movimentado livremente pelo post…<\/p>\n\n\n\n

…como este aqui, que \u00e9 alinhado \u00e0 direita.<\/p>\n\n\n\n

Os t\u00edtulos tamb\u00e9m s\u00e3o blocos separados, o que ajuda no esbo\u00e7o e organiza\u00e7\u00e3o do seu conte\u00fado.<\/p>\n\n\n\n

Uma imagem vale por mil palavras<\/h2>\n\n\n\n

Lidar com imagens e m\u00eddias com todo o cuidado \u00e9 um dos focos b\u00e1sicos do novo editor. Esperamos que voc\u00ea ache bem mais f\u00e1cil do que antes a maneira de adicionar legendas ou exibir as imagens em tela cheia.<\/p>\n\n\n\n

\"Linda
Se o seu tema permitir, voc\u00ea ver\u00e1 um bot\u00e3o “largo” na barra de ferramentas da imagem. Experimente.<\/figcaption><\/figure>\n\n\n\n

Tente selecionar e remover ou editar a legenda. Agora voc\u00ea n\u00e3o precisa se preocupar com selecionar por engano a imagem ou outro texto e com isso estragar a apresenta\u00e7\u00e3o.<\/p>\n\n\n\n

A ferramenta de adi\u00e7\u00e3o<\/em><\/h2>\n\n\n\n

Imagine tudo o que o WordPress pode fazer, est\u00e1 dispon\u00edvel para voc\u00ea rapidamente e no mesmo lugar na interface. Sem necessidade de lembrar sobre tags de HTML, classes ou lembrar da sintaxe complicada de shortcodes. Esse \u00e9 o esp\u00edrito por tr\u00e1s do adicionador, o bot\u00e3o (+)<\/code> que voc\u00ea ver\u00e1 pelo editor, que permite navegar em todos os blocos de conte\u00fado dispon\u00edveis e adicion\u00e1-los ao seu post. Plugins e temas s\u00e3o capazes de registrar os seus pr\u00f3prios, abrindo todo o tipo de possibilidades para edi\u00e7\u00e3o e publica\u00e7\u00e3o.<\/p>\n\n\n\n

Experimente, voc\u00ea pode descobrir coisas que o WordPress j\u00e1 \u00e9 capaz de adicionar nos seus posts e que voc\u00ea nem sabia. Aqui vai uma lista do que voc\u00ea j\u00e1 pode encontrar:<\/p>\n\n\n\n

    \n
  • Textos & t\u00edtulos<\/li>\n\n\n\n
  • Imagens & v\u00eddeos<\/li>\n\n\n\n
  • Galerias<\/li>\n\n\n\n
  • Incorporados, como YouTube, Tweets ou outros posts do WordPress.<\/li>\n\n\n\n
  • Blocos de layout, bot\u00f5es de curtir, imagens em destaque, separadores etc.<\/li>\n\n\n\n
  • E listas<\/em> como esta aqui, \u00e9 claro \ud83d\ude42<\/li>\n<\/ul>\n\n\n\n
    \n\n\n\n

    Edi\u00e7\u00e3o visual<\/h2>\n\n\n\n

    Uma enorme vantagem dos blocos \u00e9 que voc\u00ea consegue edit\u00e1-los no lugar e manipular o conte\u00fado deles diretamente. Em vez de ter campos para editar, por exemplo, o c\u00f3digo de uma cita\u00e7\u00e3o ou o texto de um bot\u00e3o, voc\u00ea pode alterar o conte\u00fado diretamente. Experimente editar a seguinte cita\u00e7\u00e3o:<\/p>\n\n\n\n

    \n

    O editor se prop\u00f5e a criar uma nova experi\u00eancia de constru\u00e7\u00e3o de posts e p\u00e1ginas, facilitando a cria\u00e7\u00e3o conte\u00fados mais elaborados. Ele tem “blocos” para facilitar aquilo que atualmente envolveria shortcodes, HTML personalizados ou uma confus\u00e3o de elementos incorporados.<\/p>\nMatt Mullenweg, 2017<\/cite><\/blockquote>\n\n\n\n

    A informa\u00e7\u00e3o que corresponde \u00e0 origem da cita\u00e7\u00e3o \u00e9 um campo separado, similar \u00e0s legendas sob as imagens, de forma que a estrutura da cita\u00e7\u00e3o esteja sempre certa, mesmo que voc\u00ea selecione, modifique ou remova essa origem. Tamb\u00e9m fica f\u00e1cil adicion\u00e1-la de volta.<\/p>\n\n\n\n

    Os blocos podem ser qualquer coisa que voc\u00ea precisar. Por exemplo, voc\u00ea pode querer adicionar uma cita\u00e7\u00e3o t\u00edmida como parte da composi\u00e7\u00e3o do texto, ou talvez prefira exibir uma em estilo gigante. Todas essas op\u00e7\u00f5es est\u00e3o dispon\u00edveis no adicionador.<\/p>\n\n\n\n

    \n
    \"\"\/<\/figure>\n\n\n\n
    \"\"\/<\/figure>\n\n\n\n
    \"\"\/<\/figure>\n<\/figure>\n\n\n\n

    Voc\u00ea pode mudar a quantidade de colunas em suas galerias mexendo no controle deslizante do inspetor de bloco da barra lateral.<\/p>\n\n\n\n

    Rico em m\u00eddia<\/h2>\n\n\n\n

    Se voc\u00ea combinar os novos alinhamentos largura ampla<\/strong> e largura total<\/strong> com galerias, voc\u00ea pode criar uma boa apresenta\u00e7\u00e3o visual muito rapidamente:<\/p>\n\n\n\n

    \"A<\/figure>\n\n\n\n

    \u00c9 claro que uma imagem ocupando a largura total pode ficar muito grande. Mas \u00e0s vezes a imagem vale a pena.<\/p>\n\n\n\n

    \n
    \"\"\/<\/figure>\n\n\n\n
    \"\"\/<\/figure>\n<\/figure>\n\n\n\n

    A galeria acima tem somente duas imagens. \u00c9 uma maneira mais f\u00e1cil de ter um visual atraente, sem ter que lidar com floats, um c\u00f3digo CSS que pode ser bem complicado. Voc\u00ea tamb\u00e9m pode facilmente converter a galeria de volta a imagens individuais, usando o bot\u00e3o de transforma\u00e7\u00e3o de blocos.<\/p>\n\n\n\n

    Qualquer bloco pode usar estes alinhamentos, at\u00e9 o bloco de m\u00eddias incorporadas, que j\u00e1 \u00e9 responsivo por padr\u00e3o:<\/p>\n\n\n\n

    \n