{"id":45,"date":"2025-09-26T08:50:53","date_gmt":"2025-09-26T08:50:53","guid":{"rendered":"https:\/\/ska-blocks.com\/docs\/2025\/09\/26\/variations\/"},"modified":"2025-09-26T09:44:12","modified_gmt":"2025-09-26T09:44:12","slug":"variations","status":"publish","type":"post","link":"https:\/\/ska-blocks.com\/docs\/variations\/","title":{"rendered":"Variations"},"content":{"rendered":"\n<p class=\"lead\">Variations allow you to save the state of the current block (and its&#8217; children) and make a new &#8220;Block&#8221; (<em>Block variation<\/em>) from it that you can insert like any other block.<\/p>\n\n\n\n<p>The functionality is very similar to the core WordPress Block patterns also known as Reusable blocks. Variations are an experimental feature that may become obsolete when WordPress implementation of block patterns becomes a viable alternative.<\/p>\n\n\n\n<p>Since ska-blocks gives you powerful blocks like <a href=\"https:\/\/ska-blocks.com\/docs\/ska-blocks\/element-block\/\" data-type=\"post\" data-id=\"203\">Element<\/a> and <a href=\"https:\/\/ska-blocks.com\/docs\/ska-blocks\/text-block\/\" data-type=\"post\" data-id=\"213\">Text<\/a>  as well as <a href=\"https:\/\/ska-blocks.com\/docs\/ska-blocks\/presets\/\" data-type=\"post\" data-id=\"327\">Presets<\/a> which can create anything imaginable, you may want to package some of it up to conveniently re-use. Click the block icon and choose <strong>Create variation<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/ska-blocks.com\/docs\/wp-content\/uploads\/sites\/3\/2024\/03\/image-44.png\" alt=\"\" class=\"wp-image-356\"\/><\/figure>\n\n\n\n<p>This allows you to essentially create a new &#8220;block&#8221;, that &#8211; when inserted &#8211; will look exactly like the current block:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/ska-blocks.com\/docs\/wp-content\/uploads\/sites\/3\/2024\/03\/image-45.png\" alt=\"\" class=\"wp-image-357\"\/><\/figure>\n\n\n\n<p>When not enabling the <strong>Include content<\/strong> option, values from Rich Text inputs are blanked. The child blocks of the block you&#8217;re creating a variation from are still included.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Presets<\/h2>\n\n\n\n<p>When creating a variation, a good idea would be to give the block a <a href=\"https:\/\/ska-blocks.com\/docs\/ska-blocks\/presets\/#static-preset\" data-type=\"post\" data-id=\"327\">Static preset<\/a> first, that way when you make changes to the preset it will essentially be synced with all existing instances of that block variation.<\/p>\n\n\n\n<p>For example the <strong>Button block<\/strong> that comes with ska-theme, is actually not a block, but a variation of the <a href=\"https:\/\/ska-blocks.com\/docs\/ska-blocks\/text-block\/\" data-type=\"post\" data-id=\"213\">Text block<\/a> with the tag name <code>&lt;a&gt;<\/code> that has the Button <a href=\"https:\/\/ska-blocks.com\/docs\/ska-blocks\/presets\/\" data-type=\"post\" data-id=\"327\">preset<\/a> applied by default:<\/p>\n\n\n\n<a aria-label=\"View image in full screen\" data-pswp-height=\"523\" data-pswp-width=\"739\" data-ska-pswp=\"ska-pswp-1\" href=\"https:\/\/ska-blocks.com\/docs\/wp-content\/uploads\/sites\/3\/2024\/03\/image-46.png\" class=\"wp-block-ska-image image\"><img decoding=\"async\" src=\"https:\/\/ska-blocks.com\/docs\/wp-content\/uploads\/sites\/3\/2024\/03\/image-46.png\" width=\"739\" height=\"523\" loading=\"lazy\"\/><\/a>\n\n\n\n<p>Because the variation has the name &#8220;Button&#8221; you can insert it as you would with any other block:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/ska-blocks.com\/docs\/wp-content\/uploads\/sites\/3\/2024\/03\/image-47.png\" alt=\"\" class=\"wp-image-360\"\/><\/figure>\n\n\n\n<p>The <strong>Primary button<\/strong>, <strong>Container<\/strong> and <strong>Section<\/strong> blocks are also Variations.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Sync<\/h2>\n\n\n\n<p>Besides using a static preset, there is <strong>no other forms of sync<\/strong> with variations. Once you insert a variation and save the page, then later modify the variation elsewhere, the changes will not retroactively take effect in places where the variation has been used.<\/p>\n\n\n\n<p>Variation is essentially a <strong>snapshot<\/strong> of the block state that you can easily re-insert, but it doesn&#8217;t do anything special to keep the markup in sync, so if you insert a variation and make substantial changes to it, you can either:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Edit variation<\/strong> &#8211; to update the existing variation &#8220;snapshot&#8221; to use the new markup  the next time you insert it<\/li>\n\n\n\n<li><strong>Create variation<\/strong> &#8211; create a new variation that uses the current changes<\/li>\n\n\n\n<li><strong>Re-apply variation<\/strong> &#8211; remove any changes that you have made and use the original variation<\/li>\n\n\n\n<li><strong>Remove variation<\/strong> &#8211; remove the current blocks&#8217; association with any variation and keep everything else as it is<\/li>\n<\/ul>\n\n\n\n<p>If you need something that keeps all content in sync, use the <strong>WordPress block patterns<\/strong> functionality.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Variations allow you to save the state of the current block (and its&#8217; children) and make a new &#8220;Block&#8221; (Block variation) from it that you can insert like any other block. The functionality is very similar to the core WordPress Block patterns also known as Reusable blocks. Variations are an experimental feature that may become&hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[],"class_list":["post-45","post","type-post","status-publish","format-standard","hentry","category-ska-blocks"],"_links":{"self":[{"href":"https:\/\/ska-blocks.com\/docs\/wp-json\/wp\/v2\/posts\/45","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ska-blocks.com\/docs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ska-blocks.com\/docs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ska-blocks.com\/docs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ska-blocks.com\/docs\/wp-json\/wp\/v2\/comments?post=45"}],"version-history":[{"count":1,"href":"https:\/\/ska-blocks.com\/docs\/wp-json\/wp\/v2\/posts\/45\/revisions"}],"predecessor-version":[{"id":228,"href":"https:\/\/ska-blocks.com\/docs\/wp-json\/wp\/v2\/posts\/45\/revisions\/228"}],"wp:attachment":[{"href":"https:\/\/ska-blocks.com\/docs\/wp-json\/wp\/v2\/media?parent=45"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ska-blocks.com\/docs\/wp-json\/wp\/v2\/categories?post=45"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ska-blocks.com\/docs\/wp-json\/wp\/v2\/tags?post=45"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}