{"id":228191,"date":"2022-10-16T09:40:00","date_gmt":"2022-10-16T06:40:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=228191"},"modified":"2022-11-09T01:12:04","modified_gmt":"2022-11-08T22:12:04","slug":"uzywanie-pol-post-meta-do-przechowywania-atrybutow-w-edytorze-blokow-wordpress-gutenberg","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pl\/uzywanie-pol-post-meta-do-przechowywania-atrybutow-w-edytorze-blokow-wordpress-gutenberg\/","title":{"rendered":"U\u017cywanie p\u00f3l Post Meta do przechowywania atrybut\u00f3w w edytorze blok\u00f3w WordPress (Gutenberg)"},"content":{"rendered":"\n<p>Kiedy rejestrujesz i przechowujesz atrybuty w edytorze blok\u00f3w WordPress (Gutenberg), masz mo\u017cliwo\u015b\u0107 przechowywania ich jako post meta zamiast zwyk\u0142ych atrybut\u00f3w bloku.<\/p>\n<p>Korzystaj\u0105c z tej metody, mo\u017cesz mie\u0107 ustawienie w swoim bloku, kt\u00f3re mo\u017ce kontrolowa\u0107 co\u015b w szerokim zakresie lub w szablonie.<\/p>\n<p><strong>Wa\u017cna uwaga na temat renderowania atrybut\u00f3w meta postu<\/strong><\/p>\n<p>Nie mo\u017cna renderowa\u0107 atrybut\u00f3w meta postu przy u\u017cyciu metody zapisu JavaScript. Zesp\u00f3\u0142 Gutenberga podj\u0105\u0142 decyzj\u0119, aby temu zapobiec, poniewa\u017c bloki, kt\u00f3re renderuj\u0105 pola meta postu, mo\u017cna \u0142atwo z\u0142ama\u0107, poniewa\u017c meta postu zmienia si\u0119 w innym miejscu w po\u015bcie.<\/p>\n<p>W tym przewodniku zamierzamy rozwin\u0105\u0107 to, co ju\u017c zbudowali\u015bmy w naszym <a href=\"https:\/\/wholesomecode.ltd\/guides\/creating-plugin-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">przewodniku po wtyczkach WordPress Gutenberg<\/a>, a tak\u017ce <a href=\"https:\/\/wholesomecode.ltd\/guides\/php-render-block-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">przewodniku po blokach dynamicznych<\/a>.<\/p>\n<h2>Warunki wst\u0119pne<\/h2>\n<ul>\n<li>Zapoznaj si\u0119 z <a href=\"https:\/\/wholesomecode.ltd\/guides\/creating-plugin-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">tworzeniem wtyczek do WordPress Gutenberg<\/a><\/li>\n<li>Poznaj <a href=\"https:\/\/wholesomecode.ltd\/guides\/php-render-block-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">dynamiczne bloki i renderowanie po stronie serwera<\/a><\/li>\n<\/ul>\n<h2>Rejestracja Post Meta w PHP<\/h2>\n<p>Zanim b\u0119dziemy mogli u\u017cy\u0107 meta pola post w JavaScript, musimy upewni\u0107 si\u0119, \u017ce zarejestrowali\u015bmy je w PHP za pomoc\u0105 <code>register_meta<\/code>i \u017ce <code>show_in_rest<\/code>argument zosta\u0142 ustawiony na true.<\/p>\n<p>Kontynuuj\u0105c <a href=\"https:\/\/wholesomecode.ltd\/guides\/php-render-block-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">przewodnik po blokach dynamicznych<\/a>, otw\u00f3rz g\u0142\u00f3wny plik PHP wtyczki (w tym przypadku <code>wholesome-plugin.php<\/code>) i dodaj nast\u0119puj\u0105cy kod na ko\u0144cu tego pliku po wszystkich innych funkcjach:<\/p>\n<pre><code>function wholesomecode_wholesome_plugin_register_post_meta() {\n    register_meta(\n        'post',\n        '_wholesomecode_wholesome_plugin_block_text',\n        [\n            'auth_callback' =&gt; '__return_true',\n            'default'       =&gt; __( 'Wholesome Plugin \u2013 hello from the editor!', 'wholesome-plugin' ),\n            'show_in_rest'  =&gt; true,\n            'single'        =&gt; true,\n            'type'          =&gt; 'string',\n        ]\n    );\n}\nadd_action( 'init', 'wholesomecode_wholesome_plugin_register_post_meta' );\n<\/code><\/pre>\n<p>Ten kod rejestruje pole meta wywo\u0142ywane <code>_wholesomecode_wholesome_plugin_block_text<\/code>dla <code>post<\/code>typu postu. Zapewnia r\u00f3wnie\u017c, \u017ce interfejs API REST mo\u017ce uzyska\u0107 dost\u0119p do tego pola meta z <code>show_in_rest<\/code>warto\u015bci\u0105 ustawion\u0105 na true.<\/p>\n<p>Przekazujemy r\u00f3wnie\u017c funkcj\u0119 <code>__return_true<\/code>do <code>auth_callback<\/code>argumentu, aby upewni\u0107 si\u0119, \u017ce mamy uprawnienia dost\u0119pu do tego parametru. Gdyby\u015bmy chcieli lepszego zabezpieczenia tego parametru, zmieniliby\u015bmy to na funkcj\u0119 niestandardow\u0105, kt\u00f3ra sprawdza okre\u015blon\u0105 rol\u0119 u\u017cytkownika.<\/p>\n<h2>Rejestrowanie atrybut\u00f3w Post Meta w JavaScript<\/h2>\n<p>Ponownie, kontynuuj\u0105c z poprzedniego przewodnika, otw\u00f3rz <code>\/src\/index.js<\/code>i zast\u0105p <code>attributes<\/code>nast\u0119puj\u0105cym:<\/p>\n<pre><code>attributes: {\n  blockText: {\n    meta: '_wholesomecode_wholesome_plugin_block_text',\n    source: 'meta',\n  },\n},\n<\/code><\/pre>\n<p>Zamiast okre\u015bla\u0107 typ atrybutu i przypisywa\u0107 warto\u015b\u0107 domy\u015bln\u0105, zamiast tego definiujemy klucz meta, z kt\u00f3rego b\u0119dzie pochodzi\u0142 atrybut danych, i wskazujemy, \u017ce <code>source<\/code>atrybut to <code>meta<\/code>.<\/p>\n<p>Jak wskazano w ostrze\u017ceniu na pocz\u0105tku tego przewodnika, nie mo\u017cesz uzyska\u0107 dost\u0119pu do atrybut\u00f3w pola meta za pomoc\u0105 <code>save<\/code>metody JavaScript, wi\u0119c skompiluj wtyczk\u0119 <code>npm start<\/code>i zobacz, jak mo\u017cemy wyprowadzi\u0107 meta.<\/p>\n<h2>Renderowanie postu Meta<\/h2>\n<p>Poniewa\u017c zapisali\u015bmy nasz atrybut jako post meta, mo\u017cemy to wypisa\u0107 w dowolnym miejscu w WordPressie za pomoc\u0105 <code>get_post_meta<\/code>(pod warunkiem, \u017ce mamy <code>$post_id<\/code>):<\/p>\n<pre><code>get_post_meta( $post_id, '_wholesomecode_wholesome_plugin_block_text', true );\n<\/code><\/pre>\n<p>Kontynuuj\u0105c <a href=\"https:\/\/wholesomecode.ltd\/guides\/php-render-block-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">przewodnik po blokach dynamicznych<\/a>, zobaczmy, jak mo\u017cemy uzyska\u0107 dost\u0119p do tego atrybutu po stronie serwera w PHP.<\/p>\n<p>Meta nie jest dost\u0119pna za po\u015brednictwem <code>$attributes<\/code>parametru <code>render_callback<\/code>, poniewa\u017c atrybuty meta postu nie przekazuj\u0105 swojej warto\u015bci do tego parametru, ale mo\u017cemy uzyska\u0107 dost\u0119p do <code>$post<\/code>obiektu globalnego, aby uzyska\u0107 identyfikator postu.<\/p>\n<p>Maj\u0105c to na uwadze, zaktualizujmy, <code>register_block_type<\/code>aby wyprowadzi\u0107 meta posta:<\/p>\n<pre><code>register_block_type(\n  'wholesomecode\/wholesome-plugin',\n  array(\n    'editor_script'   =&gt; 'wholesomecode-wholesome-plugin-block-editor',\n    'editor_style'    =&gt; 'wholesomecode-wholesome-plugin-block-editor',\n    'render_callback' =&gt; function( $attributes, $content) {\n      global $post;\n      $block_text = get_post_meta( $post-&gt;ID, '_wholesomecode_wholesome_plugin_block_text', true );\n      return \"&lt;p class='wp-block-wholesomecode-wholesome-plugin'&gt;$block_text&lt;\/p&gt;\";\n    },\n    'style'           =&gt; 'wholesomecode-wholesome-plugin-block',) );\n<\/code><\/pre>\n<p>Zauwa\u017c, \u017ce nie musimy ju\u017c rejestrowa\u0107 tego <code>attributes<\/code>tutaj, poniewa\u017c uzyskujemy dost\u0119p tylko do pola post meta za po\u015brednictwem <code>get_post_meta<\/code>funkcji.<\/p>\n<h3>Korzystanie z bloku<\/h3>\n<p>Nie jest to najlepszy przypadek u\u017cycia tego rodzaju meta, jednak gdy u\u017cywamy bloku, widzimy, \u017ce poniewa\u017c przechowujemy atrybuty jako meta posta, je\u015bli zaktualizujemy atrybut w jednym bloku, aktualizuje on wszystkie bloki, poniewa\u017c meta postu jest przechowywana w po\u015bcie, a nie w pojedynczym bloku:<\/p>\n<p>Opublikuj atrybuty meta w akcji<\/p>\n<ul>\n<li>Sp\u00f3jrz na tworzenie <a href=\"https:\/\/wholesomecode.ltd\/guides\/template-innerblocks-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">zagnie\u017cd\u017conych blok\u00f3w podrz\u0119dnych za pomoc\u0105 <code>InnerBlocks<\/code>komponentu<\/a><\/li>\n<li>Skorzystaj z post meta w Gutenbergu, <a href=\"https:\/\/wholesomecode.ltd\/guides\/create-custom-meta-boxes-using-the-wordpress-block-editor-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">tworz\u0105c niestandardowe Meta Boxes w Gutenberg<\/a><\/li>\n<li>Zobacz, jak <a href=\"https:\/\/wholesomecode.ltd\/guides\/options-settings-data-wordpress-gutenberg\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">u\u017cywa\u0107 ustawie\u0144 do przechowywania danych w tabeli opcji w Gutenberg<\/a><\/li>\n<\/ul>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">\u0179r\u00f3d\u0142o nagrywania:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/wholesomecode.ltd\" class=\"external external_icon\">wholesomecode.ltd<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Kiedy rejestrujesz i przechowujesz atrybuty w edytorze blok\u00f3w WordPress (Gutenberg), masz mo\u017cliwo\u015b\u0107 zapisania ich jako post meta zamiast zwyk\u0142ych atrybut\u00f3w bloku.Korzystanie z tego m&#8230;<\/p>\n","protected":false},"author":1,"featured_media":223685,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[721,940,919,897,866,815],"tags":[1169],"class_list":["post-228191","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-deweloper","category-gutenberg-7","category-inny","category-kod","category-wordpress-7","category-wtyczki","tag-affiai-pl"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/228191","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/comments?post=228191"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/posts\/228191\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media\/223685"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/media?parent=228191"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/categories?post=228191"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pl\/wp-json\/wp\/v2\/tags?post=228191"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}