{"id":64047,"date":"2023-10-16T15:18:33","date_gmt":"2023-10-16T18:18:33","guid":{"rendered":"https:\/\/kinsta.com\/pt\/?p=64047&preview=true&preview_id=64047"},"modified":"2023-10-24T06:18:27","modified_gmt":"2023-10-24T09:18:27","slug":"tema-twenty-twenty-four","status":"publish","type":"post","link":"https:\/\/kinsta.com\/pt\/blog\/tema-twenty-twenty-four\/","title":{"rendered":"Twenty Twenty-Four: O Novo Tema Padr\u00e3o Multi\u00faso Minimalista do WordPress"},"content":{"rendered":"

Twenty Twenty-Four<\/strong> \u00e9 o mais novo tema padr\u00e3o do WordPress<\/a> que ser\u00e1 lan\u00e7ado com o WordPress vers\u00e3o 6.4.<\/p>\n

A ideia por tr\u00e1s do Twenty Twenty-Four<\/a> \u00e9 servir como um tema padr\u00e3o adequado a qualquer tipo de site, independentemente do t\u00f3pico do site. Ele foi criado para tr\u00eas casos de uso: propriet\u00e1rios de pequenas empresas, fot\u00f3grafos<\/a> e artistas<\/a>, e escritores e blogueiros<\/a>.<\/p>\n

Mais do que um tema, o Twenty Twenty-Four \u00e9 uma cole\u00e7\u00e3o de templates e padr\u00f5es<\/a> que, combinados, permitem criar uma grande variedade de sites. Dessa forma, voc\u00ea pode considerar o Twenty Twenty-Four um tema multi\u00faso, embora seja absolutamente minimalista.<\/p>\n

Como voc\u00ea pode esperar, o Twenty Twenty-Four \u00e9 um tema de bloco totalmente compat\u00edvel com todas as coisas incr\u00edveis que v\u00eam com o WordPress 6.4, incluindo o bloco de detalhes e o texto vertical.<\/p>\n

Ap\u00f3s essa r\u00e1pida introdu\u00e7\u00e3o ao novo tema padr\u00e3o do WordPress, exploraremos neste artigo os diversos templates, padr\u00f5es e estilos para mostrar como criar um site atraente, responsivo, utiliz\u00e1vel e acess\u00edvel com o Twenty Twenty-Four.<\/p>\n

Agora, abra o Site Editor, pressione Cmd + k<\/strong> e digite Templates<\/strong>.<\/p>\n

\"Lan\u00e7amento
Lan\u00e7amento de templates no WordPress 6.4.<\/figcaption><\/figure>\n
<\/div><\/kinsta-auto-toc>\n

O tema WordPress Twenty Twenty-Four<\/h2>\n

O Twenty Twenty-Four nos d\u00e1 um exemplo perfeito de um tema de bloco do WordPress. Ao acessar a pasta do tema na instala\u00e7\u00e3o do WordPress<\/a>, voc\u00ea encontrar\u00e1 um arquivo functions.php<\/strong><\/a> extremamente simples, cuja \u00fanica finalidade \u00e9 enfileirar um punhado de folhas de estilo para blocos espec\u00edficos.<\/p>\n

O arquivo de fun\u00e7\u00f5es do Twenty Twenty-Four \u00e9 um bom exemplo de como otimizar um tema, garantindo que recursos espec\u00edficos sejam incorporados somente quando forem necess\u00e1rios. O c\u00f3digo a seguir enfileira a folha de estilo button-outline.css<\/strong> somente quando um bot\u00e3o est\u00e1 na p\u00e1gina:<\/p>\n

if ( ! function_exists( 'twentytwentyfour_block_styles' ) ) :\n\t\/**\n\t * Register custom block styles\n\t *\n\t * @return void\n\t * @since Twenty Twenty-Four 1.0\n\t *\n\t *\/\n\tfunction twentytwentyfour_block_styles() {\n\t\t\/**\n\t\t * The wp_enqueue_block_style() function allows us to enqueue a stylesheet\n\t\t * for a specific block. These will only get loaded when the block is rendered\n\t\t * (both in the editor and on the front end), improving performance\n\t\t * and reducing the amount of data requested by visitors.\n\t\t *\n\t\t * See https:\/\/make.wordpress.org\/core\/2021\/12\/15\/using-multiple-stylesheets-per-block\/ for more info.\n\t\t *\/\n\t\twp_enqueue_block_style(\n\t\t\t'core\/button',\n\t\t\tarray(\n\t\t\t\t'handle' => 'twentytwentyfour-button-style-outline',\n\t\t\t\t'src'    => get_template_directory_uri() . '\/assets\/css\/button-outline.css',\n\t\t\t\t'ver'    => wp_get_theme()->get( 'Version' ),\n\t\t\t)\n\t\t);\n\t}\n\t...\nendif;<\/code><\/pre>\n
O tema n\u00e3o fornece nenhuma funcionalidade ao seu site WordPress, e voc\u00ea depender\u00e1 totalmente dos plugins para adicionar comportamento \u00e0s suas p\u00e1ginas. Assim, o arquivo functions.php<\/strong> do Twenty Twenty-Four cuida apenas do enfileiramento de folhas de estilo espec\u00edficas para blocos espec\u00edficos.<\/p>\n
Continuando com nossa explora\u00e7\u00e3o da pasta do tema Twenty Twenty-Four, voc\u00ea notar\u00e1 que o arquivo style.css<\/strong> inclui apenas um cabe\u00e7alho com os detalhes necess\u00e1rios para que o tema funcione corretamente, n\u00e3o contendo nenhum bloco CSS:<\/p>\n
\/*\nTheme Name: Twenty Twenty-Four\nTheme URI: https:\/\/wordpress.org\/themes\/twentytwentyfour\nAuthor: the WordPress team\nAuthor URI: https:\/\/wordpress.org\nDescription: Twenty Twenty-Four is designed to be flexible, versatile, and applicable to any website. Its collection of templates and patterns is tailored to different needs, such as presenting a business, blogging, and writing or showcasing work. A multitude of possibilities open up with just a few adjustments to color and typography. Twenty Twenty-Four comes with style variations and full-page designs to help speed up the site-building process, is fully compatible with the site editor, and takes advantage of new design tools introduced in WordPress 6.4.\nRequires at least: 6.2\nTested up to: 6.4\nRequires PHP: 7.0\nVersion: 1.0\nLicense: GNU General Public License v2 or later\nLicense URI: http:\/\/www.gnu.org\/licenses\/gpl-2.0.html\nText Domain: twentytwentyfour\nTags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news\n*\/<\/code><\/pre>\n
Voc\u00ea tamb\u00e9m encontrar\u00e1 uma pasta assets<\/strong>, que cont\u00e9m uma pasta fonts<\/strong>, um conjunto de imagens<\/strong> e uma pasta css<\/strong>, que inclui a folha de estilo button-outline.css<\/strong>.<\/p>\n
O estilo padr\u00e3o do Twenty Twenty-Four usa duas fontes: Cardo<\/a> para t\u00edtulos e Inter<\/a> para outros elementos de texto.<\/p>\n
\"Visualiza\u00e7\u00e3o
Visualiza\u00e7\u00e3o da fonte Cardo no Google Fonts.<\/figcaption><\/figure>\n
As fam\u00edlias de fontes Jost<\/a> e Instrument Sans<\/a> tamb\u00e9m est\u00e3o dispon\u00edveis e s\u00e3o usadas em algumas varia\u00e7\u00f5es de estilo.<\/p>\n
A seguir, voc\u00ea encontrar\u00e1 quatro pastas que cont\u00eam a verdadeira ess\u00eancia do tema padr\u00e3o do Twenty Twenty-Four:<\/p>\n