{"id":9266,"date":"2019-08-04T22:24:50","date_gmt":"2019-08-04T22:24:50","guid":{"rendered":"http:\/\/docs.itthinx.com\/?post_type=document&#038;p=9266"},"modified":"2025-02-05T14:56:35","modified_gmt":"2025-02-05T14:56:35","slug":"blocks","status":"publish","type":"document","link":"https:\/\/docs.itthinx.com\/document\/groups\/blocks\/","title":{"rendered":"Blocks"},"content":{"rendered":"\n<p>Groups provides blocks which you can use to show content based on memberships. These blocks help you to make sections of content visible to group members only. They can also be used to hide certain sections from group members.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The <strong>Groups Member<\/strong> block reveals its content to group members.<\/li>\n\n\n\n<li>The <strong>Groups Non-member<\/strong> block hides its content from group members.<\/li>\n<\/ul>\n\n\n\n<div style=\"height:21px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n<div class=\"wp-block-image is-style-default\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;69eb42ed5661a&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"69eb42ed5661a\" class=\"aligncenter size-full wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"960\" height=\"460\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Browser-highlighted.png\" alt=\"The membership blocks that the Groups plugin provides are shown in the WordPress block browser.\" class=\"wp-image-9884\" srcset=\"https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Browser-highlighted.png 960w, https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Browser-highlighted-300x144.png 300w, https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Browser-highlighted-768x368.png 768w\" sizes=\"auto, (max-width: 960px) 100vw, 960px\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Enlarge\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"state.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n\n\n<div style=\"height:42px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>The <strong>Groups Member<\/strong> block and the <strong>Groups Non-member<\/strong> block restrict access to the content they enclose. You can use them to protect simple or complex block compositions. They can contain any number of arbitrary blocks and can also be nested.<\/p>\n\n\n\n<div style=\"height:42px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Groups Member Block<\/h2>\n\n\n\n<p>This block shows its content to group members. When you use this block, you will select one or more groups for it so that the block&#8217;s content is visible to them.<\/p>\n\n\n\n<p>Here is an example where the block simply contains a paragraph of text and is restricted to registered users. We just have to select the <em>Registered<\/em> group in the block&#8217;s settings.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;69eb42ed56d14&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"69eb42ed56d14\" class=\"aligncenter size-full wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"960\" height=\"440\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Groups-Member.png\" alt=\"\" class=\"wp-image-9898\" srcset=\"https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Groups-Member.png 960w, https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Groups-Member-300x138.png 300w, https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Groups-Member-768x352.png 768w\" sizes=\"auto, (max-width: 960px) 100vw, 960px\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Enlarge\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"state.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n\n\n<div style=\"height:42px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Groups Non-member Block<\/h2>\n\n\n\n<p>This block allows to hide its content from group members. As with the previous one, you are going to select one or more groups for it and it will hide its content from the members of those groups.<\/p>\n\n\n\n<p>Let&#8217;s look at a simple example for this block. Here we show a paragraph of text to those users who are not registered or logged in. For this, we simply selected the <em>Registered<\/em> group in the block&#8217;s settings.<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;69eb42ed5734d&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"69eb42ed5734d\" class=\"aligncenter size-full wp-lightbox-container\"><img loading=\"lazy\" decoding=\"async\" width=\"960\" height=\"440\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Groups-Non-member.png\" alt=\"\" class=\"wp-image-9901\" srcset=\"https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Groups-Non-member.png 960w, https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Groups-Non-member-300x138.png 300w, https:\/\/docs.itthinx.com\/wp-content\/uploads\/2019\/08\/Groups-Blocks-Groups-Non-member-768x352.png 768w\" sizes=\"auto, (max-width: 960px) 100vw, 960px\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Enlarge\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"state.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div>\n\n\n<div style=\"height:42px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>The documentation on <a href=\"https:\/\/docs.itthinx.com\/document\/groups\/access-control\/content-sections\/\" data-type=\"document\" data-id=\"7426\">Content Sections<\/a> provides additional examples and information on the use of these blocks.<\/p>\n\n\n\n<p>&nbsp;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":7424,"menu_order":5,"template":"","document_category":[],"document_tag":[],"class_list":["post-9266","document","type-document","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/docs.itthinx.com\/wp-json\/wp\/v2\/document\/9266","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/docs.itthinx.com\/wp-json\/wp\/v2\/document"}],"about":[{"href":"https:\/\/docs.itthinx.com\/wp-json\/wp\/v2\/types\/document"}],"author":[{"embeddable":true,"href":"https:\/\/docs.itthinx.com\/wp-json\/wp\/v2\/users\/1"}],"version-history":[{"count":15,"href":"https:\/\/docs.itthinx.com\/wp-json\/wp\/v2\/document\/9266\/revisions"}],"predecessor-version":[{"id":9905,"href":"https:\/\/docs.itthinx.com\/wp-json\/wp\/v2\/document\/9266\/revisions\/9905"}],"up":[{"embeddable":true,"href":"https:\/\/docs.itthinx.com\/wp-json\/wp\/v2\/document\/7424"}],"wp:attachment":[{"href":"https:\/\/docs.itthinx.com\/wp-json\/wp\/v2\/media?parent=9266"}],"wp:term":[{"taxonomy":"document_category","embeddable":true,"href":"https:\/\/docs.itthinx.com\/wp-json\/wp\/v2\/document_category?post=9266"},{"taxonomy":"document_tag","embeddable":true,"href":"https:\/\/docs.itthinx.com\/wp-json\/wp\/v2\/document_tag?post=9266"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}