{"id":146,"date":"2021-12-01T10:34:43","date_gmt":"2021-12-01T13:34:43","guid":{"rendered":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/?page_id=146"},"modified":"2021-12-14T12:34:24","modified_gmt":"2021-12-14T15:34:24","slug":"bloco-de-insercao-design","status":"publish","type":"page","link":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/editor-de-blocos\/exemplificando-blocos\/bloco-de-insercao-design\/","title":{"rendered":"Bloco de Inser\u00e7\u00e3o: Design"},"content":{"rendered":"\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" width=\"329\" height=\"299\" src=\"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-content\/uploads\/sites\/172\/2021\/12\/image-10.png\" alt=\"\" class=\"wp-image-448\" srcset=\"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-content\/uploads\/sites\/172\/2021\/12\/image-10.png 329w, https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-content\/uploads\/sites\/172\/2021\/12\/image-10-300x273.png 300w\" sizes=\"(max-width: 329px) 100vw, 329px\" \/><\/figure>\n\n\n\n<h2>\u00cdndice<\/h2>\n\n\n\n<p><a href=\"#buttons\">Bot\u00f5es (buttons)<\/a><br><a href=\"#columns\" data-type=\"internal\" data-id=\"#columns\">Colunas (columns)<\/a><br><a href=\"#group\">Grupo (group)<\/a><br><a href=\"#separator\">Separador (separator)<\/a><br><a href=\"#page breaker\">Separador de p\u00e1gina (page breaker)<\/a><br><a href=\"#spacer\">Espa\u00e7ador (spacer)<\/a><\/p>\n\n\n\n<h2 id=\"buttons\"><strong>Bot\u00f5es (buttons)<\/strong><\/h2>\n\n\n\n<p>Adicione bot\u00f5es. Ao clicar no bot\u00e3o o usu\u00e1rio ser\u00e1 direcionado para um link espec\u00edfico.<\/p>\n\n\n\n<div class=\"wp-container-1 wp-block-buttons\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link\">Esse \u00e9 um bot\u00e3o. Clique e veja o que acontece.<\/a><\/div>\n\n\n\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link\">Outro bot\u00e3o<\/a><\/div>\n\n\n\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link\">E outro<\/a><\/div>\n\n\n\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link\">Pode haver quanto bot\u00f5es voc\u00ea quiser.<\/a><\/div>\n<\/div>\n\n\n\n<p><\/p>\n\n\n\n<h2 id=\"columns\"><strong>Colunas (columns)<\/strong><\/h2>\n\n\n\n<p>Voc\u00ea pode escolher entre v\u00e1rias op\u00e7\u00f5es de colunas (em tamanho e quantidade). Em cada coluna podem ser colocados blocos diferentes. \u00c9 uma \u00f3tima forma de organizar seu blog.<\/p>\n\n\n\n<p><em>Duas colunas:<\/em><\/p>\n\n\n\n<div class=\"wp-container-4 wp-block-columns\">\n<div class=\"wp-container-2 wp-block-column\">\n<p>Coluna a<\/p>\n\n\n\n<p>Coluna a<\/p>\n\n\n\n<p>Coluna a<\/p>\n<\/div>\n\n\n\n<div class=\"wp-container-3 wp-block-column\">\n<p>coluna b<\/p>\n\n\n\n<p>Coluna b<\/p>\n\n\n\n<p>coluna b<\/p>\n<\/div>\n<\/div>\n\n\n\n<p><em>Tr\u00eas colunas:<\/em><\/p>\n\n\n\n<div class=\"wp-container-8 wp-block-columns\">\n<div class=\"wp-container-5 wp-block-column\" style=\"flex-basis:25%\">\n<p>Coluna a<\/p>\n\n\n\n<p>Coluna a<\/p>\n\n\n\n<p>Coluna a<\/p>\n<\/div>\n\n\n\n<div class=\"wp-container-6 wp-block-column\" style=\"flex-basis:50%\">\n<p class=\"has-text-align-center\">Coluna b<\/p>\n\n\n\n<p class=\"has-text-align-center\">Coluna b<\/p>\n\n\n\n<p class=\"has-text-align-center\">Coluna b<\/p>\n<\/div>\n\n\n\n<div class=\"wp-container-7 wp-block-column\" style=\"flex-basis:25%\">\n<p>Coluna c<\/p>\n\n\n\n<p>Coluna c<\/p>\n\n\n\n<p>Coluna c<\/p>\n<\/div>\n<\/div>\n\n\n\n<h2 id=\"group\"><strong>Grupo (group)<\/strong><\/h2>\n\n\n\n<p>Esse \u00e9 um bloco que agrupa blocos. Nele voc\u00ea pode colocar quantos blocos quiser.<\/p>\n\n\n\n<div class=\"wp-container-9 wp-block-group\"><div class=\"wp-block-group__inner-container\">\n<p>Bloco de Lista item 1<\/p>\n\n\n\n<p>Bloco de Lista item 2<\/p>\n\n\n\n<p>Bloco de Lista item 3<\/p>\n\n\n\n<p>Bloco de par\u00e1grafo<\/p>\n\n\n\n<pre class=\"wp-block-verse has-text-align-right\"><strong><em>Bloco de verso\nE nem\nPrecisa\nRimar<\/em><\/strong><\/pre>\n\n\n\n<h2 id=\"separator\"><strong>Separador (separator)<\/strong><\/h2>\n\n\n\n<p>Cria uma separa\u00e7\u00e3o entre ideias, se\u00e7\u00f5es, textos, entre outros, com uma linha separadora. Exemplo:<\/p>\n\n\n\n<hr class=\"wp-block-separator has-text-color has-background has-vivid-purple-background-color has-vivid-purple-color\"\/>\n\n\n\n<h2 id=\"page-breaker\"><strong>Separador de p\u00e1gina (page breaker)<\/strong><\/h2>\n\n\n\n<p>Separador de p\u00e1gina (page break): separa o conte\u00fado em m\u00faltiplas p\u00e1ginas.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-rich is-provider-embed-handler\"><div class=\"wp-block-embed__wrapper\">\n<div style=\"width: 640px;\" class=\"wp-video\"><!--[if lt IE 9]><script>document.createElement('video');<\/script><![endif]-->\n<video class=\"wp-video-shortcode\" id=\"video-146-1\" width=\"640\" height=\"360\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/wordpress.org\/support\/files\/2019\/03\/Page-Break-Overview_hd.mp4?_=1\" \/><a href=\"https:\/\/wordpress.org\/support\/files\/2019\/03\/Page-Break-Overview_hd.mp4\">https:\/\/wordpress.org\/support\/files\/2019\/03\/Page-Break-Overview_hd.mp4<\/a><\/video><\/div>\n<\/div><figcaption>Como o page breaker funciona<\/figcaption><\/figure>\n\n\n\n<p><\/p>\n<\/div><\/div>\n\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n\n<h2 id=\"spacer\"><strong>Espa\u00e7ador (spacer)<\/strong><\/h2>\n\n\n\n<p>Cria um espa\u00e7o em branco entre os blocos. Voc\u00ea pode definir o tamanho do espa\u00e7ador.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-rich is-provider-embed-handler\"><div class=\"wp-block-embed__wrapper\">\n<div style=\"width: 640px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-146-2\" width=\"640\" height=\"360\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/mp4\" src=\"https:\/\/wordpress.org\/support\/files\/2020\/10\/How-the-spacer-block-works.mp4?_=2\" \/><a href=\"https:\/\/wordpress.org\/support\/files\/2020\/10\/How-the-spacer-block-works.mp4\">https:\/\/wordpress.org\/support\/files\/2020\/10\/How-the-spacer-block-works.mp4<\/a><\/video><\/div>\n<\/div><\/figure>\n\n\n\n<div style=\"height:201px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>Acima est\u00e1 o bloco separador que separa o v\u00eddeo desse par\u00e1grafo.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u00cdndice Bot\u00f5es (buttons)Colunas (columns)Grupo (group)Separador (separator)Separador de p\u00e1gina (page breaker)Espa\u00e7ador (spacer) Bot\u00f5es (buttons) Adicione bot\u00f5es. Ao clicar no bot\u00e3o o usu\u00e1rio ser\u00e1 direcionado para um link espec\u00edfico. Colunas (columns) Voc\u00ea pode escolher entre v\u00e1rias op\u00e7\u00f5es de colunas (em tamanho e&#8230; <a class=\"more-link\" href=\"https:\/\/sites.ufca.edu.br\/treinamento-sites\/editor-de-blocos\/exemplificando-blocos\/bloco-de-insercao-design\/\">Continue Reading &rarr;<\/a><\/p>\n","protected":false},"author":211,"featured_media":0,"parent":88,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-json\/wp\/v2\/pages\/146"}],"collection":[{"href":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-json\/wp\/v2\/users\/211"}],"replies":[{"embeddable":true,"href":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-json\/wp\/v2\/comments?post=146"}],"version-history":[{"count":21,"href":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-json\/wp\/v2\/pages\/146\/revisions"}],"predecessor-version":[{"id":449,"href":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-json\/wp\/v2\/pages\/146\/revisions\/449"}],"up":[{"embeddable":true,"href":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-json\/wp\/v2\/pages\/88"}],"wp:attachment":[{"href":"https:\/\/sites.ufca.edu.br\/treinamento-sites\/wp-json\/wp\/v2\/media?parent=146"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}