{"id":228340,"date":"2022-10-17T10:34:00","date_gmt":"2022-10-17T07:34:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=228340"},"modified":"2022-11-09T01:57:41","modified_gmt":"2022-11-08T22:57:41","slug":"registre-una-plantilla-de-bloque-para-el-editor-de-bloques-de-wordpress-gutenberg","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/es\/registre-una-plantilla-de-bloque-para-el-editor-de-bloques-de-wordpress-gutenberg\/","title":{"rendered":"Registre una plantilla de bloque para el editor de bloques de WordPress (Gutenberg)"},"content":{"rendered":"\n<p>En mi gu\u00eda anterior, explor\u00e9 <a href=\"https:\/\/wholesomecode.ltd\/guides\/register-block-pattern-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">el poder de los patrones de bloques<\/a>. Las plantillas de bloques son similares, pero en lugar de depender de su cliente para insertar patrones de bloques en el editor, les brinda un dise\u00f1o completo tan pronto como insertan una nueva publicaci\u00f3n.<\/p>\n<h2>requisitos previos<\/h2>\n<ul>\n<li>Instalaci\u00f3n de WordPress<\/li>\n<li>Editor de c\u00f3digo<\/li>\n<\/ul>\n<h2>Crea tu plantilla de bloque<\/h2>\n<p>En este ejemplo, voy a insertar el mismo <a href=\"https:\/\/wholesomecode.ltd\/guides\/register-block-pattern-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">patr\u00f3n de bloque que cre\u00e9 en mi gu\u00eda anterior<\/a>, pero como una plantilla de bloque.<\/p>\n<p>En esa gu\u00eda copiamos el HTML de la salida del editor. En esta gu\u00eda, haremos algo ligeramente diferente y crearemos una matriz de espacios de nombres, propiedades y contenido de bloques.<\/p>\n<p>En su forma m\u00e1s simple, una plantilla de bloque se parece un poco a esto:<\/p>\n<pre><code>$block_template = [\n  [ 'core\/heading', [ 'level'   =&gt; 2, 'content' =&gt; 'Example Block Template' ] ],\n  [ 'core\/paragraph', [ 'content' =&gt; 'Lorem ipsum dolor sit amet labore cras venenatis.' ] ],\n];\n<\/code><\/pre>\n<p>Como puede ver, es una matriz que contiene bloques en el siguiente patr\u00f3n:<\/p>\n<ul>\n<li>Espacio de nombres de bloque<\/li>\n<li>Atributos de bloque<\/li>\n<\/ul>\n<p>Sin embargo, queremos usar bloques anidados, por lo que vamos a pasar un tercer par\u00e1metro a esta matriz de bloques, que son los bloques internos.<\/p>\n<p><strong>\u00bfSolo quieres la ubicaci\u00f3n del bloque?<\/strong><\/p>\n<p>Tenga en cuenta que puede dejar los atributos vac\u00edos, solo para proporcionar los bloques sin contenido establecido.<\/p>\n<p>La matriz para crear el mismo bloque que creamos en la gu\u00eda de patrones de bloques, necesitamos una matriz m\u00e1s compleja, as\u00ed:<\/p>\n<pre><code>$block_template = [\n  [\n    'core\/group',\n    [],\n    [\n      [\n        'core\/heading',\n        [\n          'level'   =&gt; 2,\n          'content' =&gt; 'Example Block Template',\n        ]\n      ],\n      [\n        'core\/paragraph',\n        [\n          'content' =&gt; 'Lorem ipsum dolor sit amet labore cras venenatis.',\n        ]\n      ],\n      [\n        'core\/columns',\n        [],\n        [\n          [\n            'core\/column',\n            [],\n            [\n              [\n                'core\/heading',\n                [\n                  'level'   =&gt; 3,\n                  'content' =&gt; 'Sub Heading 1',\n                ]\n              ],\n              [\n                'core\/paragraph',\n                [\n                  'content' =&gt; 'Lorem ipsum dolor sit amet id erat aliquet diam ullamcorper tempus massa eleifend vivamus.',\n                ]\n              ],\n            ]\n          ],\n          [\n            'core\/column',\n            [],\n            [\n              [\n                'core\/heading',\n                [\n                  'level'   =&gt; 3,\n                  'content' =&gt; 'Sub Heading 2',\n                ]\n              ],\n              [\n                'core\/paragraph',\n                [\n                  'content' =&gt; 'Morbi augue cursus quam pulvinar eget volutpat suspendisse dictumst mattis id.',\n                ]\n              ],\n            ]\n          ],\n        ],\n      ],\n    ]\n  ]\n];\n<\/code><\/pre>\n<h2>Registre la plantilla de bloque<\/h2>\n<h3>Registro de una plantilla de bloque para un tipo de publicaci\u00f3n existente<\/h3>\n<p>Para registrar una plantilla de bloque para un tipo de publicaci\u00f3n existente (como el <code>post<\/code>tipo de publicaci\u00f3n), puede usar el siguiente c\u00f3digo para anular el objeto de tipo de publicaci\u00f3n.<\/p>\n<pre><code>function register_block_template() {\n\n    $post_type_object                = get_post_type_object( 'post' );\n    $post_type_object-&gt;template      = $block_template;\n    $post_type_object-&gt;template_lock = 'all';\n}\nadd_action( 'init', 'register_block_template' );\n<\/code><\/pre>\n<p>Este c\u00f3digo simplemente establece la plantilla y (opcionalmente) el <code>[template_lock](https:\/\/wholesomecode.ltd\/#template-lock)<\/code>tipo.<\/p>\n<p>El c\u00f3digo completo se ver\u00eda as\u00ed:<\/p>\n<pre><code>function register_block_template() {\n    $block_template = [\n      [\n        'core\/group',\n        [],\n        [\n          [\n            'core\/heading',\n            [\n              'level'   =&gt; 2,\n              'content' =&gt; 'Example Block Template',\n            ]\n          ],\n          [\n            'core\/paragraph',\n            [\n              'content' =&gt; 'Lorem ipsum dolor sit amet labore cras venenatis.',\n            ]\n          ],\n          [\n            'core\/columns',\n            [],\n            [\n              [\n                'core\/column',\n                [],\n                [\n                  [\n                    'core\/heading',\n                    [\n                      'level'   =&gt; 3,\n                      'content' =&gt; 'Sub Heading 1',\n                    ]\n                  ],\n                  [\n                    'core\/paragraph',\n                    [\n                      'content' =&gt; 'Lorem ipsum dolor sit amet id erat aliquet diam ullamcorper tempus massa eleifend vivamus.',\n                    ]\n                  ],\n                ]\n              ],\n              [\n                'core\/column',\n                [],\n                [\n                  [\n                    'core\/heading',\n                    [\n                      'level'   =&gt; 3,\n                      'content' =&gt; 'Sub Heading 2',\n                    ]\n                  ],\n                  [\n                    'core\/paragraph',\n                    [\n                      'content' =&gt; 'Morbi augue cursus quam pulvinar eget volutpat suspendisse dictumst mattis id.',\n                    ]\n                  ],\n                ]\n              ],\n            ],\n          ],\n        ]\n      ]\n    ];\n\n    $post_type_object                = get_post_type_object( 'post' );\n    $post_type_object-&gt;template      = $block_template;\n    $post_type_object-&gt;template_lock = 'all';\n}\nadd_action( 'init', 'register_block_template' );\n<\/code><\/pre>\n<h3>Registro de una plantilla de bloque para un nuevo tipo de publicaci\u00f3n<\/h3>\n<p>Si est\u00e1 registrando un tipo de publicaci\u00f3n, puede pasar la plantilla al <code>template<\/code>argumento de <code>register_post_type<\/code>.<\/p>\n<p>Tambi\u00e9n puede pasar el <code>[template_lock](https:\/\/wholesomecode.ltd\/#template-lock)<\/code>argumento a <code>register_post_type<\/code>.<\/p>\n<h3>Bloqueo de plantilla<\/h3>\n<p>El <code>template_lock<\/code>argumento puede hacer varias cosas dependiendo del argumento que se le pase. Estos se enumeran en la <a href=\"https:\/\/developer.wordpress.org\/block-editor\/developers\/block-api\/block-templates\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">gu\u00eda de desarrollo de Gutenberg<\/a> como:<\/p>\n<ul>\n<li><code>all<\/code>\u2014 impide todas las operaciones. No es posible insertar nuevos bloques, mover bloques existentes o eliminar bloques.<\/li>\n<li><code>insert<\/code>\u2014 evita insertar o quitar bloques, pero permite mover bloques existentes.<\/li>\n<\/ul>\n<p><strong>El bloqueo de plantilla no funciona en bloques anidados<\/strong><\/p>\n<p>El bloqueo de plantilla solo funciona en bloques de nivel superior. Usa esto a tu favor creando un dise\u00f1o que tenga encabezados fijos, im\u00e1genes, p\u00e1rrafos y un \u00e1rea de grupo para que tu cliente inserte el contenido que desee.<\/p>\n<p>Tambi\u00e9n puede <a href=\"https:\/\/wholesomecode.ltd\/guides\/template-innerblocks-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">crear una plantilla de bloque anidado personalizada con InnerBlocks<\/a>.<\/p>\n<p>Tambi\u00e9n puede <a href=\"https:\/\/wholesomecode.ltd\/#allowed-block-types\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">limitar los bloques que puede insertar en ciertos tipos de publicaciones<\/a>.<\/p>\n<h2>Utilice la plantilla de bloque<\/h2>\n<p>Para usar la plantilla de bloque, simplemente cree una nueva publicaci\u00f3n (o un tipo de publicaci\u00f3n personalizada seg\u00fan c\u00f3mo haya configurado las cosas). Se insertar\u00e1 la plantilla y ahora tendr\u00e1 \u00e1reas de contenido fijas en su p\u00e1gina.<\/p>\n<p>Insertar una publicaci\u00f3n muestra la plantilla de bloque<\/p>\n<p>Puede limitar los bloques que est\u00e1n disponibles para varios tipos de publicaciones usando el siguiente c\u00f3digo.<\/p>\n<pre><code>function filter_allowed_block_types( $allowed_block_types, $post) {\n\n  if ($post-&gt;post_type !== 'post') {\n    return $allowed_block_types;\n  }\n\n  $allowed_block_types = [\n    'core\/column',\n    'core\/columns',\n    'core\/group',\n    'core\/heading',\n    'core\/paragraph',\n  ];\n\n  return $allowed_block_types;\n}\nadd_filter( 'allowed_block_types', 'filter_allowed_block_types', 10, 2 );\n<\/code><\/pre>\n<p>El c\u00f3digo anterior limita los bloques permitidos en el <code>post<\/code>tipo de publicaci\u00f3n a lo siguiente:<\/p>\n<ul>\n<li>\n<p>columna (<code>core\/column<\/code>)<\/p>\n<\/li>\n<li>\n<p>Columnas (<code>core\/column<\/code>s)<\/p>\n<\/li>\n<li>\n<p>Grupo (<code>core\/group<\/code>)<\/p>\n<\/li>\n<li>\n<p>Encabezado (<code>core\/heading<\/code>)<\/p>\n<\/li>\n<li>\n<p>P\u00e1rrafo (<code>core\/paragraph<\/code>)<\/p>\n<\/li>\n<li>\n<p>\u00bfNecesitas algo m\u00e1s flexible? Intente <a href=\"https:\/\/wholesomecode.ltd\/guides\/register-block-pattern-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">registrar un patr\u00f3n de bloque<\/a> en su lugar<\/p>\n<\/li>\n<li>\n<p>\u00bfNecesita algo que se aplique a los bloques para ni\u00f1os? Intente <a href=\"https:\/\/wholesomecode.ltd\/guides\/template-innerblocks-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">registrar una plantilla de InnerBlocks<\/a><\/p>\n<\/li>\n<\/ul>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fuente de grabaci\u00f3n:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/wholesomecode.ltd\" class=\"external external_icon\">wholesomecode.ltd<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>En mi gu\u00eda anterior explor\u00e9 el poder de los patrones de bloques. Las plantillas de bloques son similares, pero en lugar de depender de su cliente para insertar patrones de bloques en el editor, le da&#8230;<\/p>\n","protected":false},"author":1,"featured_media":223608,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[924,892,716,861],"tags":[1172],"class_list":["post-228340","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-asignaturas","category-codigo","category-desarrollador","category-wordpress-2","tag-affiai-es"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/posts\/228340","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/comments?post=228340"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/posts\/228340\/revisions"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/media?parent=228340"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/categories?post=228340"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/es\/wp-json\/wp\/v2\/tags?post=228340"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}