{"id":22568,"date":"2018-11-14T11:22:06","date_gmt":"2018-11-14T19:22:06","guid":{"rendered":"https:\/\/kinqsta.com\/?p=34914"},"modified":"2025-02-25T09:24:48","modified_gmt":"2025-02-25T12:24:48","slug":"tema-twenty-nineteen","status":"publish","type":"post","link":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/","title":{"rendered":"Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)"},"content":{"rendered":"<p><a href=\"https:\/\/kinqsta.com\/pt\/blog\/wordpress-5-0\/\" target=\"_blank\" rel=\"noopener noreferrer\">O WordPress 5.0<\/a> est\u00e1 chegando e muitos de n\u00f3s nos sentimos animados e preocupados ao mesmo tempo. O <a href=\"https:\/\/kinqsta.com\/pt\/blog\/editor-gutenberg-wordpress\/\" target=\"_blank\" rel=\"noopener noreferrer\">Gutenberg<\/a>\u00a0traz uma grande mudan\u00e7a na forma como usamos o WordPress e h\u00e1 definitivamente alguma preocupa\u00e7\u00e3o com rela\u00e7\u00e3o ao que acontecer\u00e1 com nossos sites se precisarmos atualizar nossas instala\u00e7\u00f5es sem test\u00e1-lo previamente. Mas n\u00e3o se preocupe, temos uma postagem sobre como <a href=\"https:\/\/kinqsta.com\/pt\/blog\/desabilitar-o-editor-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener noreferrer\">desativar o Editor para o WordPress Gutenberg<\/a>\u00a0(mesmo que temporariamente) para impedir que temas e plug-ins n\u00e3o suportados invadam nossos sites.<\/p>\n<p>Voc\u00ea pode se surpreender ao saber que j\u00e1 estamos usando o WordPress 5.0. De fato, estamos! Como Matt afirmou no <a href=\"https:\/\/make.wordpress.org\/core\/2018\/10\/03\/a-plan-for-5-0\/\" target=\"_blank\" rel=\"noopener noreferrer\">blog Make WordPress<\/a>:<\/p>\n<blockquote><p>Se mantivermos a vers\u00e3o 5.0 estritamente para o Gutenberg 4.9.8 +, teremos um lan\u00e7amento ao mesmo tempo grande e um n\u00e3o-evento em termos de c\u00f3digo novo. \u00c9 tudo testado atrav\u00e9s do uso. De certa forma, o 5.0 j\u00e1 est\u00e1 de fato por a\u00ed, com alguns hosts mais avan\u00e7ados j\u00e1 instalando e ativando o Gutenberg para novas instala\u00e7\u00f5es.<\/p><\/blockquote>\n<p>Isso significa que j\u00e1 temos o WordPress 5.0 em execu\u00e7\u00e3o nos nossos servidores: \u00e9 apenas o WordPress 4.9.8, com o Gutenberg no centro. Na verdade, isso n\u00e3o \u00e9 tudo, porque o WordPress 5.0 vem com uma entrada adicional, que \u00e9 o nov\u00edssimo <strong>tema padr\u00e3o Twenty Nineteen<\/strong>.<\/p>\n<figure id=\"attachment_22585\" aria-describedby=\"caption-attachment-22585\" style=\"width: 1553px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-22585\" src=\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/twenty-nineteen-wordpress-tema-1.jpg\" alt=\"tema twenty nineteen\" width=\"1553\" height=\"1429\" srcset=\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/twenty-nineteen-wordpress-tema-1.jpg 1553w, https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/twenty-nineteen-wordpress-tema-1-300x276.jpg 300w, https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/twenty-nineteen-wordpress-tema-1-768x707.jpg 768w, https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/twenty-nineteen-wordpress-tema-1-1024x942.jpg 1024w, https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/twenty-nineteen-wordpress-tema-1-610x561.jpg 610w\" sizes=\"auto, (max-width: 1553px) 100vw, 1553px\" \/><figcaption id=\"caption-attachment-22585\" class=\"wp-caption-text\">Tema Twenty Nineteen<\/figcaption><\/figure>\n<p>Ent\u00e3o vamos mergulhar e ver o que h\u00e1 de novo.<\/p>\n<ul>\n<li><a href=\"#gutenberg-twenty-nineteen\">Sobre o Gutenberg e o Twenty Nineteen<\/a><\/li>\n<li><a href=\"#installing-twenty-nineteen\">Instalando o Twenty Nineteen<\/a><\/li>\n<li><a href=\"#look-feel-twenty-nineteen-theme\">A Apar\u00eancia e Funcionamento do Twenty Nineteen<\/a><\/li>\n<li><a href=\"#theming-for-gutenberg\">Temas para Gutenberg: Uma Abordagem de Desenvolvedor<\/a><\/li>\n<\/ul>\n<h2 id=\"gutenberg-twenty-nineteen\">Sobre o Gutenberg e o Twenty Nineteen<\/h2>\n<p>Alguns de voc\u00eas podem n\u00e3o gostar do Gutenberg. Al\u00e9m disso, o debate sobre o novo editor est\u00e1 longe de terminar, mas considere o <a href=\"https:\/\/make.wordpress.org\/themes\/2018\/03\/07\/getting-ready-for-gutenberg\/\" target=\"_blank\" rel=\"noopener noreferrer\">campo de aplica\u00e7\u00e3o do Gutenberg<\/a>:<\/p>\n<blockquote><p>Esses blocos personalizados mudam a maneira como usu\u00e1rios, desenvolvedores e hosts interagem com o WordPress para criar um conte\u00fado da Web mais f\u00e1cil e intuitivo, <strong>democratizando a publica\u00e7\u00e3o e o trabalho para todos, independentemente da capacidade t\u00e9cnica<\/strong>.<\/p><\/blockquote>\n<p>\u00c9 isso que o Gutenberg pretende fazer, e o Twenty Nineteen d\u00e1 um passo \u00e0 frente, sendo constru\u00eddo com o Gutenberg e para o Gutenberg. Trata-se de um tema de blog minimalista, baseado em tipografia, com um layout de coluna \u00fanica e pode ser usado para criar uma ampla gama de sites, desde blogs pessoais a sites de pequenas empresas.<\/p>\n<p>Escrever sobre o Twenty Nineteen significa principalmente que estamos escrevendo sobre Gutenberg. No Twenty Nineteen, o Gutenberg permite que os usu\u00e1rios n\u00e3o apenas criem conte\u00fado, mas at\u00e9 construam seus sites inteiros no editor. De acordo com Allan Cole no <a href=\"https:\/\/make.wordpress.org\/core\/2018\/10\/16\/introducing-twenty-nineteen\/\" target=\"_blank\" rel=\"noopener noreferrer\">blog Make WordPress<\/a>,<\/p>\n<blockquote><p>O Gutenberg concede aos usu\u00e1rios um n\u00edvel sem precedentes de liberdade para personalizar o layout e o design de seus sites. Para atingir plenamente sua vis\u00e3o, os usu\u00e1rios precisar\u00e3o de uma nova gera\u00e7\u00e3o de temas flex\u00edveis, criados para aproveitar a liberdade criativa que o Gutenberg oferece.<br \/>\nCom isso em mente, o WordPress 5.0 ser\u00e1 lan\u00e7ado com um novo tema padr\u00e3o: o Twenty Nineteen<\/p><\/blockquote>\n<p>No tema Twenty Nineteen, o Gutenberg \u00e9 mais do que um criador de conte\u00fado, <strong>\u00e9 um criador de sites<\/strong> e os usu\u00e1rios do WordPress poder\u00e3o construir seus sites inteiros aproveitando os blocos. E se o Gutenberg ainda n\u00e3o te interessa, a maioria dos <a href=\"https:\/\/kinqsta.com\/pt\/blog\/construtores-de-paginas-wordpress\/\" target=\"_blank\" rel=\"noopener noreferrer\">plug-ins populares de cria\u00e7\u00e3o de p\u00e1ginas<\/a> tamb\u00e9m est\u00e1 adicionando suporte ao Gutenberg.<\/p>\n<p>(Sugest\u00e3o de leitura: <a href=\"https:\/\/kinqsta.com\/pt\/blog\/twenty-twenty-tema\/\">Uma Introdu\u00e7\u00e3o ao Tema Twenty Twenty<\/a>)<\/p>\n\n<h2 id=\"installing-twenty-nineteen\">Instalando o Twenty Nineteen<\/h2>\n<p>O tema Twenty Nineteen deve seguir o plano de lan\u00e7amento da nova vers\u00e3o principal do WordPress. No entanto, o WordPress 5.0 deve ser lan\u00e7ado em 19 de novembro e \u00e9 poss\u00edvel que uma vers\u00e3o funcional do Twenty Nineteen n\u00e3o esteja pronta at\u00e9 essa data. Veja todas as poss\u00edveis <a href=\"https:\/\/kinqsta.com\/pt\/blog\/wordpress-5-0\/#wordpress-5-release-date\" target=\"_blank\" rel=\"noopener noreferrer\">datas de lan\u00e7amento para o WordPress 5.0<\/a>. De qualquer forma, o tema est\u00e1 dispon\u00edvel para download no <a href=\"https:\/\/github.com\/WordPress\/twentynineteen\" target=\"_blank\" rel=\"noopener noreferrer\">Github<\/a> e vai ficar l\u00e1 at\u00e9 que ele seja inclu\u00eddo definitivamente.<\/p>\n<p>O Twenty Nineteen \u00e9 baseado no <a href=\"https:\/\/github.com\/Automattic\/_s\/\" target=\"_blank\" rel=\"noopener noreferrer\">_s<\/a> e no <a href=\"https:\/\/github.com\/WordPress\/gutenberg-starter-theme\" target=\"_blank\" rel=\"noopener noreferrer\">gutenberg-starter-theme<\/a> e vem com Sass dentro. Depois de obter o pacote .zip, extraia o tema e envie\/mova a pasta de temas para o diret\u00f3rio <code>\/wp-content\/themes<\/code> da sua instala\u00e7\u00e3o de teste. Voc\u00ea tamb\u00e9m pode envi\u00e1-lo a partir do seu painel do WordPress.<\/p>\n<figure style=\"width: 530px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/10\/add-new-theme.png\" alt=\"Fazendo upload de um novo tema do painel do WordPress\" width=\"530\" height=\"696\"><figcaption class=\"wp-caption-text\">Fazendo upload de um novo tema do painel do WordPress<\/figcaption><\/figure>\n<p>Os clientes da Kinsta podem instal\u00e1-lo em seus <a href=\"https:\/\/kinqsta.com\/pt\/docs\/hospedagem-de-wordpress\/ambiente-de-teste\/\" target=\"_blank\" rel=\"noopener noreferrer\">ambientes de prepara\u00e7\u00e3o<\/a>. Se voc\u00ea n\u00e3o est\u00e1 com a Kinsta, ainda pode <a href=\"https:\/\/kinqsta.com\/pt\/blog\/instalar-wordpress-localmente\/\" target=\"_blank\" rel=\"noopener noreferrer\">instal\u00e1 lo em sua m\u00e1quina local<\/a>.<\/p>\n<figure style=\"width: 1329px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/active-twenty-nineteen-theme.jpg\" alt=\"Twenty Nineteen instalados com sucesso\" width=\"1329\" height=\"823\"><figcaption class=\"wp-caption-text\">Twenty Nineteen instalados com sucesso<\/figcaption><\/figure>\n<h2 id=\"look-feel-twenty-nineteen-theme\">A Apar\u00eancia do Twenty Nineteen<\/h2>\n<p>O layout de coluna \u00fanica enfatiza o conte\u00fado e se adapta melhor a blocos de largura total ou blocos largos. O tema n\u00e3o suporta barras laterais e inclui apenas dois menus de navega\u00e7\u00e3o: o menu <strong>Principal<\/strong> e o <strong>Menu de Links Sociais<\/strong>, ambos posicionados no cabe\u00e7alho da p\u00e1gina e o <strong>Menu Rodap\u00e9<\/strong>, localizado no rodap\u00e9.<\/p>\n<figure style=\"width: 721px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full \" src=\"https:\/\/kinqsta.com\/wp-content\/uploads\/2018\/10\/twenty-nineteen-header.jpg\" alt=\"Twenty Nineteen header\" width=\"721\" height=\"221\"><figcaption class=\"wp-caption-text\">Site title, site description, and menus in Twenty Nineteen header<\/figcaption><\/figure>\n<p>A p\u00e1gina do blog se parece com uma p\u00e1gina normal de blog e imagens em destaque s\u00e3o habilitadas. Postagens \u00fanicas e p\u00e1ginas mostram melhor o potencial da vers\u00e3o atual do Gutenberg como um construtor de sites.<\/p>\n<p>J\u00e1 que \u00e9 totalmente baseado no Gutenberg, as caracter\u00edsticas do Twenty Nineteen dependem principalmente do ciclo de desenvolvimento do Gutenberg e da disponibilidade de blocos. Podemos adicionar blocos de widgets, blocos de c\u00f3digos curtos, galerias, c\u00f3digo HTML e assim por diante. No entanto, todos esses blocos est\u00e3o longe de cobrir todas as nossas necessidades. Mas felizmente temos v\u00e1rios plugins que nos permitem adicionar novos blocos ao Gutenberg, como <a href=\"https:\/\/wordpress.org\/plugins\/atomic-blocks\/\" target=\"_blank\" rel=\"noopener noreferrer\">Atomic Blocks<\/a><u>,<\/u> <a href=\"https:\/\/wordpress.org\/plugins\/advanced-gutenberg\/\" target=\"_blank\" rel=\"noopener noreferrer\">Advanced Gutenberg<\/a> e <a href=\"https:\/\/wpstackable.com\/\">Stackable<\/a>. Existem at\u00e9 projetos como o <a href=\"https:\/\/gutenbergcloud.org\/\" target=\"_blank\" rel=\"noopener noreferrer\">Gutenberg Cloud<\/a> que surgiram.<\/p>\n<p>Se voc\u00ea acha que o tema parece muito minimalista, considere que o Twenty Nineteen ainda \u00e9 um trabalho em andamento. N\u00e3o temos certeza se ele ser\u00e1 inclu\u00eddo definitivamente at\u00e9 o lan\u00e7amento do WordPress 5.0 e podemos esperar v\u00e1rias adi\u00e7\u00f5es e resolu\u00e7\u00f5es de problemas no futuro pr\u00f3ximo. Al\u00e9m disso, h\u00e1 muitos problemas ainda n\u00e3o resolvidos e recursos que precisam ser implementados. Por exemplo, no momento em que este artigo foi escrito, o Twenty Nineteen n\u00e3o oferece suporte a submenus<u>,<\/u> <a href=\"https:\/\/github.com\/WordPress\/twentynineteen\/issues\/243\" target=\"_blank\" rel=\"noopener noreferrer\">Cabe\u00e7alhos Personalizados e Cabe\u00e7alhos de V\u00eddeo<\/a>, mas esperamos que esses recursos sejam adicionados em um per\u00edodo de tempo razo\u00e1vel.<\/p>\n<p>Se voc\u00ea tiver interesse no status do tema, confira a <a href=\"https:\/\/github.com\/WordPress\/twentynineteen\/issues\/\" target=\"_blank\" rel=\"noopener noreferrer\">lista completa de problemas no Github<\/a>.<\/p>\n<h2 id=\"theming-for-gutenberg\">Temas para Gutenberg: Uma Abordagem Para Desenvolvedores<\/h2>\n<p>Pronto para o uso, o Gutenberg fornece suporte b\u00e1sico para estilos de bloco em temas, e os desenvolvedores de temas s\u00e3o livres para substituir os estilos padr\u00e3o do Gutenberg com seus estilos personalizados. Mas os desenvolvedores tamb\u00e9m podem omitir completamente estilos personalizados e decidir confiar exclusivamente no Gutenberg para customizar blocos na frente do site.<\/p>\n<p>Ter um editor que se parece com o conte\u00fado final melhora a experi\u00eancia de escrita do autor e permite que todos se sintam \u00e0 vontade com a interface do usu\u00e1rio.<\/p>\n<p>De qualquer forma, alguns estilos e recursos de apresenta\u00e7\u00e3o do Gutenberg exigem que os temas ativamente adicionem suporte a eles e isso pode ser feito selecionando <code><a href=\"https:\/\/wordpress.org\/gutenberg\/handbook\/extensibility\/theme-support\/\" target=\"_blank\" rel=\"noopener noreferrer\">add_theme_support<\/a><\/code> no arquivo <code>functions.php<\/code> quando a a\u00e7\u00e3o <code><a href=\"https:\/\/codex.wordpress.org\/Plugin_API\/Action_Reference\/after_setup_theme\" target=\"_blank\" rel=\"noopener noreferrer\">after_setup_theme<\/a><\/code> \u00e9 acionada. Aqui est\u00e1 um exemplo de uma implementa\u00e7\u00e3o de recurso:<\/p>\n<pre><code class=\"language-php\">function mytheme_setup() {\n    \/\/ Add support for Block Styles\n    add_theme_support( 'wp-block-styles' );\n}\nadd_action( 'after_setup_theme', 'mytheme_setup' );<\/code><\/pre>\n<p>Abaixo est\u00e1 listada uma sele\u00e7\u00e3o destes recursos do Gutenberg, algumas das quais tamb\u00e9m s\u00e3o suportadas pelo Twenty Nineteen. Voc\u00ea encontrar\u00e1 a lista completa de recursos no <a href=\"https:\/\/wordpress.org\/gutenberg\/handbook\/extensibility\/theme-support\/#block-font-sizes\" target=\"_blank\" rel=\"noopener noreferrer\">Manual do Gutenberg<\/a>.<\/p>\n<h3>Adicionando Suporte para Estilos de Apresenta\u00e7\u00e3o de Bloco do Gutenberg<\/h3>\n<p><a href=\"https:\/\/make.wordpress.org\/core\/2018\/06\/05\/whats-new-in-gutenberg-5th-june\/\" target=\"_blank\" rel=\"noopener noreferrer\">Um dos objetivos<\/a> da equipe por tr\u00e1s do Gutenberg era construir um sistema flex\u00edvel de customiza\u00e7\u00e3o dentro dos temas e chegar o mais pr\u00f3ximo poss\u00edvel \u201cda paridade visual entre o site acabado e o editor\u201d. O objetivo \u00e9 fornecer ao usu\u00e1rio uma visualiza\u00e7\u00e3o precisa do conte\u00fado, da mesma forma que ele ser\u00e1 exibido no site pronto.<\/p>\n<p>Para atingir esse objetivo, a equipe teve que separar estilos de apresenta\u00e7\u00e3o e estilos estruturais. Por padr\u00e3o, os estilos de apresenta\u00e7\u00e3o n\u00e3o s\u00e3o carregados no site pronto, para evitar afetar a apar\u00eancia do site. De qualquer forma, novos temas podem tirar proveito dos estilos de apresenta\u00e7\u00e3o do Gutenberg simplesmente habilitando-os com o seguinte registro (veja o <a href=\"https:\/\/wordpress.org\/gutenberg\/handbook\/extensibility\/theme-support\/#default-block-styles\" target=\"_blank\" rel=\"noopener noreferrer\">Manual<\/a> para mais detalhes):<\/p>\n<pre><code class=\"language-php\">\/\/ Add support for Block Styles\nadd_theme_support( 'wp-block-styles' );<\/code><\/pre>\n<p>Como voc\u00ea pode esperar, <strong>o Twenty Nineteen tem suporte para os estilos de blocos do Gutenberg. <\/strong>No site acabado, a p\u00e1gina de postagem \u00fanica \u00e9 muito parecida com a p\u00e1gina de edi\u00e7\u00e3o de postagem, com a \u00fanica diferen\u00e7a da imagem em destaque, que \u00e9 exibida em uma \u00e1rea de trabalho como uma imagem de plano de fundo cobrindo toda a janela de exibi\u00e7\u00e3o. A imagem abaixo mostra o Gutenberg em a\u00e7\u00e3o na p\u00e1gina de edi\u00e7\u00e3o.<\/p>\n<figure style=\"width: 420px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/10\/gutenberg-wordpress-editor-1.jpg\" alt=\"Gutenberg WordPress editor no modo de tela cheia\" width=\"420\" height=\"545\"><figcaption class=\"wp-caption-text\">Gutenberg WordPress editor no modo de tela cheia<\/figcaption><\/figure>\n<p>E aqui est\u00e1 o mesmo post no site acabado.<\/p>\n<figure style=\"width: 320px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/10\/twenty-nineteen-single-post-page-1.jpg\" alt=\"Postagem unica no Twenty Nineteen\" width=\"320\" height=\"836\"><figcaption class=\"wp-caption-text\">Postagem unica no Twenty Nineteen<\/figcaption><\/figure>\n<h3>Alinhamentos Largos e de Largura Totais<\/h3>\n<p>O Gutenberg tamb\u00e9m oferece duas op\u00e7\u00f5es de alinhamento adicionais: <a href=\"https:\/\/wordpress.org\/gutenberg\/handbook\/extensibility\/theme-support\/#wide-alignment\" target=\"_blank\" rel=\"noopener noreferrer\">alinhamento largo e de largura total<\/a>, mas <strong>voc\u00ea pode selecionar o alinhamento Largo ou de Largura total apenas se o seu tema tiver suporte para eles<\/strong>. Em caso afirmativo, o Gutenberg mostra dois \u00edcones adicionais de alinhamento.<\/p>\n<figure style=\"width: 317px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/10\/alignment-option-buttons.png\" alt=\"Bot\u00f5es de alinhamento de largura e largura total em Gutenberg\" width=\"317\" height=\"58\"><figcaption class=\"wp-caption-text\">Bot\u00f5es de alinhamento de largura e largura total em Gutenberg<\/figcaption><\/figure>\n<p>A imagem abaixo mostra as imagens <strong>Align center<\/strong>, <strong>Wide width<\/strong> e <strong>Full-width<\/strong> em Twenty Nineteen.<\/p>\n<figure style=\"width: 360px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/10\/alignment-options-1.jpg\" alt=\"Alinhar ao centro, Largura larga e Largura total comparada\" width=\"360\" height=\"634\"><figcaption class=\"wp-caption-text\">Alinhar ao centro, Largura larga e Largura total comparada<\/figcaption><\/figure>\n<p>Depois que adicionamos suporte a alinhamentos Largos e Largura total, devemos fornecer as declara\u00e7\u00f5es CSS para duas classes CSS adicionais:<\/p>\n<pre><code class=\"language-php\">\/\/ Add support for full and wide align images\nadd_theme_support( 'align-wide' );<\/code><\/pre>\n<p>Depois que adicionamos suporte a alinhamentos Largos e Largura total, devemos fornecer as declara\u00e7\u00f5es CSS para duas classes CSS adicionais: <code>alignfull<\/code>e <code>alignwide<\/code>. Twenty Nineteen fornece os seguintes estilos:<\/p>\n<pre><code class=\"language-css\">.entry-content &gt; *.alignwide,\n.entry-summary &gt; *.alignwide {\n    margin-left: auto;\n    margin-right: auto;\n}\n\n@media only screen and (min-width: 768px) {\n    .entry-content &gt; *.alignwide,\n    .entry-summary &gt; *.alignwide {\n        margin-left: calc(1 * (100vw \/ 12));\n        margin-right: calc(1 * (100vw \/ 12));\n        max-width: calc(10 * (100vw \/ 12));\n  }\n}\n\n.entry-content &gt; *.alignfull,\n.entry-summary &gt; *.alignfull {\n    margin-top: calc(2 * 1rem);\n    margin-right: 0;\n    margin-bottom: calc(2 * 1rem);\n    margin-left: 0;\n    max-width: 100%;\n}\n\n.entry-content .wp-block-image.alignfull img {\n    width: 100vw;\n    margin-left: auto;\n    margin-right: auto;\n}<\/code><\/pre>\n<p>Nota: Tenha cuidado ao usar esta op\u00e7\u00e3o, porque pode causar problemas se voc\u00ea mudar de tema (leia mais sobre este t\u00f3pico no <a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/4342\" target=\"_blank\" rel=\"noopener noreferrer\">Github<\/a>).<\/p>\n<h3>Estilo do Editor<\/h3>\n<p>O <a href=\"https:\/\/codex.wordpress.org\/Editor_Style\" target=\"_blank\" rel=\"noopener noreferrer\">Estilo do Editor<\/a> \u00e9 um recurso introduzido com o WordPress 3.0, permitindo que os desenvolvedores de temas adicionem estilos personalizados ao editor do TinyMCE. O Gutenberg tamb\u00e9m oferece suporte para esse recurso, mas ele funciona de maneira diferente do Editor Cl\u00e1ssico, que carrega estilos diretamente no <a href=\"https:\/\/kinqsta.com\/pt\/blog\/incorporar-videos-youtube-wordpress\/\">iframe<\/a> do editor. O Gutenberg adiciona seletores CSS espec\u00edficos, pois n\u00e3o usa um iframe.<\/p>\n<p>Podemos adicionar suporte para estilos de editor da seguinte forma:<\/p>\n<pre><code class=\"language-php\">\/\/ Add support for editor styles\nadd_theme_support( 'editor-styles' );\n\/\/ Enqueue editor styles\nadd_editor_style( 'style-editor.css' );<\/code><\/pre>\n<p>Esse recurso tamb\u00e9m \u00e9 suportado pelo Twenty Nineteen. Voc\u00ea pode aprofundar seu conhecimento sobre este t\u00f3pico no <a href=\"https:\/\/wordpress.org\/gutenberg\/handbook\/extensibility\/theme-support\/#editor-styles\" target=\"_blank\" rel=\"noopener noreferrer\">Estilo do Editor no Gutenberg<\/a>.<\/p>\n<h3>Paletas de Cores do Bloco<\/h3>\n<p>O Gutenberg fornece um seletor de cores gen\u00e9rico no painel Configura\u00e7\u00f5es de Cor do editor. Os desenvolvedores de temas podem aprimorar essa ferramenta adicionando paletas de cores personalizadas, permitindo que os usu\u00e1rios capturem rapidamente a cor certa para blocos de fundo e texto. Este \u00e9 um processo de duas etapas:<\/p>\n<p>Primeiro, temos que fornecer uma matriz de cores:<\/p>\n<pre><code class=\"language-php\">add_theme_support( 'editor-color-palette', array(\n    array(\n        'name' =&gt; __( 'hot pink', 'themeLangDomain' ),\n        'slug' =&gt; 'hot-pink',\n        'color' =&gt; '#f865b0',\n    ),\n    array(\n        'name' =&gt; __( 'classic rose', 'themeLangDomain' ),\n        'slug' =&gt; 'classic-rose',\n        'color' =&gt; '#fbcaef',\n    ),\n) );<\/code><\/pre>\n<p>Ent\u00e3o temos que declarar os estilos correspondentes na folha de estilo do tema:<\/p>\n<pre><code class=\"language-css\">.has-hot-pink-background-color {\n    background-color: #f865b0;\n}\n\n.has-hot-pink-color {\n    color: #f865b0;\n}<\/code><\/pre>\n<p>Os nomes de classes come\u00e7am com <code>has-<\/code>,\u00a0seguidos pelo slug de cor em kebab e terminam com o contexto, que pode ser <code>color<\/code> ou\u00a0<code>background-color<\/code>. Atualmente, o Twenty Nineteen n\u00e3o suporta paletas de cores de blocos, mas podemos facilmente mudar isso com um <a href=\"https:\/\/kinqsta.com\/pt\/blog\/tema-filho-no-wordpress\/\" target=\"_blank\" rel=\"noopener noreferrer\">tema filho<\/a>.<\/p>\n<figure style=\"width: 280px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/10\/block-color-palette.png\" alt=\"Uma paleta de cores personalizada em Gutenberg\" width=\"280\" height=\"244\"><figcaption class=\"wp-caption-text\">Uma paleta de cores personalizada em Gutenberg<\/figcaption><\/figure>\n<p>Em vez disso, se voc\u00ea quiser desativar uma paleta de cores personalizada, adicione a seguinte linha ao arquivo de fun\u00e7\u00f5es do seu tema ou do tema filho:<\/p>\n<pre><code class=\"language-php\">add_theme_support( 'disable-custom-colors' );<\/code><\/pre>\n<h3>Bloquear tamanhos de fonte<\/h3>\n<p>Um tema tamb\u00e9m pode substituir o conjunto padr\u00e3o de tamanhos de fonte do Gutenberg. Aqui est\u00e1 um exemplo do c\u00f3digo que voc\u00ea deve adicionar ao arquivo de fun\u00e7\u00f5es:<\/p>\n<pre><code class=\"language-php\">add_theme_support( 'editor-font-sizes', array(\n    array(\n        'name' =&gt; __( 'extra-small', 'themeLangDomain' ),\n        'shortName' =&gt; __( 'XS', 'themeLangDomain' ),\n        'size' =&gt; 10,\n        'slug' =&gt; 'extra-small'\n    ),\n    array(\n        'name' =&gt; __( 'small', 'themeLangDomain' ),\n        'shortName' =&gt; __( 'S', 'themeLangDomain' ),\n        'size' =&gt; 12,\n        'slug' =&gt; 'small'\n    ),\n    array(\n        'name' =&gt; __( 'regular', 'themeLangDomain' ),\n        'shortName' =&gt; __( 'M', 'themeLangDomain' ),\n        'size' =&gt; 16,\n        'slug' =&gt; 'regular'\n    ),\n    array(\n        'name' =&gt; __( 'large', 'themeLangDomain' ),\n        'shortName' =&gt; __( 'L', 'themeLangDomain' ),\n        'size' =&gt; 26,\n        'slug' =&gt; 'large'\n    ),\n    array(\n        'name' =&gt; __( 'larger', 'themeLangDomain' ),\n        'shortName' =&gt; __( 'XL', 'themeLangDomain' ),\n        'size' =&gt; 36,\n        'slug' =&gt; 'larger'\n    ),\n    array(\n        'name' =&gt; __( 'huge', 'themeLangDomain' ),\n        'shortName' =&gt; __( 'XXL', 'themeLangDomain' ),\n        'size' =&gt; 56,\n        'slug' =&gt; 'huge'\n    )\n) );<\/code><\/pre>\n<p>Os novos tamanhos de fonte ser\u00e3o adicionados ao seletor de tamanho de fonte nas Configura\u00e7\u00f5es de Texto do Gutenberg.<\/p>\n<figure style=\"width: 336px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full \" src=\"https:\/\/kinqsta.com\/wp-content\/uploads\/2018\/10\/font-sizes.png\" alt=\"Custom font sizes in Gutenberg\" width=\"336\" height=\"423\"><figcaption class=\"wp-caption-text\">Custom font sizes in Gutenberg<\/figcaption><\/figure>\n<p>Em seguida, temos que declarar os estilos correspondentes na folha de estilo do tema. O nome da classe deve come\u00e7ar com <code>has-<\/code>,\u00a0seguido pelo nome do tamanho da fonte em kebab e terminar com <code>-font-size<\/code>.<\/p>\n<pre><code class=\"language-css\">.has-huge-font-size {\n    font-size: 56px;\n}<\/code><\/pre>\n<p style=\"vertical-align: baseline;margin: 0cm 0cm 21.6pt 0cm\"><span style=\"font-size: 13.5pt;font-family: 'inherit',serif;color: #43414e\">O <\/span><span style=\"font-size: 13.5pt;font-family: Roboto;color: #43414e\">Twenty Nineteen<\/span><span style=\"font-size: 13.5pt;font-family: 'inherit',serif;color: #43414e\"> n\u00e3o fornece tamanhos de fonte espec\u00edficos e depende dos padr\u00f5es do Gutenberg.<\/span><\/p>\n<p>Nota: Lembre-se de que, para fazer todo esse c\u00f3digo funcionar, voc\u00ea deve conect\u00e1-lo \u00e0 a\u00e7\u00e3o <code>after_setup_theme<\/code>.<\/p>\n<h2>Resumo<\/h2>\n<p>O Twenty Nineteen poderia funcionar bem para blogs pessoais e voc\u00ea poderia pensar nisso mais como uma tela branca do que um tema WordPress totalmente funcional. Uma abordagem t\u00e3o minimalista pode ser um pouco limitante quando se trata de criar sites para neg\u00f3cios e com\u00e9rcio eletr\u00f4nico, mas n\u00e3o se preocupe: novos recursos devem ser implementados em breve e logo poderemos ver uma vers\u00e3o mais poderosa do Twenty Nineteen.<\/p>\n<p>Enquanto isso, voc\u00ea tamb\u00e9m pode dar uma olhada em alguns temas que j\u00e1 est\u00e3o oferecendo suporte para o Gutenberg. <a href=\"https:\/\/wordpress.org\/themes\/atomic-blocks\/\" target=\"_blank\" rel=\"noopener noreferrer\">Atomic Blocks<\/a>, <a href=\"https:\/\/generatepress.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">GeneratePress<\/a>, <a href=\"https:\/\/themeforest.net\/item\/gutentype-gutenberg-wordpress-blog-theme\/22486033\" target=\"_blank\" rel=\"noopener noreferrer\">Gutentype<\/a> e <a href=\"https:\/\/www.elegantthemes.com\/blog\/theme-releases\/divi-feature-update-introducing-initial-gutenberg-support\" target=\"_blank\" rel=\"noopener noreferrer\">Divi<\/a>, para citar alguns, mas muitos outros devem vir em breve. Com o WordPress 5.0 se aproximando t\u00e3o r\u00e1pido, oferecer suporte para o Gutenberg n\u00e3o \u00e9 uma escolha e os desenvolvedores de temas devem abra\u00e7ar o novo editor do WordPress o mais r\u00e1pido poss\u00edvel para se manter \u00e0 frente da concorr\u00eancia.<\/p>\n<p style=\"margin: 0cm;margin-bottom: .0001pt;vertical-align: baseline\"><span style=\"font-size: 13.5pt;font-family: 'inherit',serif;color: #43414e\">Voc\u00ea j\u00e1 instalou o <\/span><span style=\"font-size: 13.5pt;font-family: Roboto;color: #43414e\">Twenty Nineteen<\/span><span style=\"font-size: 13.5pt;font-family: 'inherit',serif;color: #43414e\"> ou qualquer tema que ofere\u00e7a suporte ao Gutenberg? Gostar\u00edamos de saber sua opini\u00e3o nos coment\u00e1rios abaixo.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>O WordPress 5.0 est\u00e1 chegando e muitos de n\u00f3s nos sentimos animados e preocupados ao mesmo tempo. O Gutenberg\u00a0traz uma grande mudan\u00e7a na forma como usamos &#8230;<\/p>\n","protected":false},"author":36,"featured_media":22579,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[65,30],"topic":[1036],"class_list":["post-22568","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","tag-gutenberg","tag-wordpress","topic-temas-wordpress"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)<\/title>\n<meta name=\"description\" content=\"O Tema Twenty Nineteen \u00e9 o novo tema padr\u00e3o do WordPress 5.0 e \u00e9 tudo sobre Gutenberg. Confira o que h\u00e1 de novo no desenvolvimento de temas com Gutenberg.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/\" \/>\n<meta property=\"og:locale\" content=\"pt_PT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)\" \/>\n<meta property=\"og:description\" content=\"O Tema Twenty Nineteen \u00e9 o novo tema padr\u00e3o do WordPress 5.0 e \u00e9 tudo sobre Gutenberg. Confira o que h\u00e1 de novo no desenvolvimento de temas com Gutenberg.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/kinstapt\/\" \/>\n<meta property=\"article:published_time\" content=\"2018-11-14T19:22:06+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-02-25T12:24:48+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2024\/11\/PT-Homepage-featured-image.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"628\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Carlo Daniele\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"O Tema Twenty Nineteen \u00e9 o novo tema padr\u00e3o do WordPress 5.0 e \u00e9 tudo sobre Gutenberg. Confira o que h\u00e1 de novo no desenvolvimento de temas com Gutenberg.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinqsta.com\/wp-content\/uploads\/2018\/10\/twenty-nineteen-theme.png\" \/>\n<meta name=\"twitter:creator\" content=\"@carlodaniele\" \/>\n<meta name=\"twitter:site\" content=\"@kinsta_pt\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Carlo Daniele\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo estimado de leitura\" \/>\n\t<meta name=\"twitter:data2\" content=\"13 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/\"},\"author\":{\"name\":\"Carlo Daniele\",\"@id\":\"https:\/\/kinqsta.com\/pt\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63\"},\"headline\":\"Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)\",\"datePublished\":\"2018-11-14T19:22:06+00:00\",\"dateModified\":\"2025-02-25T12:24:48+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/\"},\"wordCount\":2337,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinqsta.com\/pt\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/tema-twenty-nineteen.png\",\"keywords\":[\"Gutenberg\",\"WordPress\"],\"articleSection\":[\"Melhores Tutoriais WordPress\"],\"inLanguage\":\"pt-PT\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/\",\"url\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/\",\"name\":\"Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)\",\"isPartOf\":{\"@id\":\"https:\/\/kinqsta.com\/pt\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/tema-twenty-nineteen.png\",\"datePublished\":\"2018-11-14T19:22:06+00:00\",\"dateModified\":\"2025-02-25T12:24:48+00:00\",\"description\":\"O Tema Twenty Nineteen \u00e9 o novo tema padr\u00e3o do WordPress 5.0 e \u00e9 tudo sobre Gutenberg. Confira o que h\u00e1 de novo no desenvolvimento de temas com Gutenberg.\",\"breadcrumb\":{\"@id\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#breadcrumb\"},\"inLanguage\":\"pt-PT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-PT\",\"@id\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#primaryimage\",\"url\":\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/tema-twenty-nineteen.png\",\"contentUrl\":\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/tema-twenty-nineteen.png\",\"width\":1460,\"height\":730},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinqsta.com\/pt\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Temas WordPress\",\"item\":\"https:\/\/kinqsta.com\/pt\/topicos\/temas-wordpress\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinqsta.com\/pt\/#website\",\"url\":\"https:\/\/kinqsta.com\/pt\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Solu\u00e7\u00f5es de hospedagem Premium, r\u00e1pida e segura\",\"publisher\":{\"@id\":\"https:\/\/kinqsta.com\/pt\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinqsta.com\/pt\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-PT\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinqsta.com\/pt\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinqsta.com\/pt\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-PT\",\"@id\":\"https:\/\/kinqsta.com\/pt\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinqsta.com\/pt\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/kinstapt\/\",\"https:\/\/x.com\/kinsta_pt\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinqsta.com\/pt\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63\",\"name\":\"Carlo Daniele\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-PT\",\"@id\":\"https:\/\/kinqsta.com\/pt\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g\",\"caption\":\"Carlo Daniele\"},\"description\":\"Carlo is a passionate lover of webdesign and front-end development. He has been playing with WordPress for more than 20 years, also in collaboration with Italian and European universities and educational institutions. He has written hundreds of articles and guides about WordPress, published both on Italian and international websites, as well as on printed magazines. You can find him on LinkedIn.\",\"sameAs\":[\"https:\/\/frammentidicodice.com\/\",\"https:\/\/x.com\/carlodaniele\"],\"url\":\"https:\/\/kinqsta.com\/pt\/blog\/author\/carlodaniele\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)","description":"O Tema Twenty Nineteen \u00e9 o novo tema padr\u00e3o do WordPress 5.0 e \u00e9 tudo sobre Gutenberg. Confira o que h\u00e1 de novo no desenvolvimento de temas com Gutenberg.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/","og_locale":"pt_PT","og_type":"article","og_title":"Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)","og_description":"O Tema Twenty Nineteen \u00e9 o novo tema padr\u00e3o do WordPress 5.0 e \u00e9 tudo sobre Gutenberg. Confira o que h\u00e1 de novo no desenvolvimento de temas com Gutenberg.","og_url":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/kinstapt\/","article_published_time":"2018-11-14T19:22:06+00:00","article_modified_time":"2025-02-25T12:24:48+00:00","og_image":[{"width":1200,"height":628,"url":"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2024\/11\/PT-Homepage-featured-image.png","type":"image\/png"}],"author":"Carlo Daniele","twitter_card":"summary_large_image","twitter_description":"O Tema Twenty Nineteen \u00e9 o novo tema padr\u00e3o do WordPress 5.0 e \u00e9 tudo sobre Gutenberg. Confira o que h\u00e1 de novo no desenvolvimento de temas com Gutenberg.","twitter_image":"https:\/\/kinqsta.com\/wp-content\/uploads\/2018\/10\/twenty-nineteen-theme.png","twitter_creator":"@carlodaniele","twitter_site":"@kinsta_pt","twitter_misc":{"Escrito por":"Carlo Daniele","Tempo estimado de leitura":"13 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#article","isPartOf":{"@id":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/"},"author":{"name":"Carlo Daniele","@id":"https:\/\/kinqsta.com\/pt\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63"},"headline":"Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)","datePublished":"2018-11-14T19:22:06+00:00","dateModified":"2025-02-25T12:24:48+00:00","mainEntityOfPage":{"@id":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/"},"wordCount":2337,"commentCount":0,"publisher":{"@id":"https:\/\/kinqsta.com\/pt\/#organization"},"image":{"@id":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#primaryimage"},"thumbnailUrl":"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/tema-twenty-nineteen.png","keywords":["Gutenberg","WordPress"],"articleSection":["Melhores Tutoriais WordPress"],"inLanguage":"pt-PT","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/","url":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/","name":"Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)","isPartOf":{"@id":"https:\/\/kinqsta.com\/pt\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#primaryimage"},"image":{"@id":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#primaryimage"},"thumbnailUrl":"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/tema-twenty-nineteen.png","datePublished":"2018-11-14T19:22:06+00:00","dateModified":"2025-02-25T12:24:48+00:00","description":"O Tema Twenty Nineteen \u00e9 o novo tema padr\u00e3o do WordPress 5.0 e \u00e9 tudo sobre Gutenberg. Confira o que h\u00e1 de novo no desenvolvimento de temas com Gutenberg.","breadcrumb":{"@id":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#breadcrumb"},"inLanguage":"pt-PT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/"]}]},{"@type":"ImageObject","inLanguage":"pt-PT","@id":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#primaryimage","url":"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/tema-twenty-nineteen.png","contentUrl":"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2018\/11\/tema-twenty-nineteen.png","width":1460,"height":730},{"@type":"BreadcrumbList","@id":"https:\/\/kinqsta.com\/pt\/blog\/tema-twenty-nineteen\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinqsta.com\/pt\/"},{"@type":"ListItem","position":2,"name":"Temas WordPress","item":"https:\/\/kinqsta.com\/pt\/topicos\/temas-wordpress\/"},{"@type":"ListItem","position":3,"name":"Introdu\u00e7\u00e3o ao Tema Twenty Nineteen (Temas para Gutenberg)"}]},{"@type":"WebSite","@id":"https:\/\/kinqsta.com\/pt\/#website","url":"https:\/\/kinqsta.com\/pt\/","name":"Kinsta\u00ae","description":"Solu\u00e7\u00f5es de hospedagem Premium, r\u00e1pida e segura","publisher":{"@id":"https:\/\/kinqsta.com\/pt\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinqsta.com\/pt\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-PT"},{"@type":"Organization","@id":"https:\/\/kinqsta.com\/pt\/#organization","name":"Kinsta","url":"https:\/\/kinqsta.com\/pt\/","logo":{"@type":"ImageObject","inLanguage":"pt-PT","@id":"https:\/\/kinqsta.com\/pt\/#\/schema\/logo\/image\/","url":"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinqsta.com\/pt\/wp-content\/uploads\/sites\/3\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinqsta.com\/pt\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/kinstapt\/","https:\/\/x.com\/kinsta_pt","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinqsta.com\/pt\/#\/schema\/person\/962dde02ea6f5df089b5d8d0853bbc63","name":"Carlo Daniele","image":{"@type":"ImageObject","inLanguage":"pt-PT","@id":"https:\/\/kinqsta.com\/pt\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/429e5568f88110fd9a409b84cb22197e?s=96&d=mm&r=g","caption":"Carlo Daniele"},"description":"Carlo is a passionate lover of webdesign and front-end development. He has been playing with WordPress for more than 20 years, also in collaboration with Italian and European universities and educational institutions. He has written hundreds of articles and guides about WordPress, published both on Italian and international websites, as well as on printed magazines. You can find him on LinkedIn.","sameAs":["https:\/\/frammentidicodice.com\/","https:\/\/x.com\/carlodaniele"],"url":"https:\/\/kinqsta.com\/pt\/blog\/author\/carlodaniele\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/posts\/22568","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/users\/36"}],"replies":[{"embeddable":true,"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/comments?post=22568"}],"version-history":[{"count":15,"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/posts\/22568\/revisions"}],"predecessor-version":[{"id":35747,"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/posts\/22568\/revisions\/35747"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/translations\/en"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/translations\/it"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/translations\/fr"},{"embeddable":true,"hreflang":"da","title":"Danish","href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/translations\/dk"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/translations\/es"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/translations\/pt"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/translations\/de"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/translations\/jp"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/translations\/nl"},{"embeddable":true,"hreflang":"sv","title":"Swedish","href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/translations\/se"},{"href":"https:\/\/kinqsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/22568\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/media\/22579"}],"wp:attachment":[{"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/media?parent=22568"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/tags?post=22568"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinqsta.com\/pt\/wp-json\/wp\/v2\/topic?post=22568"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}