{"id":17,"date":"2026-08-19T16:20:06","date_gmt":"2026-08-19T16:20:06","guid":{"rendered":"https:\/\/blockset.wp.philiprehberger.com\/?page_id=17"},"modified":"2026-08-19T16:20:12","modified_gmt":"2026-08-19T16:20:12","slug":"code-snippet","status":"publish","type":"page","link":"https:\/\/blockset.wp.philiprehberger.com\/?page_id=17","title":{"rendered":"Code snippet"},"content":{"rendered":"\n
\n\n

SFP-BLOCKS\/CODE-SNIPPET<\/p>\n\n\n\n

Code snippet<\/h1>\n\n\n\n

A styled code snippet block with language label, optional caption, and a copy-to-clipboard button. New as of Blockset; you’re reading the result on this page already — every example markup on every per-block docs page is rendered by code-snippet.<\/p>\n\n\n

Live<\/h2>\n\n
\n\t
\n\t\thtml<\/span>\n\t\t\t\t\t\n\t\t\t\tCopy<\/span>\n\t\t\t<\/button>\n\t\t\t<\/header>\n\t
<!-- wp:paragraph -->\n<p>Hello, block.<\/p>\n<!-- \/wp:paragraph --><\/code><\/pre>\n\t<\/figure>\n\n\n
Attributes<\/h2>\n\n\n
\n
Attribute<\/th>Type<\/th>Default<\/th>Description<\/th><\/tr><\/thead>
code<\/code><\/td>string<\/td>sample markup<\/code><\/td>The code body. Plain text; rendered as-is in a <code> element<\/td><\/tr>\n
language<\/code><\/td>string<\/td>\"html\"<\/code><\/td>Language tag shown in the header label (display only; no syntax highlighting)<\/td><\/tr>\n
caption<\/code><\/td>string<\/td>empty<\/code><\/td>Optional italic caption below the code<\/td><\/tr>\n
showCopy<\/code><\/td>boolean<\/td>true<\/code><\/td>Show the copy-to-clipboard button<\/td><\/tr>\n<\/tbody><\/table><\/figure>\n\n\n
Example markup<\/h2>\n\n
\n\t
\n\t\thtml<\/span>\n\t\t\t\t\t\n\t\t\t\tCopy<\/span>\n\t\t\t<\/button>\n\t\t\t<\/header>\n\t
<!-- wp:sfp-blocks\/code-snippet {"code":"function greet() {\\n  console.log(\\"hello\\");\\n}","language":"javascript","caption":"A tiny example."} \/--><\/code><\/pre>\n\t\t\t
Paste this in any block-editor view (or in a theme template) to drop the block in.<\/figcaption>\n\t<\/figure>\n\n\n
\n\n
SOURCE<\/p>\n\n\n
plugins\/sfp-blocks\/src\/code-snippet\/ on GitHub \u2192<\/a><\/p>\n\n<\/div>\n\n<\/main>\n\n","protected":false},"excerpt":{"rendered":"
Styled code block with language label and copy-to-clipboard. New.<\/p>\n","protected":false},"author":0,"featured_media":0,"parent":7,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-17","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/pages\/17","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"replies":[{"embeddable":true,"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=17"}],"version-history":[{"count":1,"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/pages\/17\/revisions"}],"predecessor-version":[{"id":24,"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/pages\/17\/revisions\/24"}],"up":[{"embeddable":true,"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=\/wp\/v2\/pages\/7"}],"wp:attachment":[{"href":"https:\/\/blockset.wp.philiprehberger.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=17"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}