{"id":990,"date":"2022-05-11T10:08:54","date_gmt":"2022-05-11T10:08:54","guid":{"rendered":"https:\/\/mklasen.com\/?p=990"},"modified":"2022-05-11T10:09:21","modified_gmt":"2022-05-11T10:09:21","slug":"registering-block-styles-in-wordpress-with-php","status":"publish","type":"post","link":"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/","title":{"rendered":"Registering block styles in WordPress with PHP"},"content":{"rendered":"\n<p>Sometimes you just want a block to show up a little different than the options that WordPress, or your theme provides by default. In those cases it&#8217;s nice and easy to just add a simple PHP plugin, or add a few lines of code to your functions.php<\/p>\n\n\n\n<p>It&#8217;s possible to influence the various options for block styling in PHP, when hooking into the <code>after_setup_theme<\/code> action.<\/p>\n\n\n\n<p>The code below adds a &#8220;clean&#8221; button option to the button block. After adding the code, it shows up in the block editor and when you select it the block is rendered with an extra CSS class: is-style-clean.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"the-code\">The code<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code>add_action(\n\t'after_setup_theme',\n\tfunction() {\n\t\tregister_block_style(\n\t\t\t'core\/button',\n\t\t\tarray(\n\t\t\t\t'name'  => 'clean',\n\t\t\t\t'label' => __( 'Clean' ),\n\t\t\t)\n\t\t);\n\t}\n);<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"the-code-in-a-plugin\">The code in a plugin<\/h2>\n\n\n\n<pre class=\"wp-block-code\"><code><?php\n\/**\n* Plugin Name: Clean style for button block\n*\/\n\nadd_action(\n\t'after_setup_theme',\n\tfunction() {\n\t\tregister_block_style(\n\t\t\t'core\/button',\n\t\t\tarray(\n\t\t\t\t'name'  => 'clean',\n\t\t\t\t'label' => __( 'Clean' ),\n\t\t\t)\n\t\t);\n\t}\n);<\/code><\/pre>\n\n\n\n<p>You can save the code above in a PHP file and upload it in your <code>wp-content\/plugins<\/code>folder, or compress it in a ZIP file and upload that ZIP file in your WordPress dashboard.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"looking-to-build-a-plugin-from-scratch\">Looking to  build a plugin from scratch?<\/h2>\n\n\n\n<p>Check out the plugin generator on <a href=\"https:\/\/getpremia.com\">getpremia.com<\/a> for a solid start that allows you to go Premium in a heartbeat! <\/p>\n","protected":false},"excerpt":{"rendered":"<p>Sometimes you just want a block to show up a little different than the options that WordPress, or your theme provides by default. In those cases it&#8217;s nice and easy to just add a simple PHP plugin, or add a few lines of code to your functions.php It&#8217;s possible to influence the various options for [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"","footnotes":""},"categories":[1],"tags":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.2 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Registering block styles in WordPress with PHP - Marinus Klasen<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/\" \/>\n<meta property=\"og:locale\" content=\"nl_NL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Registering block styles in WordPress with PHP - Marinus Klasen\" \/>\n<meta property=\"og:description\" content=\"Sometimes you just want a block to show up a little different than the options that WordPress, or your theme provides by default. In those cases it&#8217;s nice and easy to just add a simple PHP plugin, or add a few lines of code to your functions.php It&#8217;s possible to influence the various options for [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/\" \/>\n<meta property=\"og:site_name\" content=\"Marinus Klasen\" \/>\n<meta property=\"article:publisher\" content=\"http:\/\/facebook.com\/marinus.klasen\" \/>\n<meta property=\"article:author\" content=\"http:\/\/facebook.com\/marinus.klasen\" \/>\n<meta property=\"article:published_time\" content=\"2022-05-11T10:08:54+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-05-11T10:09:21+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/mklasen.com\/content\/uploads\/2020\/03\/cropped-cropped-mklasen-logo-margin-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"512\" \/>\n\t<meta property=\"og:image:height\" content=\"512\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Marinus Klasen\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@http:\/\/twitter.com\/marinusklasen\" \/>\n<meta name=\"twitter:site\" content=\"@marinusklasen\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Marinus Klasen\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/\"},\"author\":{\"name\":\"Marinus Klasen\",\"@id\":\"https:\/\/mklasen.com\/#\/schema\/person\/bbad02776afb72dfba2ebfe1956a4e29\"},\"headline\":\"Registering block styles in WordPress with PHP\",\"datePublished\":\"2022-05-11T10:08:54+00:00\",\"dateModified\":\"2022-05-11T10:09:21+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/\"},\"wordCount\":179,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/mklasen.com\/#\/schema\/person\/bbad02776afb72dfba2ebfe1956a4e29\"},\"articleSection\":[\"General\"],\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/\",\"url\":\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/\",\"name\":\"Registering block styles in WordPress with PHP - Marinus Klasen\",\"isPartOf\":{\"@id\":\"https:\/\/mklasen.com\/#website\"},\"datePublished\":\"2022-05-11T10:08:54+00:00\",\"dateModified\":\"2022-05-11T10:09:21+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/#breadcrumb\"},\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/mklasen.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"General\",\"item\":\"https:\/\/mklasen.com\/general\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Registering block styles in WordPress with PHP\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/mklasen.com\/#website\",\"url\":\"https:\/\/mklasen.com\/\",\"name\":\"Marinus Klasen\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/mklasen.com\/#\/schema\/person\/bbad02776afb72dfba2ebfe1956a4e29\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/mklasen.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"nl-NL\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/mklasen.com\/#\/schema\/person\/bbad02776afb72dfba2ebfe1956a4e29\",\"name\":\"Marinus Klasen\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\/\/mklasen.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/mklasen.com\/content\/uploads\/2021\/01\/DONE1171.jpg\",\"contentUrl\":\"https:\/\/mklasen.com\/content\/uploads\/2021\/01\/DONE1171.jpg\",\"width\":1500,\"height\":1000,\"caption\":\"Marinus Klasen\"},\"logo\":{\"@id\":\"https:\/\/mklasen.com\/#\/schema\/person\/image\/\"},\"description\":\"Marinus has been working in software\/web development for more than a decade. Since 2020 his attention shifted on sharing knowledge and developing products and tools for sharing knowledge. Marinus Klasen on Twitter\",\"sameAs\":[\"http:\/\/facebook.com\/marinus.klasen\",\"https:\/\/nl.linkedin.com\/in\/marinusklasen\",\"https:\/\/twitter.com\/http:\/\/twitter.com\/marinusklasen\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Registering block styles in WordPress with PHP - Marinus Klasen","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/","og_locale":"nl_NL","og_type":"article","og_title":"Registering block styles in WordPress with PHP - Marinus Klasen","og_description":"Sometimes you just want a block to show up a little different than the options that WordPress, or your theme provides by default. In those cases it&#8217;s nice and easy to just add a simple PHP plugin, or add a few lines of code to your functions.php It&#8217;s possible to influence the various options for [&hellip;]","og_url":"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/","og_site_name":"Marinus Klasen","article_publisher":"http:\/\/facebook.com\/marinus.klasen","article_author":"http:\/\/facebook.com\/marinus.klasen","article_published_time":"2022-05-11T10:08:54+00:00","article_modified_time":"2022-05-11T10:09:21+00:00","og_image":[{"width":512,"height":512,"url":"https:\/\/mklasen.com\/content\/uploads\/2020\/03\/cropped-cropped-mklasen-logo-margin-1.png","type":"image\/png"}],"author":"Marinus Klasen","twitter_card":"summary_large_image","twitter_creator":"@http:\/\/twitter.com\/marinusklasen","twitter_site":"@marinusklasen","twitter_misc":{"Written by":"Marinus Klasen","Est. reading time":"2 minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/#article","isPartOf":{"@id":"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/"},"author":{"name":"Marinus Klasen","@id":"https:\/\/mklasen.com\/#\/schema\/person\/bbad02776afb72dfba2ebfe1956a4e29"},"headline":"Registering block styles in WordPress with PHP","datePublished":"2022-05-11T10:08:54+00:00","dateModified":"2022-05-11T10:09:21+00:00","mainEntityOfPage":{"@id":"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/"},"wordCount":179,"commentCount":0,"publisher":{"@id":"https:\/\/mklasen.com\/#\/schema\/person\/bbad02776afb72dfba2ebfe1956a4e29"},"articleSection":["General"],"inLanguage":"nl-NL","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/","url":"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/","name":"Registering block styles in WordPress with PHP - Marinus Klasen","isPartOf":{"@id":"https:\/\/mklasen.com\/#website"},"datePublished":"2022-05-11T10:08:54+00:00","dateModified":"2022-05-11T10:09:21+00:00","breadcrumb":{"@id":"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/#breadcrumb"},"inLanguage":"nl-NL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/mklasen.com\/registering-block-styles-in-wordpress-with-php\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/mklasen.com\/"},{"@type":"ListItem","position":2,"name":"General","item":"https:\/\/mklasen.com\/general\/"},{"@type":"ListItem","position":3,"name":"Registering block styles in WordPress with PHP"}]},{"@type":"WebSite","@id":"https:\/\/mklasen.com\/#website","url":"https:\/\/mklasen.com\/","name":"Marinus Klasen","description":"","publisher":{"@id":"https:\/\/mklasen.com\/#\/schema\/person\/bbad02776afb72dfba2ebfe1956a4e29"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/mklasen.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"nl-NL"},{"@type":["Person","Organization"],"@id":"https:\/\/mklasen.com\/#\/schema\/person\/bbad02776afb72dfba2ebfe1956a4e29","name":"Marinus Klasen","image":{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/mklasen.com\/#\/schema\/person\/image\/","url":"https:\/\/mklasen.com\/content\/uploads\/2021\/01\/DONE1171.jpg","contentUrl":"https:\/\/mklasen.com\/content\/uploads\/2021\/01\/DONE1171.jpg","width":1500,"height":1000,"caption":"Marinus Klasen"},"logo":{"@id":"https:\/\/mklasen.com\/#\/schema\/person\/image\/"},"description":"Marinus has been working in software\/web development for more than a decade. Since 2020 his attention shifted on sharing knowledge and developing products and tools for sharing knowledge. Marinus Klasen on Twitter","sameAs":["http:\/\/facebook.com\/marinus.klasen","https:\/\/nl.linkedin.com\/in\/marinusklasen","https:\/\/twitter.com\/http:\/\/twitter.com\/marinusklasen"]}]}},"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"","featured_image_src":null,"featured_image_src_square":null,"author_info":{"display_name":"Marinus Klasen","author_link":"https:\/\/mklasen.com\/author\/mklasen\/"},"_links":{"self":[{"href":"https:\/\/mklasen.com\/wp-json\/wp\/v2\/posts\/990"}],"collection":[{"href":"https:\/\/mklasen.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mklasen.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mklasen.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mklasen.com\/wp-json\/wp\/v2\/comments?post=990"}],"version-history":[{"count":1,"href":"https:\/\/mklasen.com\/wp-json\/wp\/v2\/posts\/990\/revisions"}],"predecessor-version":[{"id":991,"href":"https:\/\/mklasen.com\/wp-json\/wp\/v2\/posts\/990\/revisions\/991"}],"wp:attachment":[{"href":"https:\/\/mklasen.com\/wp-json\/wp\/v2\/media?parent=990"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mklasen.com\/wp-json\/wp\/v2\/categories?post=990"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mklasen.com\/wp-json\/wp\/v2\/tags?post=990"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}