{"id":373,"date":"2022-11-27T07:48:44","date_gmt":"2022-11-27T07:48:44","guid":{"rendered":"https:\/\/aki-hamano.blog\/?p=373"},"modified":"2025-10-25T03:55:20","modified_gmt":"2025-10-25T03:55:20","slug":"hybrid-theme","status":"publish","type":"post","link":"https:\/\/aki-hamano.blog\/ja\/2022\/11\/27\/hybrid-theme\/","title":{"rendered":"\u53d7\u8a17\u958b\u767a\u306b\u304a\u3051\u308b\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u958b\u767a"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">\u306f\u3058\u3081\u306b<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u8a18\u4e8b\u3067\u306f\u3001\u53d7\u8a17\u958b\u767a\u306b\u304a\u3044\u3066 WordPress \u30c6\u30fc\u30de\u3092\u5236\u4f5c\u3059\u308b\u6642\u306b\u3001\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u3067\u69cb\u7bc9\u3059\u308b\u305f\u3081\u306e\u8a2d\u8a08\u30fb\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u63d0\u6848\u3059\u308b\u3082\u306e\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u8a18\u4e8b\u30bf\u30a4\u30c8\u30eb\u306b\u300c\u53d7\u8a17\u958b\u767a\u306b\u304a\u3051\u308b\u300d\u3068\u542b\u3081\u305f\u7406\u7531\u306f\u3001WordPress \u30c6\u30fc\u30de\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u516c\u958b\u3057\u305f\u308a\u3001\u4e0d\u7279\u5b9a\u591a\u6570\u306b\u914d\u5e03\u3059\u308b\u3088\u3046\u306a\u30c6\u30fc\u30de\u306b\u304a\u3044\u3066\u306f\u3001\u3053\u306e\u8a18\u4e8b\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u304c\u5fc5\u305a\u3057\u3082\u30d9\u30b9\u30c8\u306a\u65b9\u6cd5\u3067\u306f\u306a\u3044\u3068\u8003\u3048\u308b\u304b\u3089\u3067\u3059\u3002\u3042\u304f\u307e\u3067\u3082\u3001<strong>\u7279\u5b9a\u306e WordPress \u30b5\u30a4\u30c8 (\u7279\u5b9a\u306e\u30af\u30e9\u30a4\u30a2\u30f3\u30c8\u30fb\u30a8\u30f3\u30c9\u30e6\u30fc\u30b6\u30fc) \u5411\u3051\u306b\u6700\u9069\u5316\u3057\u305f\u30c6\u30fc\u30de\u3092\u5236\u4f5c\u3059\u308b<\/strong>\u3068\u3044\u3046\u30b7\u30c1\u30e5\u30a8\u30fc\u30b7\u30e7\u30f3\u306b\u304a\u3044\u3066\u306e\u8a71\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u3068\u306f ?<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305a\u3001\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u542b\u3081\u3001\u3069\u306e\u3088\u3046\u306a\u30c6\u30fc\u30de\u306e\u5f62\u614b\u304c\u5b58\u5728\u3057\u3066\u3044\u308b\u304b\u3092\u3001WP Tavern \u306e\u8a18\u4e8b (<a href=\"https:\/\/wptavern.com\/block-fse-hybrid-universal-what-do-we-call-these-new-wordpress-themes\" target=\"_blank\" rel=\"noreferrer noopener\">Block, FSE, Hybrid, Universal? What Do We Call These New WordPress Themes?<\/a>)\u3092\u3082\u3068\u306b\u307e\u3068\u3081\u3066\u307f\u305f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u81ea\u5206\u306e\u7406\u89e3\u3067\u306f\u3001\u5404\u30c6\u30fc\u30de\u306e\u3056\u3063\u304f\u308a\u3068\u3057\u305f\u5b9a\u7fa9\u306f\u4ee5\u4e0b\u306e\u901a\u308a\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><strong>\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de<\/strong>: \u30d6\u30ed\u30c3\u30af\u306e\u307f\u3067\u69cb\u6210\u3055\u308c\u305f HTML \u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3092\u6301\u3061\u3001\u30b5\u30a4\u30c8\u30a8\u30c7\u30a3\u30bf\u30fc\u3001\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30a8\u30c7\u30a3\u30bf\u30fc\u3001\u30b0\u30ed\u30fc\u30d0\u30eb\u30b9\u30bf\u30a4\u30eb UI \u306a\u3069\u3092\u5229\u7528\u51fa\u6765\u308b\u3002<\/li>\n\n\n\n<li><strong>\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de<\/strong>: PHP \u30d9\u30fc\u30b9\u306e\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3092\u6301\u3061\u3001\u30b5\u30a4\u30c8\u30a8\u30c7\u30a3\u30bf\u30fc\u3001\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30a8\u30c7\u30a3\u30bf\u30fc\u3001\u30b0\u30ed\u30fc\u30d0\u30eb\u30b9\u30bf\u30a4\u30eb UI \u306a\u3069\u306f\u5229\u7528\u51fa\u6765\u306a\u3044 (WordPress 6.1 \u304b\u3089\u306f\u3001\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30a8\u30c7\u30a3\u30bf\u30fc\u306f\u5229\u7528\u51fa\u6765\u308b)\u3002<\/li>\n\n\n\n<li><strong>\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de<\/strong>: \u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u3067\u3001\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30a8\u30c7\u30a3\u30bf\u30fc\u3084 <code>theme.json<\/code> \u306a\u3069\u3001\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u306e1\u3064\u4ee5\u4e0a\u306e\u6a5f\u80fd\u3092\u63a1\u7528\u3057\u3066\u3044\u308b\u3002<\/li>\n\n\n\n<li><strong>\u30e6\u30cb\u30d0\u30fc\u30b5\u30eb\u30c6\u30fc\u30de<\/strong>: \u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u306e\u6a5f\u80fd (\u30b5\u30a4\u30c8\u30a8\u30c7\u30a3\u30bf\u30fc\u7b49)\u3068\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u306e\u6a5f\u80fd (\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u30fb\u30ab\u30b9\u30bf\u30de\u30a4\u30b6\u30fc\u7b49) \u306e\u4e21\u65b9\u3092\u30b5\u30dd\u30fc\u30c8\u3057\u3066\u3044\u308b\u3082\u306e<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u3057\u3066\u3053\u306e\u8a18\u4e8b\u3067\u306f\u3001<strong>\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u306b <code>theme.json<\/code> \u3092\u53d6\u308a\u5165\u308c\u305f\u30c6\u30fc\u30de<\/strong>\u3092\u300c\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u300d\u3068\u3057\u3001<code>theme.json<\/code> \u3092\u30d9\u30fc\u30b9\u3068\u3057\u3066\u8a2d\u8a08\u3057\u3066\u3044\u304f\u3001\u3068\u3044\u3046\u30a2\u30d7\u30ed\u30fc\u30c1\u306b\u3064\u3044\u3066\u89e3\u8aac\u3057\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u306a\u305c\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u3092\u63a1\u7528\u3059\u308b\u306e\u304b\uff1f<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u524d\u8ff0\u306e4\u3064\u306e\u30c6\u30fc\u30de\u5f62\u614b\u306e\u3046\u3061\u3001\u53d7\u8a17\u958b\u767a\u3067\u30c6\u30fc\u30de\u3092\u958b\u767a\u3059\u308b\u6642\u30012\u3064\u76ee\u306e\u300c\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u300d\u304c\u307b\u307c\u9593\u9055\u3044\u306a\u304f\u63a1\u7528\u3055\u308c\u3066\u3044\u308b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u4ee5\u5916\u306e\u30c6\u30fc\u30de\u5f62\u614b\u3092\u63a1\u7528\u3059\u308b\u4e8b\u3092\u8003\u3048\u305f\u6642\u30011\u3064\u76ee\u306e\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u306b\u3064\u3044\u3066\u306f\u3001\u4ee5\u4e0b\u306e\u7406\u7531\u304b\u3089\u307e\u3060\u53d7\u8a17\u958b\u767a\u306b\u53d6\u308a\u5165\u308c\u308b\u4e8b\u306f\u96e3\u3057\u3044\u3068\u8003\u3048\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u30b5\u30a4\u30c8\u30a8\u30c7\u30a3\u30bf\u30fc\u81ea\u4f53\u304c\u307e\u3060\u300c\u30d9\u30fc\u30bf\u300d\u3068\u3057\u3066\u4f4d\u7f6e\u3065\u3051\u3089\u308c\u3066\u304a\u308a\u3001\u3053\u306e<a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/39293\" target=\"_blank\" rel=\"noreferrer noopener\">\u30d9\u30fc\u30bf\u7248\u30e9\u30d9\u30eb\u3092\u524a\u9664\u3059\u308b\u305f\u3081\u306b\u89e3\u6c7a\u3059\u3079\u304d\u30bf\u30b9\u30af<\/a>\u304c\u3044\u304f\u3064\u304b\u6b8b\u3063\u3066\u3044\u308b\u305f\u3081<\/li>\n\n\n\n<li>\u30ca\u30d3\u30b2\u30fc\u30b7\u30e7\u30f3\u30d6\u30ed\u30c3\u30af\u306b\u95a2\u3059\u308b issue \u304c<a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues?q=is%3Aissue+is%3Aopen+label%3A%22%5BBlock%5D+Navigation%22+\" target=\"_blank\" rel=\"noreferrer noopener\">\u30aa\u30fc\u30d7\u30f3\u72b6\u614b\u3067\u591a\u6570\u5b58\u5728<\/a>\u3057\u3001<a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/38275\" target=\"_blank\" rel=\"noreferrer noopener\">Tracking Issue<\/a> \u3067\u3082\u591a\u304f\u306e\u30bf\u30b9\u30af\u304c\u6b8b\u3063\u3066\u304a\u308a\u3001\u4eca\u5f8c\u4ed5\u69d8\u304c\u5927\u304d\u304f\u5909\u308f\u3063\u3066\u3044\u304f\u53ef\u80fd\u6027\u304c\u3042\u308b\u3068\u8003\u3048\u308b\u305f\u3081<\/li>\n\n\n\n<li>\u81ea\u5206\u306e\u7d4c\u9a13\u4e0a\u3001\u53d7\u8a17\u958b\u767a\u306b\u304a\u3044\u3066\u4ed5\u69d8\u3092\u6e80\u305f\u3059\u305f\u3081\u306b\u3001\u5b8c\u5168\u306b\u30d6\u30ed\u30c3\u30af\u30d9\u30fc\u30b9\u306e HTML \u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3067\u69cb\u6210\u3059\u308b\u4e8b\u306f\u96e3\u3057\u3044\u30b1\u30fc\u30b9\u304c\u591a\u3044\u3068\u601d\u308f\u308c\u308b\u305f\u3081<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">4\u3064\u76ee\u306e\u30e6\u30cb\u30d0\u30fc\u30b5\u30eb\u30c6\u30fc\u30de\u306b\u3064\u3044\u3066\u306f\u3001\u3042\u304f\u307e\u3067\u3082\u300c\u65e2\u5b58\u306e\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u304b\u3089\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u306b\u79fb\u884c\u3059\u308b\u305f\u3081\u306b\u4e00\u6642\u7684\u306b\u5b58\u5728\u3059\u308b\u305f\u3081\u306e\u30c6\u30fc\u30de\u300d\u3067\u3042\u308a\u3001\u65b0\u898f\u30c6\u30fc\u30de\u958b\u767a\u306b\u304a\u3044\u3066\u306f\u3001\u30af\u30e9\u30b7\u30c3\u30af \/ \u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u53cc\u65b9\u306e\u6a5f\u80fd\u3092\u30b5\u30dd\u30fc\u30c8\u3057\u306a\u3051\u308c\u3070\u3044\u3051\u306a\u3044\u30b1\u30fc\u30b9\u306f\u307b\u307c\u5b58\u5728\u3057\u306a\u3044\u3068\u8003\u3048\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u3092\u9664\u3044\u3066\u3001\u6b8b\u308b\u9078\u629e\u80a2\u304c\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u3068\u306a\u308a\u307e\u3059\u304c\u3001\u3053\u308c\u3092\u63a1\u7528\u3059\u308b\u4e8b\u3067\u3069\u306e\u3088\u3046\u306a\u30e1\u30ea\u30c3\u30c8\u304c\u3042\u308b\u304b\u306f\u3001\u3053\u3053\u3067\u306f\u5177\u4f53\u7684\u306b\u89e6\u308c\u307e\u305b\u3093\u3002\u4ee5\u964d\u306e\u5177\u4f53\u7684\u306a\u8a2d\u8a08\u624b\u6cd5\u3092\u898b\u3066\u3044\u305f\u3060\u304d\u3001\u63a1\u7528\u3059\u308b\u4e8b\u306e\u30e1\u30ea\u30c3\u30c8\u30fb\u30c7\u30e1\u30ea\u30c3\u30c8\u306e\u3069\u3061\u3089\u304c\u5927\u304d\u3044\u304b\u3092\u5224\u65ad\u3057\u3066\u3044\u305f\u3060\u3051\u308c\u3070\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u6ce8\u610f\u4e8b\u9805<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u8a18\u4e8b\u3067\u306f\u3001\u3042\u304f\u307e\u3067\u3082\u300c<strong>\u30b5\u30a4\u30c8\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u90e8\u5206\u3092 <code>theme.json<\/code> \u3067\u3069\u306e\u3088\u3046\u306b\u8a2d\u8a08\u3059\u308b\u304b<\/strong>\u300d\u306b\u3064\u3044\u3066\u30d5\u30a9\u30fc\u30ab\u30b9\u3057\u3066\u3044\u308b\u305f\u3081\u3001\u4e00\u822c\u7684\u306a\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u958b\u767a (\u4e3b\u306b\u30c6\u30fc\u30de\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u958b\u767a) \u306b\u3064\u3044\u3066\u306f\u89e6\u308c\u3066\u3044\u307e\u305b\u3093\u3002\u307e\u305f\u3001<code>theme.json<\/code> \u3001\u57fa\u672c\u7684\u306a\u30d5\u30c3\u30af\u3001CSS \u306b\u3064\u3044\u3066\u306e\u524d\u63d0\u77e5\u8b58\u304c\u3042\u308b\u3082\u306e\u3068\u3057\u3066\u8a71\u3092\u9032\u3081\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><code>theme.json<\/code> \u306b\u3064\u3044\u3066\u305d\u3082\u305d\u3082\u5206\u304b\u3089\u306a\u3044\u3068\u3044\u3046\u5834\u5408\u306f\u3001\u904e\u53bb\u306b\u66f8\u3044\u305f\u3053\u3061\u3089\u306e\u8a18\u4e8b\u3092\u53c2\u8003\u306b\u3057\u3066\u3044\u305f\u3060\u3051\u308c\u3070\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/aki-hamano.blog\/2021\/12\/15\/theme-json\/\" data-type=\"post\" data-id=\"378\">\u3010WordPress5.9 \/ 6.0\u7248\u3011theme.json \u5168\u89e3\u8aac<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/aki-hamano.blog\/2022\/10\/10\/wp6-1-theme-json\/\" data-type=\"post\" data-id=\"374\">\u3010WordPress6.1\u3011theme.json \u306e\u5909\u66f4\u70b9<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u4eca\u56de\u63d0\u6848\u3059\u308b\u30a2\u30d7\u30ed\u30fc\u30c1\u306f\u3001<strong>WordPress6.1\u6642\u70b9\u3067\u306e\u4ed5\u69d8\u3092\u3082\u3068\u306b\u3001\u53d7\u8a17\u958b\u767a\u306e\u591a\u304f\u306e\u30b1\u30fc\u30b9\u306b\u304a\u3044\u3066\u6709\u7528\u3067\u3042\u308d\u3046\u3068\u81ea\u5206\u304c\u8003\u3048\u308b\u3082\u306e\u306e\u4e00\u4f8b<\/strong>\u3067\u3059\u3002\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u500b\u5225\u306e\u4ed5\u69d8\u30fb\u4e88\u7b97\u30fb\u4eba\u54e1\u7b49\u306b\u3088\u3063\u3066\u6700\u9069\u306a\u30a2\u30d7\u30ed\u2015\u30c1\u306f\u5909\u308f\u3063\u3066\u3044\u304f\u3067\u3057\u3087\u3046\u3057\u3001WordPress \u306e\u30a2\u30c3\u30d7\u30c7\u30fc\u30c8\u306b\u3088\u3063\u3066\u3088\u308a\u4fbf\u5229\u306a\u6a5f\u80fd\u30fb\u30b5\u30dd\u30fc\u30c8\u3082\u8ffd\u52a0\u3055\u308c\u3066\u3044\u304f\u3068\u601d\u3044\u307e\u3059\u3002\u305d\u3082\u305d\u3082\u30aa\u30ea\u30b8\u30ca\u30eb\u30c6\u30fc\u30de\u3092\u4f5c\u308b\u3079\u304d\u304b\u3069\u3046\u304b\u3092\u8003\u3048\u308b\u5fc5\u8981\u3082\u3042\u308a\u307e\u3059\u3002\u6700\u7d42\u7684\u306b\u3069\u306e\u3088\u3046\u306a\u30a2\u30d7\u30ed\u2015\u30c1\u3092\u53d6\u308b\u304b\u306f\u3001\u7686\u69d8\u81ea\u8eab\u3067\u5224\u65ad\u3044\u305f\u3060\u3051\u308c\u3070\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u4e8b\u524d\u6e96\u5099<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u5b9f\u969b\u306b\u4f5c\u696d\u3092\u9032\u3081\u3066\u3044\u304f\u524d\u306b\u3001\u30d9\u30fc\u30b9\u3068\u306a\u308b\u30c6\u30fc\u30de\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3001\u30d8\u30c3\u30c0\u30fc\u30fb\u30d5\u30c3\u30bf\u30fc\u306a\u3069\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5916\u306e\u4e8b\u306f\u3053\u306e\u8a18\u4e8b\u3067\u306f\u6271\u3044\u307e\u305b\u3093\u306e\u3067\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306b <code>index.php<\/code> \u306e\u307f\u3092\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3068\u3057\u3066\u4f5c\u6210\u3057\u3001\u30d8\u30c3\u30c0\u30fc\u30fb\u30d5\u30c3\u30bf\u30fc\u30fb\u30da\u30fc\u30b8\u30bf\u30a4\u30c8\u30eb\u306b\u306f\u4eee\u306e\u30b9\u30bf\u30a4\u30eb\u3092\u5f53\u3066\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"style.css\" id=\"style.css\" class=\"wp-block-code lang-css\"><code>\/*\nTheme Name: My Theme\n*\/\n\u200b\n.site-header,\n.site-footer {\n    background-color: #ddd;\n    text-align: center;\n    padding: 1rem;\n}\n\u200b\n.site-main {\n    padding-top: 3rem;\n    padding-bottom: 3rem;\n}\n\u200b\n.page-title {\n    text-align: center;\n    font-size: 2rem;\n    margin-top: 0;\n    margin-bottom: 3rem;\n}<\/code><\/pre>\n\n\n\n<pre data-label=\"index.php\" id=\"index.php\" class=\"wp-block-code lang-php\"><code>&lt;!doctype html&gt;\n&lt;html &lt;?php language_attributes(); ?&gt;&gt;\n&lt;head&gt;\n    &lt;meta charset=\"&lt;?php bloginfo( 'charset' ); ?&gt;\" \/&gt;\n    &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" \/&gt;\n    &lt;?php wp_head(); ?&gt;\n&lt;\/head&gt;\n\u200b\n&lt;body &lt;?php body_class(); ?&gt;&gt;\n\u200b\n&lt;header class=\"site-header\"&gt;\n    Site Header\n&lt;\/header&gt;\n\u200b\n&lt;main class=\"site-main\"&gt;\n    &lt;h1 class=\"page-title\"&gt;&lt;?php the_title(); ?&gt;&lt;\/h1&gt;\n    &lt;?php\n    if ( have_posts() ) :\n        while ( have_posts() ) :\n            the_post();\n            ?&gt;\n            &lt;div class=\"entry-content\"&gt;\n                &lt;?php the_content(); ?&gt;\n            &lt;\/div&gt;\n        &lt;?php endwhile; ?&gt;\n    &lt;?php endif; ?&gt;\n&lt;\/main&gt;\n\u200b\n&lt;footer class=\"site-footer\"&gt;\n    Site Footer\n&lt;\/footer&gt;\n\u200b\n&lt;?php wp_footer(); ?&gt;\n\u200b\n&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n\n\n\n<pre data-label=\"functions.php\" id=\"functions.php\" class=\"wp-block-code lang-php\"><code>&lt;?php\nfunction my_theme_scripts() {\n    wp_enqueue_style(\n        'my-theme-style',\n        get_template_directory_uri() . '\/style.css',\n        array(),\n        wp_get_theme()-&gt;get( 'Version' )\n    );\n}\nadd_action( 'wp_enqueue_scripts', 'my_theme_scripts' );\n\u200b\nfunction my_theme_setup() {\n    add_theme_support( 'editor-styles' );\n    add_editor_style( 'editor-style.css' );\n}\nadd_action( 'after_setup_theme', 'my_theme_setup' );<\/code><\/pre>\n\n\n\n<pre data-label=\"editor-style.css\" id=\"editor-style.css\" class=\"wp-block-code lang-css\"><code>\/* \u73fe\u6642\u70b9\u3067\u306f\u7a7a *\/<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"465\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_01-840x465.png\" alt=\"\u521d\u671f\u8868\u793a\" class=\"wp-image-518\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_01-840x465.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_01-768x425.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_01.png 1003w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">\u30b3\u30f3\u30c6\u30f3\u30c4\u30a8\u30ea\u30a2\u5168\u4f53\u306e\u8a2d\u8a08<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">theme.json \u306e\u5c0e\u5165<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305a\u306f\u3001\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u3067\u3059\u306e\u3067 <code>theme.json<\/code> \u3092\u30c6\u30fc\u30de\u306b\u8ffd\u52a0\u3057\u307e\u3059\u3002\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u3001JSON \u30b9\u30ad\u30fc\u30de\u3068API \u30d0\u30fc\u30b8\u30e7\u30f3\u306e\u307f\u6307\u5b9a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n    \"$schema\": \"https:\/\/schemas.wp.org\/trunk\/theme.json\",\n    \"version\": 2\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u307e\u305f\u306f\u30d6\u30ed\u30c3\u30af\u5e45\u3092\u6307\u5b9a\u3057\u3066\u3044\u306a\u3044\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u306f\u3082\u3061\u308d\u3093\u3067\u3059\u304c\u3001\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u30d6\u30ed\u30c3\u30af\u304c\u5e45\u4e00\u676f\u306b\u5e83\u304c\u308b\u3088\u3046\u306b\u306a\u3063\u305f\u4e8b\u304c\u78ba\u8a8d\u51fa\u6765\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"405\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_02-840x405.png\" alt=\"\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u30d6\u30ed\u30c3\u30af\u304c\u5e45\u4e00\u676f\u306b\u5e83\u304c\u308b\u3088\u3046\u306b\u306a\u3063\u305f\" class=\"wp-image-519\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_02-840x405.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_02-768x370.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_02.png 1094w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"content-width\">\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u306e\u691c\u8a0e<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u306e\u30d6\u30ed\u30c3\u30af\u5e45\u306b\u9069\u5207\u306a\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u6301\u305f\u305b\u308b\u305f\u3081\u306b\u3001\u307e\u305a\u306f\u6700\u9069\u306a\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u306f\u4f55px\u304b\u3092\u691c\u8a0e\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u554f\u984c\u306b\u306a\u3063\u3066\u304f\u308b\u306e\u306f\u3001<strong>\u6295\u7a3f\u30bf\u30a4\u30d7\u3084\u30da\u30fc\u30b8\u306b\u3088\u3063\u3066\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u5909\u3048\u305f\u3044\u5834\u5408<\/strong>\u3067\u3059\u3002\u4f8b\u3048\u3070\u3001\u6295\u7a3f\u30da\u30fc\u30b8\u306f\u5e45960px\u3001\u56fa\u5b9a\u30da\u30fc\u30b8\u306f\u5e451200px\u3001\u7279\u5b9a\u306e\u30da\u30fc\u30b8\u30fb\u30bb\u30af\u30b7\u30e7\u30f3\u306f\u5e451400px\u306a\u3069\u3067\u3059\u3002\u305d\u3057\u3066 <code>theme.json<\/code> \u3067\u6307\u5b9a\u51fa\u6765\u308b\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u306f1\u3064\u306e\u307f\u3067\u3042\u308a\u3001\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u6295\u7a3f\u30bf\u30a4\u30d7\u5225\u306b\u5909\u66f4\u3059\u308b\u306b\u306f CSS \u3092\u66f8\u304f\u3057\u304b\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u306f\u3001\u30a8\u30f3\u30c9\u30e6\u30fc\u30b6\u30fc (\u30af\u30e9\u30a4\u30a2\u30f3\u30c8) \u304c\u983b\u7e41\u306b\u66f4\u65b0\u3059\u308b\u306e\u306f\u901a\u5e38\u306e\u6295\u7a3f\u3067\u3042\u308a\u3001\u3053\u306e\u6295\u7a3f\u306b\u304a\u3044\u3066\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u3068\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u4e00\u81f4\u3055\u305b\u308b\u4e8b\u3092\u512a\u5148\u3055\u305b\u308b\u305f\u3081\u3001\u6295\u7a3f\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45 (960px)\u3092\u30c7\u30d5\u30a9\u30eb\u30c8\u3068\u3057\u307e\u3059\u3002\u56fa\u5b9a\u30da\u30fc\u30b8\u306f\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45 (1200px) \u3092\u5e45\u5e83\u3068\u307f\u306a\u3057\u3001\u5e45\u5e83\u306b\u8a2d\u5b9a\u3057\u305f\u30b0\u30eb\u30fc\u30d7\u30d6\u30ed\u30c3\u30af\u3067\u5404\u30d6\u30ed\u30c3\u30af\u3092\u30e9\u30c3\u30d7\u3059\u308c\u3070\u5b9f\u73fe\u51fa\u6765\u307e\u3059\u3002\u307e\u305f <code>theme.json<\/code> \u3092\u5c0e\u5165\u3059\u308b\u3068\u3001<strong>\u30b0\u30eb\u30fc\u30d7\u30d6\u30ed\u30c3\u30af\u306e\u4e2d\u306e\u30d6\u30ed\u30c3\u30af\u5e45\u3092\u4efb\u610f\u306e\u5024\u306b\u5909\u66f4\u51fa\u6765\u308b<\/strong>\u306e\u3067\u3001\u305d\u306e\u4ed6\u30a4\u30ec\u30ae\u30e5\u30e9\u30fc\u306a\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u6301\u3064\u30da\u30fc\u30b8\u306b\u3064\u3044\u3066\u306f\u3001\u3053\u308c\u3067\u5bfe\u5fdc\u3059\u308b\u4e8b\u3068\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n    \"settings\": {\n        \"layout\": {\n            \"contentSize\": \"960px\",\n            \"wideSize\": \"1200px\"\n        }\n    }\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45960px\u306b\u52a0\u3048\u30011200px \/ 1400px\u3092\u518d\u73fe\u51fa\u6765\u3066\u3044\u308b\u4e8b\u304c\u5206\u304b\u308a\u307e\u3059\u3002\u30a4\u30ec\u30ae\u30e5\u30e9\u30fc\u306a\u5e45\u3067\u3042\u308b1400px\u306b\u3064\u3044\u3066\u306f\u3001<strong>\u89aa\u306e\u30b0\u30eb\u30fc\u30d7\u30d6\u30ed\u30c3\u30af\u3092\u5168\u5e45\u306b\u3057\u305f\u4e0a\u3067\u3001\u4e2d\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u6307\u5b9a\u3057\u3066\u3044\u308b<\/strong>\u6240\u304c\u30dd\u30a4\u30f3\u30c8\u3067\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"226\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_03-840x226.png\" alt=\"\u89aa\u306e\u30b0\u30eb\u30fc\u30d7\u30d6\u30ed\u30c3\u30af\u3092\u5168\u5e45\u306b\u3057\u305f\u4e0a\u3067\u3001\u4e2d\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u6307\u5b9a\u3057\u3066\u3044\u308b\" class=\"wp-image-520\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_03-840x226.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_03-768x207.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_03-1536x413.png 1536w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_03.png 1572w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u305f\u3060\u3057\u3053\u308c\u3060\u3051\u3067\u306f\u3001\u3082\u3061\u308d\u3093\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u5074\u306b\u306f\u53cd\u6620\u3055\u308c\u307e\u305b\u3093\u3002\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u3001\u660e\u793a\u7684\u306b\u5e45\u3092\u6307\u5b9a\u3057\u305f1400px\u4ee5\u5916\u306e\u30d6\u30ed\u30c3\u30af\u306f\u89aa\u30d6\u30ed\u30c3\u30af (<code>.entry-content<\/code>) \u306e\u5e45\u4e00\u676f\u306b\u5e83\u304c\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"289\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_04-840x289.png\" alt=\"\u660e\u793a\u7684\u306b\u5e45\u3092\u6307\u5b9a\u3057\u305f1400px\u4ee5\u5916\u306e\u30d6\u30ed\u30c3\u30af\u306f\u89aa\u30d6\u30ed\u30c3\u30af (.entry-content) \u306e\u5e45\u4e00\u676f\u306b\u5e83\u304c\u3063\u3066\u3044\u308b\" class=\"wp-image-521\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_04-840x289.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_04-768x264.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_04.png 1281w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u3092\u89e3\u6c7a\u3059\u308b\u305f\u3081\u306b\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u5168\u4f53\u3092\u30e9\u30c3\u30d7\u3057\u3066\u3044\u308b\u8981\u7d20 (<code>.entry-content<\/code>) \u306b\u5e45\u3092\u6307\u5b9a\u3059\u308b\u306e\u3067\u306f\u306a\u304f\u3001<strong>\u305d\u306e\u76f4\u4e0b\u306e\u30d6\u30ed\u30c3\u30af\u306b\u6700\u5927\u5e45\u3092\u6307\u5b9a\u3059\u308b<\/strong>\u3001\u3068\u3044\u3046\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u53d6\u308a\u307e\u3059\u3002\u3053\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u306f\u3001\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u30b3\u30a2\u304c\u51fa\u529b\u3059\u308b CSS \u3068\u57fa\u672c\u7684\u306b\u306f\u4e00\u81f4\u3057\u3066\u304a\u308a\u3001<a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentyone\/style.css#L699\" target=\"_blank\" rel=\"noreferrer noopener\">Twenty Twenty One<\/a> \u3067\u3082\u540c\u69d8\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u304c\u53d6\u3089\u308c\u3066\u3044\u307e\u3059 (\u5b9f\u969b\u306b\u306f\u3001\u3088\u308a\u7d30\u304b\u3044\u6307\u5b9a\u304c\u884c\u308f\u308c\u3066\u3044\u307e\u3059\u304c)\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5024\u306e\u6307\u5b9a\u306b\u306f\u3001<code>theme.json<\/code> \u3067 <code>layout<\/code> \u3092\u6307\u5b9a\u3057\u305f\u4e8b\u3067\u81ea\u52d5\u51fa\u529b\u3055\u308c\u3066\u3044\u308b <code>--wp--style--global--content-size<\/code> \u3068 <code>--wp--style--global--wide--size<\/code> \u3068\u3044\u3046 CSS \u5909\u6570\u3092\u5229\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"style.css\" id=\"style.css\" class=\"wp-block-code lang-css\"><code>\/* \u5e45\u5e83\u30fb\u5168\u5e45\u30d6\u30ed\u30c3\u30af\u4ee5\u5916\u306b\u30c7\u30d5\u30a9\u30eb\u30c8\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u6307\u5b9a *\/\n.entry-content &gt; *:not(.alignwide):not(.alignfull) {\n    max-width: var(--wp--style--global--content-size);\n}\n\u200b\n\/* \u5e45\u5e83\u30d6\u30ed\u30c3\u30af\u306b\u5e45\u5e83\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u6307\u5b9a *\/\n.entry-content &gt; *.alignwide {\n    max-width: var(--wp--style--global--wide-size);\n}\n\u200b\n\/* \u5168\u5e45\u30d6\u30ed\u30c3\u30af\u3092\u9664\u3044\u3066\u5de6\u53f3\u306b\u30aa\u30fc\u30c8\u30de\u30fc\u30b8\u30f3\u3092\u4ed8\u4e0e\u3059\u308b *\/\n.entry-content &gt; *:not(.alignfull) {\n    margin-right: auto;\n    margin-left: auto;\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u30dd\u30a4\u30f3\u30c8\u306f\u3001<strong>\u5168\u5e45\u30d6\u30ed\u30c3\u30af\u306b\u306f\u30b9\u30bf\u30a4\u30eb\u3092\u4e00\u5207\u5f53\u3066\u3066\u3044\u306a\u3044<\/strong>\u3068\u3044\u3046\u4e8b\u3067\u3059\u3002\u89aa\u8981\u7d20 (<code>.entry-content<\/code>) \u306b\u306f\u5e45\u3092\u6307\u5b9a\u3057\u3066\u3044\u306a\u3044\u306e\u3067\u3001\u5b50\u306b <code>max-width<\/code> \u3092\u6307\u5b9a\u3057\u306a\u3051\u308c\u3070\u7d50\u679c\u7684\u306b\u5168\u5e45\u306b\u306a\u308b\u3001\u3068\u3044\u3046\u4e8b\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u3001\u5404\u30d6\u30ed\u30c3\u30af\u306e\u5e45\u304c\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3068\u4e00\u81f4\u3057\u305f\u4e8b\u3092\u78ba\u8a8d\u51fa\u6765\u307e\u3059\u3002\u3055\u3089\u306b\u3001<strong><code>theme.json<\/code> \u3092\u5c0e\u5165\u3057\u305f\u4e8b\u3067\u3001<code>body<\/code> \u30bf\u30b0\u306e <code>margin<\/code> \/ <code>padding<\/code> \u304c0\u306b\u30ea\u30bb\u30c3\u30c8\u3055\u308c\u3066\u3044\u308b\u4e8b<\/strong>\u3082\u30dd\u30a4\u30f3\u30c8\u3067\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"260\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_05-840x260.png\" alt=\"theme.json \u3092\u5c0e\u5165\u3057\u305f\u4e8b\u3067\u3001body \u30bf\u30b0\u306e margin \/ padding \u304c0\u306b\u30ea\u30bb\u30c3\u30c8\u3055\u308c\u3066\u3044\u308b\" class=\"wp-image-522\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_05-840x260.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_05-768x238.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_05.png 1460w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u30b3\u30f3\u30c6\u30f3\u30c4\u306e\u5de6\u53f3\u306b\u4f59\u767d\u3092\u8ffd\u52a0\u3059\u308b<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u73fe\u72b6\u3067\u306f\u3001\u753b\u9762\u5e45\u3092\u72ed\u3081\u305f\u6642\u306b\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u30b3\u30f3\u30c6\u30f3\u30c4\u306e\u5de6\u53f3\u306b\u4f59\u767d\u304c\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"785\" height=\"531\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_06.png\" alt=\"\u30b3\u30f3\u30c6\u30f3\u30c4\u306e\u5de6\u53f3\u306b\u4f59\u767d\u304c\u306a\u3044\" class=\"wp-image-523\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_06.png 785w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_06-768x520.png 768w\" sizes=\"auto, (max-width: 785px) 100vw, 785px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u3053\u3067\u3001<code>theme.json<\/code> \u3067\u30ac\u30bf\u30fc\u7528\u306e CSS \u5909\u6570\u3092\u5b9a\u7fa9\u3057\u3001\u305d\u308c\u3092\u307e\u305a\u306f\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u306b\u9069\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n    \"settings\": {\n        \"custom\": {\n            \"gutter\": \"1rem\"\n        }\n    }\n}<\/code><\/pre>\n\n\n\n<pre data-label=\"editor-style.css\" id=\"editor-style.css\" class=\"wp-block-code lang-css\"><code>body {\n\tpadding-left: var(--wp--custom--gutter);\n\tpadding-right: var(--wp--custom--gutter);\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u305f\u3060\u3057\u3001\u5168\u5e45\u306e\u30d6\u30ed\u30c3\u30af\u306b\u306f\u5de6\u53f3\u306b\u30ac\u30bf\u30fc\u3092\u6301\u305f\u305b\u305f\u304f\u306a\u3044\u305f\u3081\u3001\u540c\u3058\u5024\u3092\u5de6\u53f3\u306e\u30de\u30a4\u30ca\u30b9\u30de\u30fc\u30b8\u30f3\u3068\u3057\u3066\u6307\u5b9a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"editor-style.css\" id=\"editor-style.css\" class=\"wp-block-code lang-css\"><code>.alignfull {\n\tmargin-left: calc( var(--wp--custom--gutter) * -1);\n\tmargin-right: calc( var(--wp--custom--gutter) * -1);\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u3059\u308b\u3068\u3001\u5168\u5e45\u306e\u30d6\u30ed\u30c3\u30af\u3092\u9664\u3044\u3066\u3001\u5de6\u53f3\u306b\u4f59\u767d\u304c\u51fa\u6765\u3066\u3044\u308b\u4e8b\u3092\u78ba\u8a8d\u51fa\u6765\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"390\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_07-840x390.png\" alt=\"\u5168\u5e45\u306e\u30d6\u30ed\u30c3\u30af\u3092\u9664\u3044\u3066\u3001\u5de6\u53f3\u306b\u4f59\u767d\u304c\u51fa\u6765\u3066\u3044\u308b\" class=\"wp-image-524\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_07-840x390.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_07-768x357.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_07.png 1476w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u540c\u69d8\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u3001\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u5074\u306b\u3082\u9069\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"style.css\" id=\"style.css\" class=\"wp-block-code lang-css\"><code>.entry-content {\n\tpadding-left: var(--wp--custom--gutter);\n\tpadding-right: var(--wp--custom--gutter);\n}\n\n.entry-content &gt; *.alignfull {\n\tmargin-left: calc( var(--wp--custom--gutter) * -1);\n\tmargin-right: calc( var(--wp--custom--gutter) * -1);\n}<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"287\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_08-840x287.png\" alt=\"\u5168\u5e45\u306e\u30d6\u30ed\u30c3\u30af\u3092\u9664\u3044\u3066\u3001\u5de6\u53f3\u306b\u4f59\u767d\u304c\u51fa\u6765\u3066\u3044\u308b\uff08\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\uff09\" class=\"wp-image-525\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_08-840x287.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_08-768x262.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_08.png 1506w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u306a\u304a\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u306b\u304a\u3044\u3066\u306f\u3001\u540c\u3058\u3088\u3046\u306a\u4e8b\u3092\u5b9f\u73fe\u3059\u308b\u305f\u3081\u306e <code>useRootPaddingAwareAlignments<\/code> \u3068\u3044\u3046\u30d7\u30ed\u30d1\u30c6\u30a3\u304c\u3042\u308b\u306e\u3067\u3001\u8208\u5473\u304c\u3042\u308b\u65b9\u306f\u8abf\u3079\u3066\u307f\u3066\u4e0b\u3055\u3044\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/aki-hamano.blog\/2022\/10\/10\/wp6-1-theme-json\/#settingsuseRootPaddingAwareAlignments\">\u3010WordPress6.1\u3011theme.json \u306e\u5909\u66f4\u70b9: settings.useRootPaddingAwareAlignments<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/make.wordpress.org\/themes\/2022\/09\/07\/full-width-blocks-and-root-padding-in-wordpress-6-1\/\" target=\"_blank\" rel=\"noreferrer noopener\">Full-Width Blocks and Root Padding in WordPress 6.1 \u2013 Make WordPress Themes<\/a><\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"block-margin\">\u30d6\u30ed\u30c3\u30af\u9593\u306e\u30de\u30fc\u30b8\u30f3\u8a2d\u5b9a<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u73fe\u72b6\u306f\u3001\u30d6\u30ed\u30c3\u30af\u9593\u306e\u4e0a\u4e0b\u30de\u30fc\u30b8\u30f3\u306f\u5b9a\u7fa9\u3055\u308c\u3066\u304a\u3089\u305a\u3001\u8981\u7d20\u306b\u3088\u3063\u3066\u30d6\u30e9\u30a6\u30b6\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30de\u30fc\u30b8\u30f3\u304c\u5f53\u305f\u3063\u3066\u3044\u308b\u3060\u3051\u3067\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"393\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_09-840x393.png\" alt=\"\u8981\u7d20\u306b\u3088\u3063\u3066\u30d6\u30e9\u30a6\u30b6\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30de\u30fc\u30b8\u30f3\u304c\u5f53\u305f\u3063\u3066\u3044\u308b\" class=\"wp-image-526\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_09-840x393.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_09-768x359.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_09-1536x719.png 1536w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_09.png 1560w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u3001\u30d6\u30ed\u30c3\u30af\u9593\u306b\u7d71\u4e00\u3057\u305f\u30de\u30fc\u30b8\u30f3\u3092\u6301\u305f\u305b\u308b\u305f\u3081\u3001<code>theme.json<\/code> \u306e\u30eb\u30fc\u30c8\u30ec\u30d9\u30eb\u3067 <code>blockGap<\/code> \u3092\u30aa\u30d7\u30c8\u30a4\u30f3\u3057\u3001\u30d6\u30ed\u30c3\u30af\u9593\u306e\u30de\u30fc\u30b8\u30f3\u3092 <code>1.5rem<\/code> \u306b\u5909\u66f4\u3057\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"settings\": {\n\t\t\"spacing\": {\n\t\t\t\"blockGap\": true\n\t\t}\n\t},\n\t\"styles\": {\n\t\t\"spacing\": {\n\t\t\t\"blockGap\": \"1.5rem\"\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u898b\u3084\u3059\u3044\u3088\u3046\u306b\u80cc\u666f\u8272\u3092\u4ed8\u3051\u3066\u3044\u307e\u3059\u304c\u3001\u4ee5\u4e0b\u306e\u30eb\u30fc\u30eb\u3067\u30de\u30fc\u30b8\u30f3\u304c\u9069\u7528\u3055\u308c\u3066\u3044\u308b\u4e8b\u304c\u5206\u304b\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>is-layout-flow<\/code> \u76f4\u4e0b\u306e\u8981\u7d20\u306e\u4e0a\u4e0b\u30de\u30fc\u30b8\u30f3\u30920\u306b\u3059\u308b<\/li>\n\n\n\n<li><code>is-layout-flow<\/code> \u76f4\u4e0b\u306e\u521d\u3081\u306e\u8981\u7d20\u3092\u9664\u3044\u3066\u3001\u4e0a\u30de\u30fc\u30b8\u30f3\u306b <code>blockGap<\/code> \u306e\u5024\u3092\u9069\u7528\u3059\u308b<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"392\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_10-840x392.png\" alt=\"\u30eb\u30fc\u30eb\u306b\u57fa\u3065\u3044\u3066\u30de\u30fc\u30b8\u30f3\u304c\u9069\u7528\u3055\u308c\u3066\u3044\u308b\" class=\"wp-image-527\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_10-840x392.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_10-768x359.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_10.png 1422w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3055\u3089\u306b\u3001\u30b0\u30eb\u30fc\u30d7\u30d6\u30ed\u30c3\u30af\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3067\u3042\u308b\u300c\u884c\u300d\u30d6\u30ed\u30c3\u30af\u3084\u30ab\u30e9\u30e0\u30d6\u30ed\u30c3\u30af\u7b49\u306e\u3088\u3046\u306a Flex \u30ec\u30a4\u30a2\u30a6\u30c8\u3067\u3001<code>gap<\/code> \u3067\u30d6\u30ed\u30c3\u30af\u9593\u306e\u4f59\u767d\u3092\u53d6\u3063\u3066\u3044\u308b\u30d6\u30ed\u30c3\u30af\u306b\u3064\u3044\u3066\u3082\u540c\u3058\u5024\u304c\u4f7f\u308f\u308c\u3066\u3044\u308b\u305f\u3081\u3001<strong>\u7e26\u6a2a\u3067\u7d71\u4e00\u3057\u305f\u4f59\u767d\u3092\u78ba\u4fdd\u51fa\u6765\u308b<\/strong>\u4e8b\u304c\u5206\u304b\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"319\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_11-840x319.png\" alt=\"gap \u3067\u30d6\u30ed\u30c3\u30af\u9593\u306e\u4f59\u767d\u3092\u53d6\u3063\u3066\u3044\u308b\u30d6\u30ed\u30c3\u30af\u306b\u3064\u3044\u3066\u3082\u540c\u3058\u5024\u304c\u4f7f\u308f\u308c\u3066\u3044\u308b\" class=\"wp-image-528\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_11-840x319.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_11-768x292.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_11.png 1396w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3067\u3059\u304c\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u5074\u3067\u306f\u3001<code>.entry-content<\/code> \u76f4\u4e0b\u306e\u8981\u7d20\u306e\u4e0a\u4e0b\u30de\u30fc\u30b8\u30f3\u306b\u3001<code>theme.json<\/code> \u3067\u6307\u5b9a\u3057\u305f <code>blockGap<\/code> \u304c\u9069\u7528\u3055\u308c\u3066\u3044\u306a\u3044\u4e8b\u304c\u5206\u304b\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"779\" height=\"597\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_12.png\" alt=\".entry-content \u76f4\u4e0b\u306e\u8981\u7d20\u306e\u4e0a\u4e0b\u30de\u30fc\u30b8\u30f3\u306b\u3001theme.json \u3067\u6307\u5b9a\u3057\u305f blockGap \u304c\u9069\u7528\u3055\u308c\u3066\u3044\u306a\u3044\" class=\"wp-image-529\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_12.png 779w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_12-768x589.png 768w\" sizes=\"auto, (max-width: 779px) 100vw, 779px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u306f\u3001\u30a8\u30c7\u30a3\u30bf\u30fc\u3068\u540c\u69d8\u306e\u69cb\u9020\u3092\u518d\u73fe\u3059\u308b\u305f\u3081\u306b\u3001<code>.entry-content<\/code> \u306b <code>.is-layout-flow<\/code> \u30af\u30e9\u30b9\u3092\u4ed8\u4e0e\u3059\u308b\u4e8b\u3067\u89e3\u6d88\u51fa\u6765\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"index.php\" id=\"index.php\" class=\"wp-block-code lang-php\"><code>&lt;div class=\"entry-content is-layout-flow\"&gt;\n\t&lt;?php the_content(); ?&gt;\n&lt;\/div&gt;<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"796\" height=\"636\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_13.png\" alt=\".entry-content \u306b .is-layout-flow \u30af\u30e9\u30b9\u3092\u4ed8\u4e0e\u3059\u308b\u4e8b\u3067\u89e3\u6d88\" class=\"wp-image-530\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_13.png 796w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_13-768x614.png 768w\" sizes=\"auto, (max-width: 796px) 100vw, 796px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"per-block-margin\">\u30d6\u30ed\u30c3\u30af\u500b\u5225\u306e\u30de\u30fc\u30b8\u30f3\u8a2d\u5b9a<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u3088\u304f\u3042\u308b\u30b1\u30fc\u30b9\u3068\u3057\u3066\u3001\u300c<strong>\u7279\u5b9a\u306e\u30d6\u30ed\u30c3\u30af\u3060\u3051\u4e0a\u4e0b\u30de\u30fc\u30b8\u30f3\u3092\u30c7\u30d5\u30a9\u30eb\u30c8\u5024\u304b\u3089\u5909\u3048\u305f\u3044<\/strong>\u300d\u3068\u3044\u3046\u3082\u306e\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f8b\u3048\u3070\u3001\u898b\u51fa\u3057 (<code>h2<\/code>)\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u4e0a\u30de\u30fc\u30b8\u30f3\u3060\u3051\u3092 <code>1.5rem<\/code> \u304b\u3089 <code>3rem<\/code> \u306b\u5909\u3048\u308b\u305f\u3081\u306b\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u30b9\u30bf\u30a4\u30eb\u3092\u5b9a\u7fa9\u3057\u305f\u3068\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"styles\": {\n\t\t\"elements\": {\n\t\t\t\"h2\": {\n\t\t\t\t\"spacing\": {\n\t\t\t\t\t\"margin\": {\n\t\t\t\t\t\t\"top\": \"3rem\"\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u6b8b\u5ff5\u306a\u304c\u3089\u4e0a\u8a18\u30b9\u30bf\u30a4\u30eb\u306f\u3001\u30d6\u30ed\u30c3\u30af\u9593\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u30de\u30fc\u30b8\u30f3\u306b\u3088\u308a\u51fa\u529b\u3055\u308c\u308b\u30bb\u30ec\u30af\u30bf\u3088\u308a\u8a73\u7d30\u5ea6\u304c\u4f4e\u3044\u305f\u3081\u9069\u7528\u3055\u308c\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"365\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_14-840x365.png\" alt=\"\u898b\u51fa\u3057 (h2)\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u4e0a\u30de\u30fc\u30b8\u30f3\u304c\u9069\u7528\u3055\u308c\u306a\u3044\" class=\"wp-image-531\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_14-840x365.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_14-768x334.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_14.png 1488w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u554f\u984c\u306f\u3001Gutenberg \u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3067\u3082 issue \u3068\u3057\u3066\u5831\u544a\u3055\u308c\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/43404\" target=\"_blank\" rel=\"noreferrer noopener\">Layout: layout styles overriding block axial margin values in theme.json #43404<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u8003\u3048\u3089\u308c\u308b\u30a2\u30d7\u30ed\u30fc\u30c1\u306f\u3001\u4ee5\u4e0b4\u3064\u3067\u3059\u3002<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>\u30eb\u30fc\u30c8\u30ec\u30d9\u30eb\u3067\u306e\u30de\u30fc\u30b8\u30f3 (<code>blockGap<\/code>) \u3092\u7121\u52b9\u5316\u3057\u3001\u30d6\u30ed\u30c3\u30af\u9593\u306e\u30de\u30fc\u30b8\u30f3\u306f\u81ea\u524d\u306e CSS \u3067\u30b3\u30f3\u30c8\u30ed\u30fc\u30eb\u3059\u308b<\/li>\n\n\n\n<li>\u30eb\u30fc\u30c8\u30ec\u30d9\u30eb\u3067\u306e\u30de\u30fc\u30b8\u30f3 (<code>blockGap<\/code>) \u3092\u7121\u52b9\u5316\u3057\u3001\u30d6\u30ed\u30c3\u30af\u9593\u306e\u30de\u30fc\u30b8\u30f3\u306f <code>theme.json<\/code> \u3067\u5168\u3066\u30d6\u30ed\u30c3\u30af\u500b\u5225\u306b\u5b9a\u7fa9\u3059\u308b<\/li>\n\n\n\n<li>\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u306e\u30de\u30fc\u30b8\u30f3\u3092\u4f7f\u3063\u3066\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u306e\u4e2d\u3067\u500b\u5225\u306b\u4e0a\u66f8\u304d\u3059\u308b<\/li>\n\n\n\n<li>\u3088\u308a\u8a73\u7d30\u5ea6\u306e\u9ad8\u3044\u30bb\u30ec\u30af\u30bf\u3092\u4f7f\u3063\u305f CSS \u3067\u4e0a\u66f8\u304d\u3059\u308b<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">1\u3064\u76ee\u306e\u65b9\u6cd5\u306f\u3001<code>blockGap<\/code> \u306e\u5b9a\u7fa9\u304c\u51fa\u529b\u3059\u308b\u30b9\u30bf\u30a4\u30eb\u3092 CSS \u3067\u5168\u3066\u5b9a\u7fa9\u3059\u308b\u4e8b\u304c\u5927\u5909\u3067\u3042\u308b\u4e8b\u3084\u3001\u307e\u305f\u540c\u69d8\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u5b9f\u73fe\u3059\u308b\u305f\u3081\u306b\u306f\u3001\u7d50\u5c40\u305d\u3053\u307e\u3067\u8a73\u7d30\u5ea6\u3092\u4f4e\u304f\u3059\u308b\u4e8b\u304c\u51fa\u6765\u306a\u3044\u3068\u3044\u3046\u554f\u984c\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">2\u3064\u76ee\u306e\u65b9\u6cd5\u306f\u3001\u5168\u3066\u306e\u30d6\u30ed\u30c3\u30af\u306b\u30de\u30fc\u30b8\u30f3\u3092\u8a2d\u5b9a\u3059\u308b\u4e8b\u304c\u5927\u5909\u3067\u3042\u308b\u4e8b\u306f\u3082\u3061\u308d\u3093\u3067\u3059\u304c\u3001\u4eca\u5f8c\u65b0\u3057\u3044\u30d6\u30ed\u30c3\u30af\u304c\u5897\u3048\u308b\u305f\u3073\u306b\u30de\u30fc\u30b8\u30f3\u306e\u5b9a\u7fa9\u3092\u5897\u3084\u3055\u306a\u3051\u308c\u3070\u306a\u3089\u306a\u3044\u3001\u3068\u3044\u3046\u624b\u9593\u304c\u767a\u751f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">3\u3064\u76ee\u306e\u65b9\u6cd5\u306f\u3001\u6295\u7a3f\u3092\u4f5c\u6210\u3059\u308b\u5ea6\u306b\u5fc5\u8981\u306a\u30d6\u30ed\u30c3\u30af\u306b\u5bfe\u3057\u3066\u5168\u3066\u500b\u5225\u306b\u30de\u30fc\u30b8\u30f3\u3092\u8a2d\u5b9a\u3059\u308b\u5fc5\u8981\u304c\u3042\u308a\u3001\u73fe\u5b9f\u7684\u3067\u306f\u3042\u308a\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u306e\u305f\u3081\u30014\u3064\u76ee\u306e\u65b9\u6cd5\u306e\u300c<strong>\u3088\u308a\u8a73\u7d30\u5ea6\u306e\u9ad8\u3044\u30bb\u30ec\u30af\u30bf\u3092\u4f7f\u3063\u305f CSS \u3067\u4e0a\u66f8\u304d\u3059\u308b<\/strong>\u300d\u3092\u63a1\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u306f\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u3001<code>.is-layout-flow<\/code> \u76f4\u4e0b\u306e\u6700\u521d\u306e\u8981\u7d20\u3092\u9664\u3044\u3066\u3001\u898b\u51fa\u3057\u306e\u4e0a\u30de\u30fc\u30b8\u30f3\u3092 <code>3rem<\/code> \u3067 \u4e0a\u66f8\u304d\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"editor-style.css\" id=\"editor-style.css\" class=\"wp-block-code lang-css\"><code>.is-layout-flow &gt; * + .wp-block-heading {\n\tmargin-top: 3rem;\n}<\/code><\/pre>\n\n\n\n<pre data-label=\"style.css\" id=\"style.css\" class=\"wp-block-code lang-css\"><code>.is-layout-flow &gt; * + h1,\n.is-layout-flow &gt; * + h2,\n.is-layout-flow &gt; * + h3,\n.is-layout-flow &gt; * + h4,\n.is-layout-flow &gt; * + h5,\n.is-layout-flow &gt; * + h6 {\n\tmargin-top: 3rem;\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u306e\u8a2d\u8a08<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ee5\u4e0b\u306e\u8a18\u4e8b\u306b\u898b\u3089\u308c\u308b\u3088\u3046\u306b\u3001\u5404\u30d6\u30ed\u30c3\u30af\u306e\u30c7\u30b6\u30a4\u30f3\u30c4\u30fc\u30eb\u306e\u4e00\u8cab\u6027\u3092\u9ad8\u3081\u308b\u305f\u3081\u306b\u3001\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u304c\u3069\u3093\u3069\u3093\u8ffd\u52a0\u3055\u308c\u3066\u304a\u308a\u3001WordPress 6.2\u3067\u306f\u3055\u3089\u306b\u591a\u304f\u306e\u30b5\u30dd\u30fc\u30c8\u304c\u8ffd\u52a0\u3055\u308c\u308b\u4e88\u5b9a\u3067\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/10\/11\/roster-of-design-tools-per-block\/\" target=\"_blank\" rel=\"noreferrer noopener\">Roster of design tools per block<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/09\/26\/core-editor-improvement-catalyst-for-creativity\/\" target=\"_blank\" rel=\"noreferrer noopener\">Core Editor Improvement: Catalyst for creativity and control<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/43241\" target=\"_blank\" rel=\"noreferrer noopener\">Tracking: Addressing Design Tooling Consistency #43241<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u3089\u306e\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u3092\u3001\u305d\u306e\u30b5\u30a4\u30c8\u306e\u8981\u4ef6\u306b\u5408\u308f\u305b\u3066 <code>theme.json<\/code> \u3067\u30b3\u30f3\u30c8\u30ed\u30fc\u30eb\u3059\u308b\u306b\u3042\u305f\u308a\u3001\u8003\u3048\u3089\u308c\u308b\u30a2\u30d7\u30ed\u30fc\u30c1\u306f\u4ee5\u4e0b\u306e\u3069\u3061\u3089\u304b\u3067\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>settings.appearanceTools<\/code> \u3067\u5168\u3066\u306e\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u3092\u4e00\u62ec\u30aa\u30d7\u30c8\u30a4\u30f3\u3057\u3001\u30eb\u30fc\u30c8\u30ec\u30d9\u30eb\u307e\u305f\u306f\u30d6\u30ed\u30c3\u30af\u30ec\u30d9\u30eb\u3067\u4e0d\u8981\u306a\u3082\u306e\u306f\u500b\u5225\u306b\u30aa\u30d7\u30c8\u30a2\u30a6\u30c8\u3059\u308b<\/li>\n\n\n\n<li><code>settings.appearanceTools<\/code>\u306f\u4f7f\u7528\u305b\u305a\u3001\u5fc5\u8981\u306a\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u306e\u307f\u3092\u30eb\u30fc\u30c8\u30ec\u30d9\u30eb\u307e\u305f\u306f\u30d6\u30ed\u30c3\u30af\u30ec\u30d9\u30eb\u3067\u30aa\u30d7\u30c8\u30a4\u30f3 \/ \u30aa\u30d7\u30c8\u30a2\u30a6\u30c8\u3057\u3066\u3044\u304f<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u4e0d\u7279\u5b9a\u591a\u6570\u306e\u30e6\u30fc\u30b6\u30fc\u5411\u3051\u306b\u516c\u958b\u3057\u305f\u308a\u6c4e\u7528\u6027\u3092\u9ad8\u3081\u308b\u306e\u3067\u3042\u308c\u3070\u3001\u5229\u7528\u51fa\u6765\u308b\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u306f\u51fa\u6765\u308b\u9650\u308a\u63d0\u4f9b\u3057\u305f\u3044\u306f\u305a\u306a\u306e\u3067\u30011\u3064\u76ee\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u304c\u6700\u9069\u3060\u3068\u601d\u3044\u307e\u3059\u3002\u9006\u306b\u3001\u53d7\u8a17\u958b\u767a\u306b\u304a\u3051\u308b\u500b\u5225\u6700\u9069\u5316\u3055\u308c\u305f\u30c6\u30fc\u30de\u3067\u306f\u3001\u300c<strong>\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u69cb\u7bc9\u3059\u308b\u306b\u3042\u305f\u308a\u3001\u4f7f\u7528\u3059\u308b\u53ef\u80fd\u6027\u304c\u3042\u308b\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u306e\u307f\u3092 UI \u3068\u3057\u3066\u8868\u793a\u3055\u305b\u308b<\/strong>\u300d\u3068\u3044\u3046\u65b9\u91dd\u3068\u3057\u30012\u3064\u76ee\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u63a1\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u306f\u307e\u305a\u3001\u30eb\u30fc\u30c8\u30ec\u30d9\u30eb\u3067\u4ee5\u4e0b\u306e\u5bfe\u5fdc\u3092\u884c\u3046\u4e8b\u3068\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u30de\u30fc\u30b8\u30f3\u30fb\u30d1\u30c7\u30a3\u30f3\u30b0\u306f\u3001\u7279\u306b\u56fa\u5b9a\u30da\u30fc\u30b8\u3067\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u306b\u304a\u3044\u3066\u91cd\u8981\u3067\u3042\u308b\u305f\u3081\u30aa\u30d7\u30c8\u30a4\u30f3\u3059\u308b<\/li>\n\n\n\n<li>\u30bf\u30a4\u30dd\u30b0\u30e9\u30d5\u30a3\u30d1\u30cd\u30eb\u3067\u306f <code>line-height<\/code> \u3092\u30aa\u30d7\u30c8\u30a4\u30f3\u3057\u3001\u305d\u306e\u4ed6\u4f7f\u7528\u3055\u308c\u308b\u53ef\u80fd\u6027\u304c\u4f4e\u3044\u30b5\u30dd\u30fc\u30c8\u306f\u30aa\u30d7\u30c8\u30a2\u30a6\u30c8\u3059\u308b<\/li>\n<\/ul>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"settings\": {\n\t\t\"spacing\": {\n\t\t\t\"margin\": true,\n\t\t\t\"padding\": true\n\t\t},\n\t\t\"typography\": {\n\t\t\t\"lineHeight\": true,\n\t\t\t\"letterSpacing\": false,\n\t\t\t\"textDecoration\": false,\n\t\t\t\"textTransform\": false,\n\t\t\t\"dropCap\": false,\n\t\t\t\"fontStyle\": false\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u306b\u3088\u308a\u3001\u4f8b\u3048\u3070\u6bb5\u843d\u30d6\u30ed\u30c3\u30af\u3067\u3042\u308c\u3070\u3001\u30b5\u30a4\u30c9\u30d0\u30fc\u306e UI \u306f\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u5909\u308f\u308a\u307e\u3059 (\u30d1\u30cd\u30eb\u306f\u5168\u3066\u958b\u3044\u305f\u72b6\u614b\u306b\u5909\u66f4)\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"623\" height=\"486\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_15.png\" alt=\"\u30b5\u30a4\u30c9\u30d0\u30fc\u306e UI\u306e\u5909\u5316\" class=\"wp-image-532\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u306b\u52a0\u3048\u3066\u3001\u30b5\u30a4\u30c8\u306e\u8981\u4ef6\u306b\u3042\u308f\u305b\u3066\u30eb\u30fc\u30c8\u30ec\u30d9\u30eb\u3067\u306e\u30aa\u30d7\u30c8\u30a4\u30f3\u30fb\u30aa\u30d7\u30c8\u30a2\u30a6\u30c8\u3001<code>settings.blocks.core.XXXX<\/code> \u30d7\u30ed\u30d1\u30c6\u30a3\u3092\u5229\u7528\u3057\u305f\u30d6\u30ed\u30c3\u30af\u30ec\u30d9\u30eb\u3067\u306e\u30aa\u30d7\u30c8\u30a4\u30f3\u30fb\u30aa\u30d7\u30c8\u30a2\u30a6\u30c8\u3092\u884c\u3063\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u5177\u4f53\u7684\u306b\u306f\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u4f8b\u3067\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u898b\u51fa\u3057\u30d6\u30ed\u30c3\u30af\u3060\u3051\u306f <code>letter-spacing<\/code> \u3092\u30b5\u30dd\u30fc\u30c8\u3057\u305f\u3044\u305f\u3081\u3001<code>settings.blocks.core\/heading.typography.letterSpacing<\/code> \u3092 <code>true<\/code> \u306b\u3059\u308b<\/li>\n\n\n\n<li>\u30ab\u30e9\u30e0\u30d6\u30ed\u30c3\u30af\u9593\u306e\u4f59\u767d\u306f\u5909\u66f4\u3057\u3066\u307b\u3057\u304f\u306a\u3044\u305f\u3081\u3001<code>settings.blocks.core\/columns.spacing.blockGap<\/code> \u3092 <code>false<\/code> \u306b\u3059\u308b<\/li>\n\n\n\n<li>\u30b0\u30eb\u30fc\u30d7\u30d6\u30ed\u30c3\u30af\u306f\u5168\u3066\u306e\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u3092\u30aa\u30d7\u30c8\u30a4\u30f3\u3057\u305f\u3044\u305f\u3081\u3001<code>settings.blocks.core\/group.appearanceTools<\/code> \u3092 <code>true<\/code> \u306b\u3059\u308b<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u30dd\u30a4\u30f3\u30c8\u306f\u3001<code>settings.appearanceTools<\/code> \u3067\u4e00\u62ec\u30aa\u30d7\u30c8\u30a4\u30f3\u3057\u3066\u3044\u306a\u304b\u3063\u305f\u3068\u3057\u3066\u3082\u3001<strong>\u5404\u30d7\u30ed\u30d1\u30c6\u30a3\u306f\u30c7\u30d5\u30a9\u30eb\u30c8\u3067 <code>true<\/code> \u306e\u3082\u306e\u3082\u3042\u308b\u305f\u3081\u3001\u660e\u793a\u7684\u306b <code>false<\/code> \u3092\u6307\u5b9a\u3057\u3066\u30aa\u30d7\u30c8\u30a2\u30a6\u30c8\u3057\u306a\u3051\u308c\u3070\u306a\u3089\u306a\u3044\u30d7\u30ed\u30d1\u30c6\u30a3\u3082\u3042\u308b<\/strong>\u3001\u3068\u3044\u3046\u70b9\u3067\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u30bf\u30a4\u30dd\u30b0\u30e9\u30d5\u30a3<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"font-size-variation\">\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305a\u3001\u5fc5\u8981\u306a\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3092\u4ee5\u4e0b2\u3064\u306e\u30ec\u30a4\u30e4\u30fc\u306b\u5206\u985e\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u8a2d\u5b9a\u51fa\u6765\u308b\u3079\u304d\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3<\/li>\n\n\n\n<li>\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u8a2d\u5b9a\u51fa\u6765\u306a\u304f\u3066\u3082\u3088\u3044\u304c\u3001\u30c6\u30fc\u30de\u3092\u69cb\u6210\u3059\u308b\u4e0a\u3067\u5fc5\u8981\u306a\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">1\u3064\u76ee\u306f\u3001\u3044\u308f\u308b\u3086\u308b PHP \u3067\u884c\u3063\u3066\u3044\u308b <code>add_theme_support( 'editor-font-sizes', array() )<\/code> \u3092 <code>theme.json<\/code> \u4e0a\u3067\u5b9a\u7fa9\u3059\u308b\u3068\u3044\u3046\u4e8b\u306b\u306a\u308a\u307e\u3059\u30022\u3064\u76ee\u306f CSS \u5909\u6570\u3068\u3057\u3066\u5b9a\u7fa9\u3057\u3001<code>theme.json<\/code> \u306e\u4ed6\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u3084\u3001PHP \u30da\u30fc\u30b8\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u3092\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u3059\u308b\u6642\u306e CSS \u304b\u3089\u53c2\u7167\u51fa\u6765\u308b\u3088\u3046\u306b\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">1\u3064\u76ee\u306e\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u8a2d\u8a08\u306e\u53c2\u8003\u3068\u3057\u3066\u3001Twenty Twenty Two \u306e <code>theme.json<\/code> \u3092\u898b\u3066\u307f\u307e\u3059\u3002\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u306f <code>small<\/code> \/ <code>medium<\/code> \/ <code>large<\/code> \/ <code>x-large<\/code> \u306e4\u7a2e\u985e\u304c\u3001CSS \u5909\u6570\u3068\u3057\u3066\u306f\u3088\u308a\u5927\u304d\u3044\u30b5\u30a4\u30ba\u3068\u3057\u3066 <code>huge<\/code> \/ <code>gigantic<\/code> \/ <code>colossal<\/code> \u306e3\u7a2e\u985e\u304c\u5b9a\u7fa9\u3055\u308c\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentytwo\/theme.json#L200\" target=\"_blank\" rel=\"noreferrer noopener\">\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentytwo\/theme.json#L147\" target=\"_blank\" rel=\"noreferrer noopener\">CSS \u5909\u6570\u3068\u3057\u3066\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Twenty Twenty Three \u3067\u306f\u3001<a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentythree\/theme.json#L249\" target=\"_blank\" rel=\"noreferrer noopener\">\u5168\u3066\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u304c\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u4f7f\u7528\u51fa\u6765\u308b\u3082\u306e\u3068\u3057\u3066\u5b9a\u7fa9<\/a>\u3055\u308c\u3066\u304a\u308a\u3001\u3055\u3089\u306b WordPress6.1\u304b\u3089\u306f\u5c0e\u5165\u3055\u308c\u305f <a href=\"https:\/\/make.wordpress.org\/core\/2022\/05\/27\/block-font-sizes-and-fluid-typography\/\" target=\"_blank\" rel=\"noreferrer noopener\">Fluid Typography<\/a> \u304c\u4f7f\u7528\u3055\u308c\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3082\u30461\u3064\u91cd\u8981\u306a\u4e8b\u306f\u3001\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u8a2d\u5b9a\u51fa\u6765\u308b\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u304c<strong>5\u500b\u4ee5\u4e0b<\/strong>\u3067\u3042\u3063\u305f\u5834\u5408\u3001\u30d7\u30eb\u30c0\u30a6\u30f3\u3067\u306f\u306a\u304f\u30dc\u30bf\u30f3\u30b0\u30eb\u30fc\u30d7\u3068\u3057\u3066\u8868\u793a\u3055\u308c\u3001WordPress6.1\u304b\u3089\u306f<a href=\"https:\/\/github.com\/WordPress\/gutenberg\/pull\/43074\" target=\"_blank\" rel=\"noreferrer noopener\">\u8868\u793a\u30e9\u30d9\u30eb\u304cS\u30b5\u30a4\u30ba\u59cb\u307e\u308a\uff5eXXL\u307e\u3067\u306eT\u30b7\u30e3\u30c4\u30b5\u30a4\u30ba<\/a>\u306b\u56fa\u5b9a\u3055\u308c\u308b\u3001\u3068\u3044\u3046\u70b9\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u306e\u305f\u3081\u3001\u4f8b\u3048\u3070\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u306e\u6700\u5c0f\u30b5\u30a4\u30ba\u306e\u30b9\u30e9\u30c3\u30b0\u3092 <code>xs<\/code> \u3068\u3057\u3001\u304b\u3064\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u6570\u304c5\u3064\u4ee5\u4e0b\u306e\u5834\u5408\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u30e9\u30d9\u30eb\u304c\u98df\u3044\u9055\u3063\u3066\u3057\u307e\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"422\" height=\"207\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_16.png\" alt=\"\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u30e9\u30d9\u30eb\u306e\u98df\u3044\u9055\u3044\" class=\"wp-image-533\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u304c6\u500b\u4ee5\u4e0a\u306e\u5834\u5408\u306f\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u30d7\u30eb\u30c0\u30a6\u30f3\u3068\u3057\u3066\u8868\u793a\u3055\u308c\u3001\u30e9\u30d9\u30eb\u306e\u98df\u3044\u9055\u3044\u3082\u767a\u751f\u3057\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"425\" height=\"468\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_17.png\" alt=\"\u30d7\u30eb\u30c0\u30a6\u30f3\u3068\u3057\u3066\u8868\u793a\u3055\u308c\u308b\" class=\"wp-image-534\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u307e\u3067\u3092\u8e0f\u307e\u3048\u3066\u3001\u4ee5\u4e0b\u306e\u89b3\u70b9\u304b\u3089\u6700\u9069\u306a\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3092\u63a2\u3063\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u4f7f\u7528\u3057\u305f\u3044\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u306f\u3044\u304f\u3064\u3042\u308b\u304b<\/li>\n\n\n\n<li>\u305d\u308c\u3089\u306e\u3046\u3061\u3001\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u8a2d\u5b9a\u51fa\u6765\u308b\u3079\u304d\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u306f\u3044\u304f\u3064\u3042\u308b\u304b<\/li>\n\n\n\n<li>\u30dc\u30bf\u30f3\u30b0\u30eb\u30fc\u30d7\u5f62\u5f0f\u30fb\u30c9\u30ed\u30c3\u30d7\u30c0\u30a6\u30f3\u5f62\u5f0f\u306e\u3069\u3061\u3089\u306e UI \u3092\u4f7f\u7528\u3057\u305f\u3044\u304b<\/li>\n\n\n\n<li>Fluid Typography \u3092\u5229\u7528\u3059\u308b\u304b\u3069\u3046\u304b<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u306f\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u53d6\u3063\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u9078\u629e\u306e UI \u306f\u30dc\u30bf\u30f3\u30b0\u30eb\u30fc\u30d7\u5f62\u5f0f\u3092\u7dad\u6301\u3057\u305f\u3044\u305f\u3081\u3001\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u306f5\u3064\u307e\u3067\u3068\u3059\u308b\u3002<\/li>\n\n\n\n<li>Twenty Twenty Three \u3068 Twenty Twenty Two \u306e\u8a2d\u8a08\u3092\u30df\u30c3\u30af\u30b9\u3057\u3001\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306f\u5168\u3066 Fluid Typography \u3067\u5b9a\u7fa9\u3057\u3001\u305d\u308c\u4ee5\u5916\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u306f CSS \u5909\u6570\u3068\u3057\u3066\u5b9a\u7fa9\u3059\u308b<\/li>\n\n\n\n<li>\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u304b\u3089\u751f\u6210\u3055\u308c\u305f CSS \u5909\u6570\u3092\u4f7f\u3063\u3066\u3001\u305d\u306e\u307e\u307e\u5404\u898b\u51fa\u3057\u30ec\u30d9\u30eb\u306b\u3082\u9069\u7528\u3067\u304d\u308b\u3088\u3046\u306b\u3059\u308b<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>\u30ec\u30a4\u30e4\u30fc<\/th><th>\u30b9\u30e9\u30c3\u30b0<\/th><th>\u30b5\u30a4\u30ba (min \uff5e max)<\/th><th>\u5bfe\u5fdc\u3059\u308b\u898b\u51fa\u3057<\/th><\/tr><\/thead><tbody><tr><td>\u30a8\u30c7\u30a3\u30bf\u30fc<\/td><td><code>small<\/code><\/td><td>0.875rem (14px) \uff5e 1rem (16px)<\/td><td><\/td><\/tr><tr><td>\u30a8\u30c7\u30a3\u30bf\u30fc<\/td><td><code>medium<\/code><\/td><td>1rem (16px) \uff5e 1.125rem (18px)<\/td><td>H5 \/ H6 \uff08\u30b5\u30a4\u30c8\u30c7\u30d5\u30a9\u30eb\u30c8\u30b5\u30a4\u30ba\uff09<\/td><\/tr><tr><td>\u30a8\u30c7\u30a3\u30bf\u30fc<\/td><td><code>large<\/code><\/td><td>1.125rem (18px) \uff5e 1.5rem (24px)<\/td><td>H4<\/td><\/tr><tr><td>\u30a8\u30c7\u30a3\u30bf\u30fc<\/td><td><code>x-large<\/code><\/td><td>1.25rem (20px) \uff5e 1.875rem (30px)<\/td><td>H3<\/td><\/tr><tr><td>\u30a8\u30c7\u30a3\u30bf\u30fc<\/td><td><code>xx-large<\/code><\/td><td>1.5rem (24px) \uff5e 2.25rem (36px)<\/td><td><\/td><\/tr><tr><td>CSS \u5909\u6570<\/td><td><code>huge<\/code><\/td><td>2rem (32px) \uff5e 3rem (48px)<\/td><td>H2<\/td><\/tr><tr><td>CSS \u5909\u6570<\/td><td><code>gigantic<\/code><\/td><td>2.5rem (40px) \uff5e 3.75rem (60px)<\/td><td>H1<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"settings\": {\n\t\t\"typography\": {\n\t\t\t\"fluid\": true,\n\t\t\t\"fontSizes\": &#91;\n\t\t\t\t{\n\t\t\t\t\t\"fluid\": {\n\t\t\t\t\t\t\"min\": \"0.875rem\",\n\t\t\t\t\t\t\"max\": \"1rem\"\n\t\t\t\t\t},\n\t\t\t\t\t\"size\": \"1rem\",\n\t\t\t\t\t\"slug\": \"small\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"fluid\": {\n\t\t\t\t\t\t\"min\": \"1rem\",\n\t\t\t\t\t\t\"max\": \"1.125rem\"\n\t\t\t\t\t},\n\t\t\t\t\t\"size\": \"1.125rem\",\n\t\t\t\t\t\"slug\": \"medium\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"fluid\": {\n\t\t\t\t\t\t\"min\": \"1.125rem\",\n\t\t\t\t\t\t\"max\": \"1.25rem\"\n\t\t\t\t\t},\n\t\t\t\t\t\"size\": \"1.25rem\",\n\t\t\t\t\t\"slug\": \"large\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"fluid\": {\n\t\t\t\t\t\t\"min\": \"1.25rem\",\n\t\t\t\t\t\t\"max\": \"1.5rem\"\n\t\t\t\t\t},\n\t\t\t\t\t\"size\": \"1.5rem\",\n\t\t\t\t\t\"slug\": \"x-large\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"fluid\": {\n\t\t\t\t\t\t\"min\": \"1.375rem\",\n\t\t\t\t\t\t\"max\": \"1.75rem\"\n\t\t\t\t\t},\n\t\t\t\t\t\"size\": \"1.75rem\",\n\t\t\t\t\t\"slug\": \"xx-large\"\n\t\t\t\t}\n\t\t\t]\n\t\t},\n\t\t\"custom\": {\n\t\t\t\"font-size\": {\n\t\t\t\t\"huge\": \"clamp(1.5rem, 2vw + 1rem, 2rem);\",\n\t\t\t\t\"gigantic\": \"clamp(1.75rem, 3vw + 1rem, 2.5rem);\"\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">CSS \u5909\u6570\u3067\u5b9a\u7fa9\u3059\u308b\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306b\u3064\u3044\u3066\u306f Fluid Typography \u306e\u6a5f\u80fd\u306f\u5229\u7528\u51fa\u6765\u307e\u305b\u3093\u306e\u3067\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u30b5\u30a4\u30c8\u3092\u4f7f\u7528\u3057\u3066\u3001\u9069\u5207\u306a <code>clamp<\/code> \u95a2\u6570\u3092\u751f\u6210\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/modern-fluid-typography.vercel.app\/\" target=\"_blank\" rel=\"noreferrer noopener\">Modern fluid typography editor<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/royalfig.github.io\/fluid-typography-calculator\/\" target=\"_blank\" rel=\"noreferrer noopener\">Fluid Typography Calculator<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u5168\u3066\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3092\u4eee\u306b\u9069\u7528\u3057\u305f\u5834\u5408\u3001\u753b\u9762\u5e45\u306b\u3088\u3063\u3066\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u4f38\u7e2e\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"591\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_18-840x591.gif\" alt=\"\u753b\u9762\u5e45\u306b\u3088\u3063\u3066\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u304c\u4f38\u7e2e\" class=\"wp-image-535\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_18-840x591.gif 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_18-768x540.gif 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_18.gif 1024w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u751f\u6210\u3055\u308c\u305f CSS \u5909\u6570\u304b\u3089\u3001\u30b5\u30a4\u30c8\u5168\u4f53\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u3068\u3001\u5404\u898b\u51fa\u3057\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u3092\u5b9a\u7fa9\u3057\u307e\u3059\u3002\u30b5\u30a4\u30c8\u5168\u4f53\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306f <code>medium<\/code> \u3068\u3057\u3001 <code>h4<\/code> \u304b\u3089 <code>h1<\/code> \u306b\u304b\u3051\u3066\u306f\u6bb5\u968e\u7684\u306b\u30b5\u30a4\u30ba\u3092\u5927\u304d\u304f\u3057\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"styles\": {\n\t\t\"typography\": {\n\t\t\t\"fontSize\": \"var(--wp--preset--font-size--medium)\"\n\t\t},\n\t\t\"elements\": {\n\t\t\t\"h1\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--custom--font-size--gigantic)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h2\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--font-size--huge)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h3\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--font-size--x-large)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h4\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--font-size--large)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h5\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--font-size--medium)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h6\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--font-size--medium)\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"454\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_19-840x454.png\" alt=\"\u751f\u6210\u3055\u308c\u305f CSS \u5909\u6570\u304b\u3089\u3001\u30b5\u30a4\u30c8\u5168\u4f53\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u3068\u3001\u5404\u898b\u51fa\u3057\u306e\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u3092\u5b9a\u7fa9\" class=\"wp-image-536\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_19-840x454.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_19-768x415.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_19.png 1152w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">line-height<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Twenty Twenty Three \u3067\u306f<a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentythree\/theme.json#L709\" target=\"_blank\" rel=\"noreferrer noopener\">\u5fc5\u8981\u306a\u30d7\u30ed\u30d1\u30c6\u30a3\u306b\u5024\u304c\u76f4\u66f8\u304d\u3055\u308c\u3066\u304a\u308a<\/a>\u3001Twenty Twenty Two \u3067\u306f <a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentytwo\/theme.json#L152\" target=\"_blank\" rel=\"noreferrer noopener\">CSS \u5909\u6570\u3092\u5b9a\u7fa9\u3057\u3066\u3044\u308b<\/a>\u3068\u3044\u3046\u9055\u3044\u304c\u3042\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u306f Twenty Twenty Two \u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u63a1\u7528\u3057\u3001\u30b5\u30a4\u30c8\u5168\u4f53\u306e\u5024\u3068\u3001\u5927\u304d\u3044\u898b\u51fa\u3057\u30ec\u30d9\u30eb\u5411\u3051\u306b\u5c11\u3057\u5c0f\u3055\u3044\u5024\u306e2\u3064\u3092 CSS \u5909\u6570\u3068\u3057\u3066\u5b9a\u7fa9\u3057\u3001\u9069\u7528\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"settings\": {\n\t\t\"custom\": {\n\t\t\t\"line-height\": {\n\t\t\t\t\"small\": 1.4,\n\t\t\t\t\"normal\": 1.6\n\t\t\t}\n\t\t}\n\t},\n\t\"styles\": {\n\t\t\"typography\": {\n\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--normal)\"\n\t\t},\n\t\t\"elements\": {\n\t\t\t\"h1\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--small)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h2\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--small)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h3\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--small)\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">\u30d5\u30a9\u30f3\u30c8\u30d5\u30a1\u30df\u30ea\u30fc<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u306f\u3001\u30b5\u30a4\u30c8\u5168\u4f53\u306e\u30d5\u30a9\u30f3\u30c8\u3092 <code>Noto Sans JP Regular<\/code> \u3068\u3057\u3001\u898b\u51fa\u3057\u7b49\u306e\u30d6\u30e9\u30a6\u30b6\u30c7\u30d5\u30a9\u30eb\u30c8\u3067 <code>font-weight: bold;<\/code> \u3067\u3042\u308b\u8981\u7d20\u306b\u306f <code>Noto Sans JP Bold<\/code> \u3092\u9069\u7528\u3057\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Google Fonts \u7b49\u306e\u30d7\u30ed\u30d0\u30a4\u30c0\u304c\u63d0\u4f9b\u3057\u3066\u3044\u308b\u30d5\u30a9\u30f3\u30c8\u306e URL \u3092\u76f4\u63a5\u6307\u5b9a\u3057\u3066\u3082\u826f\u3044\u306e\u3067\u3059\u304c\u3001<a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentythree\/theme.json#L120\" target=\"_blank\" rel=\"noreferrer noopener\">Twenty Twenty Three<\/a> \u3084 <a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentytwo\/theme.json#L188\" target=\"_blank\" rel=\"noreferrer noopener\">Twenty Twenty Two<\/a> \u304c\u884c\u3063\u3066\u3044\u308b\u3088\u3046\u306b\u3001\u30ed\u30fc\u30ab\u30eb\u3067\u30db\u30b9\u30c8\u3057\u305f\u3082\u306e\u3092\u8aad\u307f\u8fbc\u307f\u307e\u3059 (\u30ed\u30fc\u30ab\u30eb\u3067\u30db\u30b9\u30c8\u3059\u308b\u7406\u7531\u3068\u3057\u3066 GDPR \u306e\u554f\u984c\u3082\u3042\u308b\u3068\u601d\u3044\u307e\u3059\u304c\u3001\u73fe\u72b6\u3069\u306e\u3088\u3046\u306a\u7d50\u8ad6\u306b\u81f3\u3063\u3066\u3044\u308b\u306e\u304b\u306f\u79c1\u306f\u628a\u63e1\u51fa\u6765\u3066\u3044\u307e\u305b\u3093)\u3002\u3055\u3089\u306b\u5bb9\u91cf\u3092\u6e1b\u3089\u3059\u305f\u3081\u306b\u3001Kite \u3055\u3093 (<a href=\"https:\/\/twitter.com\/ixkaito\" target=\"_blank\" rel=\"noreferrer noopener\">@ixkaito<\/a>) \u304c\u516c\u958b\u3055\u308c\u3066\u3044\u308b\u300c<a href=\"https:\/\/github.com\/ixkaito\/NotoSansJP-subset\" target=\"_blank\" rel=\"noreferrer noopener\">Noto Sans JP \u30b5\u30d6\u30bb\u30c3\u30c8<\/a>\u300d\u304b\u3089\u3001\u5fc5\u8981\u306a\u30d5\u30a9\u30f3\u30c8\u30d5\u30a1\u30a4\u30eb\u3092\u30c6\u30fc\u30de\u306b\u30d0\u30f3\u30c9\u30eb\u3057\u3066\u8aad\u307f\u8fbc\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">FOIT\uff08Flash of Invisible Text\uff09\u3068 FOUT\uff08Flash of Unstyled Text\uff09\u306b\u3064\u3044\u3066\u3069\u306e\u3088\u3046\u306b\u5bfe\u51e6\u3059\u308b\u304b\u304c\u554f\u984c\u3067\u3059\u304c\u3001\u3053\u3053\u3067\u306f <a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentythree\/theme.json#L158\" target=\"_blank\" rel=\"noreferrer noopener\">Twenty Twenty Three<\/a> \u306b\u306a\u3089\u3044\u3001<code>font-display: block;<\/code> \u3068\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"settings\": {\n\t\t\"typography\": {\n\t\t\t\"fontFamilies\": &#91;\n\t\t\t\t{\n\t\t\t\t\t\"fontFace\": &#91;\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\"fontDisplay\": \"block\",\n\t\t\t\t\t\t\t\"fontFamily\": \"Noto Sans JP\",\n\t\t\t\t\t\t\t\"fontStretch\": \"normal\",\n\t\t\t\t\t\t\t\"fontStyle\": \"normal\",\n\t\t\t\t\t\t\t\"fontWeight\": \"400\",\n\t\t\t\t\t\t\t\"src\": &#91; \"file:.\/assets\/font\/NotoSansJP-Regular.woff2\" ]\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\"fontDisplay\": \"block\",\n\t\t\t\t\t\t\t\"fontFamily\": \"Noto Sans JP\",\n\t\t\t\t\t\t\t\"fontStretch\": \"normal\",\n\t\t\t\t\t\t\t\"fontStyle\": \"normal\",\n\t\t\t\t\t\t\t\"fontWeight\": \"700\",\n\t\t\t\t\t\t\t\"src\": &#91; \"file:.\/assets\/font\/NotoSansJP-Bold.woff2\" ]\n\t\t\t\t\t\t}\n\t\t\t\t\t],\n\t\t\t\t\t\"fontFamily\": \"Noto Sans JP\",\n\t\t\t\t\t\"name\": \"Noto Sans JP\",\n\t\t\t\t\t\"slug\": \"noto-sans-jp\"\n\t\t\t\t}\n\t\t\t]\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"594\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_20-840x594.png\" alt=\"\u30d5\u30a9\u30f3\u30c8\u30d5\u30a1\u30df\u30ea\u30fc\u306e\u9069\u7528\" class=\"wp-image-537\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_20-840x594.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_20-768x543.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_20.png 1028w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">\u30ab\u30e9\u30fc<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">\u30ab\u30e9\u30fc\u30d1\u30ec\u30c3\u30c8\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\"><a href=\"#font-size-variation\">\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3<\/a>\u3068\u540c\u69d8\u3001\u5fc5\u8981\u306a\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3092\u4ee5\u4e0b2\u3064\u306e\u30ec\u30a4\u30e4\u30fc\u306b\u5206\u985e\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u8a2d\u5b9a\u51fa\u6765\u308b\u3079\u304d\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3<\/li>\n\n\n\n<li>\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u8a2d\u5b9a\u51fa\u6765\u306a\u304f\u3066\u3082\u3088\u3044\u304c\u3001\u30c7\u30b6\u30a4\u30f3\u4e0a\u5fc5\u8981\u306a\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u306f1\u3064\u76ee\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3068\u3057\u3066\u3001Twenty Twenty Three \u306e1\u3064\u306e\u30b0\u30ed\u30fc\u30d0\u30eb\u30b9\u30bf\u30a4\u30eb (<a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentythree\/styles\/marigold.json#L7\">Marigold<\/a>) \u306e\u5b9a\u7fa9\u3092\u305d\u306e\u307e\u307e\u4f7f\u7528\u3057\u307e\u3059\u3002CSS \u5909\u6570\u3068\u3057\u3066\u5b9a\u7fa9\u3059\u308b\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u306f\u3001\u30da\u30fc\u30b8\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u4e0a\u306e\u30dc\u30fc\u30c0\u30fc\u30fb\u80cc\u666f\u7b49\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u306e\u305f\u3081\u306b3\u7a2e\u985e\u306e\u30b0\u30ec\u30fc\u30ab\u30e9\u30fc\u304c\u5fc5\u8981\u3067\u3042\u308b\u3068\u3057\u3066\u3001\u305d\u308c\u3089\u3092\u5b9a\u7fa9\u3057\u307e\u3059\u3002\u307e\u305f\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u30d1\u30ec\u30c3\u30c8\u306f\u30b3\u30f3\u30c6\u30f3\u30c4\u4f5c\u6210\u6642\u306b\u4f7f\u7528\u3059\u308b\u4e8b\u304c\u306a\u3044\u3068\u3057\u3001\u30aa\u30d7\u30c8\u30a2\u30a6\u30c8\u3057\u307e\u3059\u3002\u305d\u3057\u3066\u3001\u5b9a\u7fa9\u3057\u305f\u30ab\u30e9\u30fc\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u306e\u3046\u30612\u3064\u3092\u3001\u30eb\u30fc\u30c8\u30ec\u30d9\u30eb\u306e\u30c6\u30ad\u30b9\u30c8\u30ab\u30e9\u30fc\u30fb\u80cc\u666f\u8272\u306b\u6307\u5b9a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"settings\": {\n\t\t\"color\": {\n\t\t\t\"defaultPalette\": false,\n\t\t\t\"palette\": &#91;\n\t\t\t\t{\n\t\t\t\t\t\"color\": \"#F6F2EC\",\n\t\t\t\t\t\"name\": \"Base\",\n\t\t\t\t\t\"slug\": \"base\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"color\": \"#21251F\",\n\t\t\t\t\t\"name\": \"Contrast\",\n\t\t\t\t\t\"slug\": \"contrast\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"color\": \"#5B4460\",\n\t\t\t\t\t\"name\": \"Primary\",\n\t\t\t\t\t\"slug\": \"primary\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"color\": \"#FCC263\",\n\t\t\t\t\t\"name\": \"Secondary\",\n\t\t\t\t\t\"slug\": \"secondary\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"color\": \"#E7A1A9\",\n\t\t\t\t\t\"name\": \"Tertiary\",\n\t\t\t\t\t\"slug\": \"tertiary\"\n\t\t\t\t}\n\t\t\t]\n\t\t},\n\t\t\"custom\": {\n\t\t\t\"color\": {\n\t\t\t\t\"gray-light\": \"#cccccc\",\n\t\t\t\t\"gray\": \"#999999\",\n\t\t\t\t\"gray-dark\": \"#666666\"\n\t\t\t}\n\t\t}\n    },\n\t\"styles\": {\n\t\t\"color\": {\n\t\t\t\"background\": \"var(--wp--preset--color--base)\",\n\t\t\t\"text\": \"var(--wp--preset--color--contrast)\"\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u306e\u30ab\u30e9\u30fc\u30d1\u30ec\u30c3\u30c8\u306f\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u5909\u308f\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"602\" height=\"316\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_21.png\" alt=\"\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u306e\u30ab\u30e9\u30fc\u30d1\u30ec\u30c3\u30c8\u306e\u5909\u5316\" class=\"wp-image-538\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u306b\u52a0\u3048\u3066\u3001\u5fc5\u8981\u306b\u5fdc\u3058\u3066\u30b0\u30e9\u30c7\u30fc\u30b7\u30e7\u30f3\u30d1\u30ec\u30c3\u30c8\u3084\u30c7\u30e5\u30aa\u30c8\u30fc\u30f3\u30d1\u30ec\u30c3\u30c8\u3092\u5b9a\u7fa9\u3057\u307e\u3059\u3002<a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentytwo\/theme.json#L69\" target=\"_blank\" rel=\"noreferrer noopener\">Twenty Twenty Two<\/a> \u304c\u884c\u3063\u3066\u3044\u308b\u3088\u3046\u306b\u3001\u30ab\u30e9\u30fc\u30d1\u30ec\u30c3\u30c8\u306e\u5b9a\u7fa9\u304b\u3089\u751f\u6210\u3055\u308c\u305f CSS \u5909\u6570\u306e\u7d44\u307f\u5408\u308f\u305b\u3092\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3068\u3057\u3066\u7528\u610f\u3059\u308b\u306e\u3082\u826f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u30b9\u30da\u30fc\u30b7\u30f3\u30b0\u30d7\u30ea\u30bb\u30c3\u30c8<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u8a00\u3046\u300c\u30b9\u30da\u30fc\u30b7\u30f3\u30b0\u300d\u3068\u306f\u3001\u30d1\u30c7\u30a3\u30f3\u30b0\u30fb\u30de\u30fc\u30b8\u30f3\u30fb\u30d6\u30ed\u30c3\u30af\u30ae\u30e3\u30c3\u30d7\u306e3\u3064\u306e\u4e8b\u3092\u6307\u3057\u307e\u3059\u3002<code>theme.json<\/code> \u3067\u3044\u305a\u308c\u304b\u306e\u30b5\u30dd\u30fc\u30c8\u3092\u30aa\u30d7\u30c8\u30a4\u30f3\u3057\u3066\u3044\u308b\u5834\u5408\u3001\u305d\u306e\u30b5\u30dd\u30fc\u30c8\u306b\u5bfe\u5fdc\u3057\u305f\u30d6\u30ed\u30c3\u30af\u306e\u30b5\u30a4\u30c9\u30d0\u30fc\u306b UI \u304c\u8868\u793a\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"282\" height=\"341\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_22.png\" alt=\"\u30b5\u30a4\u30c9\u30d0\u30fcUI\" class=\"wp-image-539\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">WordPress 6.0\u307e\u3067\u306f\u6570\u5024\u3092\u76f4\u63a5\u5165\u529b\u51fa\u6765\u308b\u3060\u3051\u3067\u3057\u305f\u304c\u3001WordPress6.1\u304b\u3089\u306f\u3001\u4e0a\u8a18\u306e\u3088\u3046\u306b\u76ee\u76db\u308a\u4ed8\u304d\u306e\u30b9\u30e9\u30a4\u30c0\u30fc\u3068\u3057\u3066\u8868\u793a\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/10\/07\/introduction-of-presets-across-padding-margin-and-block-gap\/\" target=\"_blank\" rel=\"noreferrer noopener\">Introduction of presets across padding, margin and block gap \u2013 Make WordPress Core<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><code>theme.json<\/code> \u3067\u3053\u306e\u30d7\u30ea\u30bb\u30c3\u30c8\u3092\u5b9a\u7fa9\u3057\u3066\u3044\u306a\u3044\u5834\u5408\u3001\u30bc\u30ed\u5024\u3092\u9664\u3044\u3066\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u3067\u306f\u4ee5\u4e0b7\u3064\u306e\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u304c CSS \u5909\u6570\u3068\u3057\u3066\u51fa\u529b\u3055\u308c\u3001\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u64cd\u4f5c\u3057\u305f\u6642\u306b\u5bfe\u5fdc\u3059\u308b CSS \u5909\u6570\u306e\u5024\u304c\u30b9\u30bf\u30a4\u30eb\u3068\u3057\u3066\u51fa\u529b\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><code>--wp--preset--spacing--20: 0.44rem;<\/code><\/li>\n\n\n\n<li><code>--wp--preset--spacing--30: 0.67rem;<\/code><\/li>\n\n\n\n<li><code>--wp--preset--spacing--40: 1rem;<\/code><\/li>\n\n\n\n<li><code>--wp--preset--spacing--50: 1.5rem;<\/code><\/li>\n\n\n\n<li><code>--wp--preset--spacing--60: 2.25rem;<\/code><\/li>\n\n\n\n<li><code>--wp--preset--spacing--70: 3.38rem;<\/code><\/li>\n\n\n\n<li><code>--wp--preset--spacing--80: 5.06rem;<\/code><\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u6570\u304c<strong>8\u4ee5\u4e0a<\/strong>\u306e\u6642\u306f\u3001\u30b9\u30e9\u30a4\u30c0\u30fc\u5f62\u5f0f\u3067\u306f\u306a\u304f\u30d7\u30eb\u30c0\u30a6\u30f3\u3068\u3057\u3066\u8868\u793a\u3055\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f8b\u3048\u3070\u3001\u30c6\u30fc\u30de\u3067\u4f59\u767d\u306e\u53d6\u308a\u65b9\u3092 <code>0.5rem<\/code> \u306e\u500d\u6570\u3067\u7d71\u4e00\u3057\u305f\u3044\u306e\u3067\u3001 <code>0.5rem<\/code> \u306f\u3058\u307e\u308a\u3001<code>0.5rem<\/code> \u523b\u307f\u3067\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3092\u5b9a\u7fa9\u3059\u308b\u3068\u3057\u307e\u3059\u3002\u3053\u306e\u30b9\u30e9\u30a4\u30c0\u30fc UI \u3092\u6d3b\u304b\u3057\u305f\u3044\u3068\u3057\u305f\u5834\u5408\u3001\u8a2d\u5b9a\u51fa\u6765\u308b\u6700\u5927\u6570\u306f7\u3064\u307e\u3067\u306a\u306e\u3067\u3001<code>0.5rem<\/code> \uff5e <code>3.5rem<\/code> \u307e\u3067\u306e\u7bc4\u56f2\u3092\u30b9\u30e9\u30a4\u30c0\u30fc\u3067\u30ab\u30d0\u30fc\u51fa\u6765\u308b\u4e8b\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u3088\u3046\u306b\u3001<strong>\u30c6\u30fc\u30de\u306e\u4f59\u767d\u30eb\u30fc\u30eb\u306b\u3042\u308f\u305b\u305f\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3092\u5b9a\u7fa9\u3059\u308b<\/strong>\u4e8b\u3067\u3001\u308f\u3056\u308f\u3056\u6570\u5024\u3092\u624b\u5165\u529b\u3057\u306a\u304f\u3066\u3082\u3001\u30de\u30a6\u30b9\u7b49\u3067\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u64cd\u4f5c\u3059\u308b\u3060\u3051\u3067\u3001\u30eb\u30fc\u30eb\u306b\u3042\u3063\u305f\u4f59\u767d\u3092\u9069\u7528\u3059\u308b\u4e8b\u304c\u51fa\u6765\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3067\u3059\u304c\u3001\u30b9\u30e9\u30a4\u30c0\u30fc\u3067\u540c\u3058\u5024\u3092\u9069\u7528\u3057\u305f\u3068\u3057\u3066\u3082\u3001\u30e2\u30d0\u30a4\u30eb\u30ec\u30a4\u30a2\u30a6\u30c8\u3067\u306f\u3088\u308a\u5c0f\u3055\u3044\u5024\u3092\u9069\u7528\u3057\u305f\u3044\u3001\u3068\u3044\u3046\u30b1\u30fc\u30b9\u304c\u8003\u3048\u3089\u308c\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u306f\u3082\u3046\u4e00\u6b69\u9032\u3093\u3067\u3001\u300c\u5024\u306b\u306f\u3001\u56fa\u5b9a\u5024\u3060\u3051\u3067\u306a\u304f <code>clamp<\/code> \u95a2\u6570\u306a\u3069\u3082\u4f7f\u7528\u51fa\u6765\u308b\u300d\u3068\u3044\u3046\u4ed5\u69d8\u3092\u6d3b\u304b\u3057\u3066\u3001\u753b\u9762\u5e45\u306b\u3088\u3063\u3066\u4f38\u7e2e\u3059\u308b\u300c<strong>\u30ec\u30b9\u30dd\u30f3\u30b7\u30d6\u30b9\u30da\u30fc\u30b7\u30f3\u30b0<\/strong>\u300d\u3068\u3057\u3066\u5b9a\u7fa9\u3057\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u306f\u3001<a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentythree\/theme.json#L69\" target=\"_blank\" rel=\"noreferrer noopener\">Twenty Twenty Three<\/a> \u3067\u3082\u898b\u308b\u4e8b\u304c\u51fa\u6765\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f38\u7e2e\u7387\u3092\u3069\u3046\u8a2d\u5b9a\u3059\u308b\u304b\u306f\u305d\u306e\u30c6\u30fc\u30de\u306e\u8a2d\u8a08\u306b\u3088\u308a\u307e\u3059\u304c\u3001\u3053\u3053\u3067\u306f\u5358\u7d14\u306b\u3001\u300c\u30c7\u30b9\u30af\u30c8\u30c3\u30d7\u30ec\u30a4\u30a2\u30a6\u30c8\u306b\u5bfe\u3057\u3066\u3001\u30e2\u30d0\u30a4\u30eb\u30ec\u30a4\u30a2\u30a6\u30c8\u3067\u306f\u534a\u5206\u306e\u30b5\u30a4\u30ba\u306b\u3059\u308b\u300d\u3068\u3044\u3046\u30eb\u30fc\u30eb\u3092\u63a1\u7528\u3057\u307e\u3059\u3002\u305d\u3057\u3066\u3001\u3088\u308a\u5e83\u3044\u7bc4\u56f2\u3092\u30b9\u30e9\u30a4\u30c0\u30fc\u3067\u30ab\u30d0\u30fc\u3067\u304d\u308b\u3088\u3046\u306b\u3059\u308b\u305f\u3081\u306b\u3001\u4ee5\u4e0b\u306e2\u3064\u306e\u30eb\u30fc\u30eb\u3092\u52a0\u3048\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>0.5rem<\/code> \u306f\u30e2\u30d0\u30a4\u30eb\u3067\u534a\u5206\u306b\u306a\u3089\u306a\u304f\u3066\u3082\u3088\u3044\u305f\u3081\u3001\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u304b\u3089\u9664\u5916\u3059\u308b (\u30b9\u30e9\u30a4\u30c0\u30fc\u3092\u4f7f\u308f\u305a\u6570\u5024\u3092\u624b\u5165\u529b\u3059\u308b)<\/li>\n\n\n\n<li>\u5024\u304c\u5927\u304d\u304f\u306a\u308b\u306b\u3064\u308c\u3001\u523b\u3080\u5024\u3082\u5927\u304d\u304f\u3057\u3066\u3044\u304f<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u4ee5\u4e0a\u306e\u30eb\u30fc\u30eb\u304b\u3089\u751f\u6210\u3055\u308c\u308b\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u306e\u4e00\u4f8b\u306f\u3001\u4ee5\u4e0b\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li><code>1rem<\/code><\/li>\n\n\n\n<li><code>1.5rem<\/code><\/li>\n\n\n\n<li><code>2rem<\/code><\/li>\n\n\n\n<li><code>3rem<\/code><\/li>\n\n\n\n<li><code>4rem<\/code><\/li>\n\n\n\n<li><code>6rem<\/code><\/li>\n\n\n\n<li><code>8rem<\/code><\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u5024\u3092 <code>clamp<\/code> \u95a2\u6570\u3067\u534a\u5206\u306b\u3059\u308b\u305f\u3081\u306b\u3001\u4eca\u56de\u306f <a href=\"https:\/\/royalfig.github.io\/fluid-typography-calculator\/\" target=\"_blank\" rel=\"noreferrer noopener\">Fluid Typography Calculator<\/a> \u3092\u4f7f\u3044\u3001Min Viewport \u306f <code>375px<\/code>\u3001Max Viewport \u306f <code>960px<\/code> \u3068\u3057\u3066\u5024\u3092\u751f\u6210\u3057\u307e\u3057\u305f\u3002\u6700\u7d42\u7684\u306b\u3001<code>theme.json<\/code> \u3067\u306e\u5b9a\u7fa9\u306f\u4ee5\u4e0b\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"settings\": {\n\t\t\"spacing\": {\n\t\t\t\"spacingScale\": {\n\t\t\t\t\"steps\": 0\n\t\t\t},\n\t\t\t\"spacingSizes\": &#91;\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(0.5rem, 0.2727272727272727rem + 0.9696969696969697vw, 1rem)\",\n\t\t\t\t\t\"slug\": \"20\",\n\t\t\t\t\t\"name\": \"2\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(0.75rem, 0.4090909090909091rem + 1.4545454545454546vw, 1.5rem)\",\n\t\t\t\t\t\"slug\": \"30\",\n\t\t\t\t\t\"name\": \"3\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(1rem, 0.5454545454545454rem + 1.9393939393939394vw, 2rem)\",\n\t\t\t\t\t\"slug\": \"40\",\n\t\t\t\t\t\"name\": \"4\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(1.5rem, 0.8181818181818182rem + 2.909090909090909vw, 3rem)\",\n\t\t\t\t\t\"slug\": \"50\",\n\t\t\t\t\t\"name\": \"5\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(2rem, 1.0909090909090908rem + 3.878787878787879vw, 4rem)\",\n\t\t\t\t\t\"slug\": \"60\",\n\t\t\t\t\t\"name\": \"6\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(3rem, 1.6363636363636365rem + 5.818181818181818vw, 6rem)\",\n\t\t\t\t\t\"slug\": \"70\",\n\t\t\t\t\t\"name\": \"7\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(4rem, 2.1818181818181817rem + 7.757575757575758vw, 8rem)\",\n\t\t\t\t\t\"slug\": \"80\",\n\t\t\t\t\t\"name\": \"8\"\n\t\t\t\t}\n\t\t\t]\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u6298\u8fd4\u3057\u3092\u7121\u52b9\u306b\u3057\u305f\u30ab\u30e9\u30e0\u30d6\u30ed\u30c3\u30af\u306e\u30ae\u30e3\u30c3\u30d7\u306b\u3001\u4e0a\u8a18\u30b9\u30da\u30fc\u30b7\u30f3\u30b0\u30d7\u30ea\u30bb\u30c3\u30c8\u3092\u305d\u308c\u305e\u308c\u9069\u7528\u3057\u305f\u5834\u5408\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u753b\u9762\u5e45\u306b\u3088\u308a\u4f59\u767d\u304c\u4f38\u7e2e\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"586\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_23-840x586.gif\" alt=\"\u753b\u9762\u5e45\u306b\u3088\u308a\u4f59\u767d\u304c\u4f38\u7e2e\" class=\"wp-image-540\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_23-840x586.gif 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_23-768x536.gif 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_23.gif 1032w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><code>settings.spacing.spacingScale.steps<\/code> \u3092\u30bc\u30ed\u306b\u3057\u3066\u3044\u308b\u306e\u306f\u3001<code>spacingSizes<\/code> \u3067\u5b9a\u7fa9\u3057\u3066\u3044\u308b\u4ee5\u5916\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u306e CSS \u5909\u6570 (<code>--wp--preset--spacing--{20~80}<\/code>) \u3092\u51fa\u529b\u3055\u305b\u306a\u3044\u305f\u3081\u3067\u3059 (\u4e0a\u8a18\u306e\u5b9a\u7fa9\u306e\u5834\u5408\u306f\u3001\u5168\u3066\u306e\u30c7\u30d5\u30a9\u30eb\u30c8 CSS \u5909\u65707\u3064\u3092\u540c\u3058\u30b9\u30e9\u30c3\u30b0\u3067\u4e0a\u66f8\u304d\u3057\u3066\u3044\u308b\u306e\u3067\u554f\u984c\u3042\u308a\u307e\u305b\u3093) \u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4eca\u56de\u5b9a\u7fa9\u3057\u305f\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u306f\u3042\u304f\u307e\u3067\u4e00\u4f8b\u3067\u3059\u304c\u3001\u30c7\u30b6\u30a4\u30f3\u30eb\u30fc\u30eb\u306b\u3042\u308f\u305b\u3066\u3001\u523b\u307f\u65b9\u3092\u5909\u3048\u308b\u30fb\u4f38\u7e2e\u7387\u3092\u5909\u3048\u308b\u306a\u3069\u3001\u69d8\u3005\u306a\u8a2d\u8a08\u304c\u8003\u3048\u3089\u308c\u308b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u8981\u7d20\u30ec\u30d9\u30eb\u30fb\u30d6\u30ed\u30c3\u30af\u30ec\u30d9\u30eb\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u307e\u3067\u3067\u3001\u4e3b\u306b\u30b5\u30a4\u30c8\u5168\u4f53\u306e\u8a2d\u8a08\u3068\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u3092\u884c\u3044\u307e\u3057\u305f\u304c\u3001\u3053\u306e\u30bb\u30af\u30b7\u30e7\u30f3\u3067\u306f\u3001\u8981\u7d20\u30ec\u30d9\u30eb\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u4f8b\u3068\u3057\u3066\u30ea\u30f3\u30af\u8981\u7d20\u3092\u3001\u30d6\u30ed\u30c3\u30af\u30ec\u30d9\u30eb\u3067\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u4f8b\u3068\u3057\u3066\u898b\u51fa\u3057\u30d6\u30ed\u30c3\u30af\u30fb\u30dc\u30bf\u30f3\u30d6\u30ed\u30c3\u30af\u3092\u6319\u3052\u3066\u307f\u305f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u30ea\u30f3\u30af\u8981\u7d20\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u306f\u3001\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30c6\u30ad\u30b9\u30c8\u30ab\u30e9\u30fc\u306e\u307f\u5909\u66f4\u3057\u3066\u3044\u307e\u3059\u304c\u3001<a href=\"https:\/\/core.trac.wordpress.org\/browser\/tags\/6.1.1\/src\/wp-content\/themes\/twentytwentythree\/theme.json#L674\" target=\"_blank\" rel=\"noreferrer noopener\">Twenty Twenty Three<\/a> \u306e\u3088\u3046\u306b\u3001<a href=\"https:\/\/make.wordpress.org\/core\/2022\/10\/10\/styling-elements-in-block-themes\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u7591\u4f3c\u30af\u30e9\u30b9<\/a>\u306b\u3082\u30b9\u30bf\u30a4\u30eb\u3092\u5f53\u3066\u3066\u3082\u826f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"styles\": {\n\t\t\"elements\": {\n\t\t\t\"link\": {\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"text\": \"var(--wp--preset--color--secondary)\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"309\" height=\"179\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_24.png\" alt=\"\u30ea\u30f3\u30af\u8981\u7d20\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\" class=\"wp-image-541\"\/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u306a\u304a\u3053\u306e\u8981\u7d20\u30b9\u30bf\u30a4\u30eb\u306f\u3001<strong>\u30b3\u30f3\u30c6\u30f3\u30c4\u5916\u306e\u30ea\u30f3\u30af\u8981\u7d20\u306b\u3082\u9069\u7528\u3055\u308c\u308b<\/strong>\u305f\u3081\u3001\u305d\u308c\u3089\u306b\u3064\u3044\u3066\u306f\u5fc5\u8981\u306b\u5fdc\u3058\u3066 CSS \u3067\u4e0a\u66f8\u304d\u3057\u3066\u3044\u304d\u307e\u3059 (\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u3067\u3042\u308c\u3070\u3001\u30da\u30fc\u30b8\u306f\u5168\u3066\u30d6\u30ed\u30c3\u30af\u3067\u69cb\u6210\u3055\u308c\u3066\u3044\u308b\u305f\u3081\u3001<code>theme.json<\/code> \u3060\u3051\u3067\u4e0a\u66f8\u304d\u51fa\u6765\u307e\u3059)\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u898b\u51fa\u3057\u30d6\u30ed\u30c3\u30af\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u898b\u51fa\u3057\u30d6\u30ed\u30c3\u30af\u306b\u306f\u3001\u898b\u51fa\u3057\u30ec\u30d9\u30eb\u306b\u5fdc\u3058\u305f\u30d5\u30a9\u30f3\u30c8\u30b5\u30a4\u30ba\u306f\u65e2\u306b\u9069\u7528\u3055\u308c\u3066\u3044\u307e\u3059\u304c\u3001\u305d\u308c\u4ee5\u5916\u306e\u30b9\u30bf\u30a4\u30eb\u3092\u52a0\u3048\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u3059\u308b\u898b\u51fa\u3057\u306f <code>h2<\/code> \/ <code>h3<\/code> \/ <code>h4<\/code> \u3068\u3057\u3001\u305d\u308c\u305e\u308c\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u65b9\u91dd\u3092\u53d6\u3063\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>h2<\/code>: \u80cc\u666f\u8272\u3092\u30d7\u30e9\u30a4\u30de\u30ea\u30ab\u30e9\u30fc\u3068\u3057\u3066\u6301\u3061\u3001\u30c6\u30ad\u30b9\u30c8\u30ab\u30e9\u30fc\u3092\u30d9\u30fc\u30b9\u30ab\u30e9\u30fc\u306b\u3059\u308b<\/li>\n\n\n\n<li><code>h3<\/code>: \u30d7\u30e9\u30a4\u30de\u30ea\u30ab\u30e9\u30fc\u3067\u4e0b\u30dc\u30fc\u30c0\u30fc\u3092\u5f15\u304f<\/li>\n\n\n\n<li><code>h4<\/code>: \u30c6\u30ad\u30b9\u30c8\u30ab\u30e9\u30fc\u306b\u30d7\u30e9\u30a4\u30de\u30ea\u30ab\u30e9\u30fc\u3092\u9069\u7528\u3059\u308b<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u5168\u3066\u306e\u30ab\u30e9\u30fc\u306e\u5024\u306b\u306f\u3001\u3053\u308c\u307e\u3067\u306e <code>theme.json<\/code> \u4e0a\u3067\u306e\u5b9a\u7fa9\u304b\u3089\u51fa\u529b\u3055\u308c\u305f CSS \u5909\u6570\u3092\u4f7f\u7528\u3057\u307e\u3059\u3002\u30d1\u30c7\u30a3\u30f3\u30b0\u306b\u306f\u3001\u300c<a href=\"#%E3%82%B9%E3%83%9A%E3%83%BC%E3%82%B7%E3%83%B3%E3%82%B0%E3%83%97%E3%83%AA%E3%82%BB%E3%83%83%E3%83%88\" target=\"_blank\" rel=\"noreferrer noopener\">\u30b9\u30da\u30fc\u30b7\u30f3\u30b0\u30d7\u30ea\u30bb\u30c3\u30c8<\/a>\u300d\u306e\u5b9a\u7fa9\u304b\u3089\u51fa\u529b\u3055\u308c\u305f CSS \u5909\u6570\u3092\u4f7f\u3063\u3066\u3082\u826f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"styles\": {\n\t\t\"elements\": {\n\t\t\t\"h2\": {\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"text\": \"var(--wp--preset--color--base)\",\n\t\t\t\t\t\"background\": \"var(--wp--preset--color--primary)\"\n\t\t\t\t},\n\t\t\t\t\"spacing\": {\n\t\t\t\t\t\"padding\": {\n\t\t\t\t\t\t\"left\": \"0.5em\",\n\t\t\t\t\t\t\"right\": \"0.5em\",\n\t\t\t\t\t\t\"top\": \"0.25em\",\n\t\t\t\t\t\t\"bottom\": \"0.25em\"\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h3\": {\n\t\t\t\t\"border\": {\n\t\t\t\t\t\"bottom\": {\n\t\t\t\t\t\t\"color\": \"var(--wp--preset--color--primary)\",\n\t\t\t\t\t\t\"width\": \"4px\",\n\t\t\t\t\t\t\"style\": \"solid\"\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t\"spacing\": {\n\t\t\t\t\t\"padding\": {\n\t\t\t\t\t\t\"bottom\": \"0.25em\"\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h4\": {\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"text\": \"var(--wp--preset--color--primary)\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"603\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_25-840x603.png\" alt=\"\u898b\u51fa\u3057\u30d6\u30ed\u30c3\u30af\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\" class=\"wp-image-542\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_25-840x603.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_25-768x551.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_25.png 1084w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">\u30dc\u30bf\u30f3\u30d6\u30ed\u30c3\u30af\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a2\u30d7\u30ed\u30fc\u30c1\u306f\u898b\u51fa\u3057\u30d6\u30ed\u30c3\u30af\u3068\u540c\u3058\u3067\u3059\u304c\u3001WordPress6.1 \u304b\u3089\u5c0e\u5165\u3055\u308c\u305f<a href=\"https:\/\/make.wordpress.org\/core\/2022\/10\/10\/styling-elements-in-block-themes\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u7591\u4f3c\u30af\u30e9\u30b9<\/a>\u3068<a href=\"https:\/\/make.wordpress.org\/core\/2022\/09\/16\/whats-new-in-gutenberg-14-1-15-september\/#improving-theme-developer-experience\" target=\"_blank\" rel=\"noreferrer noopener\">\u30b7\u30e3\u30c9\u30a6<\/a>\u3082\u9069\u7528\u3057\u3066\u307f\u307e\u3059\u3002\u3055\u3089\u306b\u3001\u30dc\u30bf\u30f3\u9593\u306e\u4f59\u767d\u3092 <code>blockGap<\/code> \u3067\u5c11\u3057\u72ed\u3081\u3066\u307f\u307e\u3059\u3002\u30ea\u30f3\u30af\u8981\u7d20\u3068\u540c\u69d8\u306b\u3001\u7591\u4f3c\u30af\u30e9\u30b9\u3054\u3068\u306e\u30b9\u30bf\u30a4\u30eb\u3092\u5f53\u3066\u3066\u3082\u826f\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"styles\": {\n\t\t\"blocks\": {\n\t\t\t\"core\/buttons\": {\n\t\t\t\t\"spacing\": {\n\t\t\t\t\t\"blockGap\": \"1rem\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"core\/button\": {\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"text\": \"var(--wp--preset--color--contrast)\",\n\t\t\t\t\t\"background\": \"var(--wp--preset--color--tertiary)\"\n\t\t\t\t},\n\t\t\t\t\"border\": {\n\t\t\t\t\t\"radius\": \"8px\"\n\t\t\t\t},\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--small)\"\n\t\t\t\t},\n\t\t\t\t\"shadow\": \"2px 2px 4px var(--wp--preset--color--primary)\"\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"404\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_26-840x404.png\" alt=\"\u30dc\u30bf\u30f3\u30d6\u30ed\u30c3\u30af\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\" class=\"wp-image-543\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_26-840x404.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_26-768x370.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_26.png 1033w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\">\u30bb\u30ec\u30af\u30bf\u306e\u30cd\u30b9\u30c8<\/h4>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f8b\u3048\u3070\u3001\u300c\u7279\u5b9a\u306e\u30d6\u30ed\u30c3\u30af (\u8981\u7d20) \u306e\u4e2d\u306e\u7279\u5b9a\u306e\u30d6\u30ed\u30c3\u30af (\u8981\u7d20) \u306b\u30b9\u30bf\u30a4\u30eb\u3092\u5f53\u3066\u305f\u3044\u300d\u3068\u3044\u3046\u30b1\u30fc\u30b9\u3067\u3059\u304c\u3001\u8003\u3048\u3089\u308c\u308b4\u3064\u306e\u7d44\u307f\u5408\u308f\u305b\u306e\u3046\u3061\u3001\u5229\u7528\u3067\u304d\u308b\u306e\u306f <strong>\u300c\u30d6\u30ed\u30c3\u30af &gt; \u8981\u7d20\u300d\u306e\u30cd\u30b9\u30c8\u306e\u307f<\/strong>\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">(\u53ef) \u30b0\u30eb\u30fc\u30d7\u30d6\u30ed\u30c3\u30af\u306e\u4e2d\u306e\u30ea\u30f3\u30af\u8981\u7d20\u306b\u30b9\u30bf\u30a4\u30eb\u3092\u5f53\u3066\u308b:<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"styles\": {\n\t\t\"blocks\": {\n\t\t\t\"core\/group\": {\n\t\t\t\t\"elements\": {\n\t\t\t\t\t\"link\": {}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">(\u4e0d\u53ef) \u7279\u5b9a\u306e\u30d6\u30ed\u30c3\u30af\u306e\u4e2d\u306e\u7279\u5b9a\u306e\u30d6\u30ed\u30c3\u30af\u306b\u30b9\u30bf\u30a4\u30eb\u3092\u5f53\u3066\u308b:<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"styles\": {\n\t\t\"blocks\": {\n\t\t\t\"core\/group\": {\n\t\t\t\t\"blocks\": {\n\t\t\t\t\t\"core\/paragraph\": {}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">(\u4e0d\u53ef) \u7279\u5b9a\u306e\u8981\u7d20\u306e\u4e2d\u306e\u7279\u5b9a\u306e\u8981\u7d20\u306b\u30b9\u30bf\u30a4\u30eb\u3092\u5f53\u3066\u308b:<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"styles\": {\n\t\t\"elements\": {\n\t\t\t\"heading\": {\n\t\t\t\t\"elements\": {\n\t\t\t\t\t\"link\": {}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">(\u4e0d\u53ef) \u7279\u5b9a\u306e\u8981\u7d20\u306e\u4e2d\u306e\u7279\u5b9a\u306e\u30d6\u30ed\u30c3\u30af\u306b\u30b9\u30bf\u30a4\u30eb\u3092\u5f53\u3066\u308b (\u3053\u306e\u9806\u756a\u306e\u30cd\u30b9\u30c8\u304c\u5fc5\u8981\u306a\u30b1\u30fc\u30b9\u306f\u7121\u3044\u306f\u305a\u3067\u3059\u304c):<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"styles\": {\n\t\t\"elements\": {\n\t\t\t\"link\": {\n\t\t\t\t\"blocks\": {\n\t\t\t\t\t\"core\/paragraph\": {}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">\u8ffd\u52a0\u30a2\u30d7\u30ed\u30fc\u30c1<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u307e\u3067\u306f\u3001<code>theme.json<\/code> \u3092\u4e2d\u5fc3\u3068\u3057\u305f\u30b3\u30f3\u30c6\u30f3\u30c4\u30a8\u30ea\u30a2\u306e\u8a2d\u8a08\u306e\u8a71\u304c\u30e1\u30a4\u30f3\u3067\u3057\u305f\u304c\u3001\u3053\u306e\u30bb\u30af\u30b7\u30e7\u30f3\u3067\u306f\u3001\u3082\u3046\u5c11\u3057\u8e0f\u307f\u8fbc\u3093\u3060\u3044\u304f\u3064\u304b\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u7d39\u4ecb\u3057\u307e\u3059\u3002\u3044\u304f\u3064\u304b\u306e\u9805\u76ee\u306f\u3001<code>theme.json<\/code> \u3092\u6301\u305f\u306a\u3044\u5f93\u6765\u306e\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u958b\u767a\u3067\u3082\u65e2\u306b\u884c\u308f\u308c\u3066\u3044\u305f\u308a\u3001\u5fdc\u7528\u51fa\u6765\u308b\u3082\u306e\u3060\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">box-sizing \u306e\u9069\u7528<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u30fb\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u5074\u3068\u3082\u3001\u30d6\u30ed\u30c3\u30af\u306e <code>box-sizing<\/code> \u306f\u6307\u5b9a\u3055\u308c\u3066\u3044\u306a\u3044 (\uff1d\u521d\u671f\u5024\u306e <code>content-box<\/code>) \u305f\u3081\u3001 <code>padding<\/code> \u3084 <code>border<\/code> \u3092\u6301\u3064\u30d6\u30ed\u30c3\u30af\u306e\u5834\u5408\u3001\u8981\u7d20\u306e\u5e45\u304c\u4ed6\u306e\u30d6\u30ed\u30c3\u30af\u3068\u63c3\u3044\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"540\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_27-840x540.png\" alt=\"box-sizing \u306e\u9069\u7528\" class=\"wp-image-544\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_27-840x540.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_27-768x494.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_27.png 1263w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u306f\u610f\u56f3\u7684\u306a\u3082\u306e\u3067\u3042\u308a\u3001\u30d6\u30ed\u30c3\u30af\u306e\u3046\u3061 <code>.wp-block-<\/code> \u30d9\u30fc\u30b9\u306e\u30af\u30e9\u30b9\u540d\u3092\u6301\u305f\u306a\u3044\u8981\u7d20\u306b\u5bfe\u3057\u3066\u306f\u3001<code>box-sizing: border-box<\/code> \u306f\u4ed8\u4e0e\u3055\u308c\u307e\u305b\u3093\u3002\u4e00\u65b9\u3001<code>.wp-block-<\/code> \u30d9\u30fc\u30b9\u306e\u30af\u30e9\u30b9\u540d\u3092\u6301\u3064\u30d6\u30ed\u30c3\u30af\u306b\u95a2\u3057\u3066\u306f\u3001\u30b9\u30da\u30fc\u30b7\u30f3\u30b0\u30b5\u30dd\u30fc\u30c8\u304c\u8ffd\u52a0\u3055\u308c\u308b\u3068\u540c\u6642\u306b\u3001<code>box-sizing: border-box<\/code> \u304c\u30d6\u30ed\u30c3\u30af\u5358\u4f4d\u3067\u8ffd\u52a0\u3055\u308c\u308b\u4e8b\u306b\u306a\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/github.com\/WordPress\/gutenberg\/issues\/43465\" target=\"_blank\" rel=\"noreferrer noopener\">Dimensions Design Tools Consistency Follow-up: Review box-sizing settings across blocks #43465<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u591a\u304f\u306e\u5834\u5408\u3001\u30ea\u30bb\u30c3\u30c8 CSS \u3068\u3057\u3066\u5168\u3066\u306e\u8981\u7d20\u306b<code>box-sizing: border-box<\/code> \u3092\u9069\u7528\u3059\u308b\u4e8b\u304c\u591a\u3044\u3068\u601d\u3044\u307e\u3059\u304c\u3001\u3053\u306e\u30d7\u30ed\u30d1\u30c6\u30a3\u306f <code>theme.json<\/code> \u3067\u306f\u8a2d\u5b9a\u51fa\u6765\u306a\u3044\u305f\u3081\u3001\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u30fb\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3068\u3082 CSS \u3067\u6307\u5b9a\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u5074\u3067\u306f\u3001\u591a\u304f\u306e\u30b1\u30fc\u30b9\u3067\u306f\u30b5\u30a4\u30c8\u5168\u4f53\u306b\u9069\u7528\u3057\u305f\u3044\u3068\u601d\u3046\u306e\u3067\u3001\u9069\u7528\u7bc4\u56f2\u306f<code>.entry-content<\/code> \u306b\u9650\u3063\u3066\u3044\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<pre data-label=\"style.css\" id=\"style.css\" class=\"wp-block-code lang-css\"><code>*,\n*::before,\n*::after {\n\tbox-sizing: border-box;\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u30a8\u30c7\u30a3\u30bf\u30fc\u5074\u3067\u306f\u3001\u30d6\u30ed\u30c3\u30af\u306e\u307f\u306b\u9650\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"editor-style.css\" id=\"editor-style.css\" class=\"wp-block-code lang-css\"><code>.wp-block {\n\tbox-sizing: border-box;\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Float \u30ec\u30a4\u30a2\u30a6\u30c8\u306e\u554f\u984c<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u300c<a href=\"#content-width\">\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u306e\u691c\u8a0e<\/a>\u300d\u306b\u8a18\u8f09\u3057\u305f\u901a\u308a\u3001\u4eca\u56de\u306e\u8a2d\u8a08\u3067\u306f\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u5168\u4f53\u3092\u30e9\u30c3\u30d7\u3057\u3066\u3044\u308b\u8981\u7d20 (<code>.entry-content<\/code>) \u306b\u5e45\u3092\u6307\u5b9a\u3059\u308b\u306e\u3067\u306f\u306a\u304f\u3001\u305d\u306e\u76f4\u4e0b\u306e\u30d6\u30ed\u30c3\u30af\u306b\u6700\u5927\u5e45\u3092\u6307\u5b9a\u3059\u308b\u3001\u3068\u3044\u3046\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u53d6\u3063\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u554f\u984c\u3068\u306a\u308b\u306e\u304c\u3001\u30d6\u30ed\u30c3\u30af\u3092\u5de6\u5bc4\u305b\u307e\u305f\u306f\u53f3\u5bc4\u305b\u3057\u305f\u5834\u5408\u3001\u3064\u307e\u308a <code>float: {left|right}<\/code> \u304c\u9069\u7528\u3055\u308c\u308b\u6642\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f8b\u3048\u3070\u753b\u50cf\u3092\u5de6\u5bc4\u305b\u306b\u3059\u308b\u3068\u3001\u753b\u9762\u5e45\u304c\u5927\u304d\u3044\u6642\u306b\u3001\u30d6\u30ed\u30c3\u30af\u304c\u671f\u5f85\u3059\u308b\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u304b\u3089\u98db\u3073\u51fa\u3057\u3066\u3057\u307e\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"368\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_28-840x368.jpg\" alt=\"Float \u30ec\u30a4\u30a2\u30a6\u30c8\u306e\u554f\u984c\" class=\"wp-image-545\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_28-840x368.jpg 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_28-768x336.jpg 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_28-1536x672.jpg 1536w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_28.jpg 1684w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u306f\u3001\u4eca\u56de\u306e\u30c6\u30fc\u30de\u8a2d\u8a08\u306b\u9650\u3063\u305f\u3082\u306e\u3067\u306f\u306a\u304f\u3001\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u3067\u3042\u308b Twenty Twenty Three \u3084 Twenty Twenty Two \u3067\u3082\u767a\u751f\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u554f\u984c\u306e\u6839\u672c\u7684\u306a\u80cc\u666f\u3068\u3057\u3066\u3001<code>theme.json<\/code> \u3092\u6301\u3064\u30c6\u30fc\u30de\u3068\u6301\u305f\u306a\u3044\u30c6\u30fc\u30de \u3067\u306f\u3001<strong>\u5de6\u53f3\u5bc4\u305b\u3057\u305f\u6642\u306b\u30d6\u30ed\u30c3\u30af\u306e\u30de\u30fc\u30af\u30a2\u30c3\u30d7\u304c\u7570\u306a\u308b<\/strong>\u3068\u3044\u3046\u4ed5\u69d8\u306b\u8d77\u56e0\u3057\u3066\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f8b\u3048\u3070\u753b\u50cf\u30d6\u30ed\u30c3\u30af\u306e\u5834\u5408\u3001\u30de\u30fc\u30af\u30a2\u30c3\u30d7\u304c\u4ee5\u4e0b\u306e\u3088\u3046\u306b\u7570\u306a\u308a\u307e\u3059 (\u8aac\u660e\u306b\u4e0d\u8981\u306a\u8981\u7d20\u30fb\u5c5e\u6027\u306f\u7c21\u7565\u5316\u3057\u3066\u3044\u307e\u3059)\u3002<\/p>\n\n\n\n<pre class=\"wp-block-code lang-html\"><code>&lt;!--\n\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\n--&gt;\n    \n&lt;!-- theme.json \u3092\u6301\u3064\u30c6\u30fc\u30de --&gt;\n&lt;figure class=\"wp-block-image alignleft\"&gt;\n\t&lt;img src=\"\" class=\"wp-image-XXX\"&gt;\n&lt;\/figure&gt;\n    \n&lt;!-- theme.json \u3092\u6301\u305f\u306a\u3044\u30c6\u30fc\u30de --&gt;\n&lt;div class=\"wp-block-image\"&gt;\n\t&lt;figure class=\"alignleft\"&gt;\n\t\t&lt;img src=\"\" class=\"wp-image-XXX\"&gt;\n\t&lt;\/figure&gt;\n&lt;\/div&gt;\n\n&lt;!--\n\u30a8\u30c7\u30a3\u30bf\u30fc\n--&gt;\n\n&lt;!-- theme.json \u3092\u6301\u3064\u30c6\u30fc\u30de --&gt;\n&lt;figure class=\"alignleft wp-block-image\" data-type=\"core\/image\"&gt;\n\t&lt;div class=\"components-resizable-box__container\"&gt;\n\t\t&lt;img src=\"\"&gt;\n\t&lt;div&gt;\n\t&lt;figcaption class=\"wp-element-caption\"&gt;&lt;\/figcaption&gt;\n&lt;\/figure&gt;\n\n&lt;!-- theme.json \u3092\u6301\u305f\u306a\u3044\u30c6\u30fc\u30de --&gt;\n&lt;div class=\"wp-block\" data-align=\"left\"&gt;\n\t&lt;figure class=\"wp-block-image\" data-type=\"core\/image\"&gt;\n\t\t&lt;div class=\"components-resizable-box__container\"&gt;\n\t\t\t&lt;img src=\"\"&gt;\n\t\t&lt;\/div&gt;\n\t\t&lt;figcaption class=\"wp-element-caption\"&gt;&lt;\/figcaption&gt;\n\t&lt;\/figure&gt;\n&lt;\/div&gt;<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><code>theme.json<\/code> \u3092\u6301\u305f\u306a\u3044\u30c6\u30fc\u30de\u3067\u306f\u3001\u30d6\u30ed\u30c3\u30af\u304c <code>div<\/code> \u30bf\u30b0\u3067\u56f2\u307e\u308c\u3066\u304a\u308a\u3001\u305d\u306e <code>div<\/code> \u30bf\u30b0\u304c\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u6301\u3063\u3066\u3044\u308b\u305f\u3081\u3001\u554f\u984c\u304c\u8d77\u3053\u3089\u306a\u3044\u3068\u3044\u3046\u4e8b\u306b\u306a\u308a\u307e\u3059\u3002\u540c\u3058\u30b3\u30f3\u30c6\u30f3\u30c4\u8a2d\u8a08\u3092\u6301\u3063\u3066\u3044\u308b Twenty Twenty One \u3067\u3053\u306e\u554f\u984c\u304c\u767a\u751f\u3057\u306a\u3044\u306e\u306f\u3001\u305d\u306e\u305f\u3081\u3067\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/05\/03\/block-markup-updates-for-image-quote-list-and-group-blocks\/\" target=\"_blank\" rel=\"noreferrer noopener\">Block markup updates for image, quote, list and group blocks \u2013 Make WordPress Core<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u8abf\u3079\u305f\u9650\u308a\u3067\u306f\u3001\u5f93\u6765\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u5e45\u3092\u7dad\u6301\u3057\u305f float \u30ec\u30a4\u30a2\u30a6\u30c8\u3092\u5b9f\u73fe\u3057\u305f\u3044\u5834\u5408\u306f\u3001<strong>\u5de6 \/ \u53f3\u5bc4\u305b\u3057\u305f\u8981\u7d20\u3068\u56de\u308a\u8fbc\u307e\u305b\u305f\u3044\u8981\u7d20\u3092\u30b0\u30eb\u30fc\u30d7\u30d6\u30ed\u30c3\u30af\u3067\u56f2\u3080<\/strong>\u3001\u3068\u3044\u3046\u65b9\u6cd5\u3092\u53d6\u308b\u3057\u304b\u306a\u3055\u305d\u3046\u3067\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"392\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_29-840x392.jpg\" alt=\"\u5de6 \/ \u53f3\u5bc4\u305b\u3057\u305f\u8981\u7d20\u3068\u56de\u308a\u8fbc\u307e\u305b\u305f\u3044\u8981\u7d20\u3092\u30b0\u30eb\u30fc\u30d7\u30d6\u30ed\u30c3\u30af\u3067\u56f2\u3080\" class=\"wp-image-546\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_29-840x392.jpg 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_29-768x359.jpg 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_29-1536x717.jpg 1536w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_29.jpg 1741w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">CSS \u306e\u8ffd\u52a0<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u307e\u3067\u306e\u5185\u5bb9\u3067\u3001\u898b\u51fa\u3057\u30d6\u30ed\u30c3\u30af\u306e\u4e0a\u30de\u30fc\u30b8\u30f3\u3092\u9664\u3044\u3066\u3001\u30d6\u30ed\u30c3\u30af\u500b\u5225\u306e CSS \u306f\u66f8\u3044\u3066\u3044\u307e\u305b\u3093\u3002<strong>\u30d6\u30ed\u30c3\u30af\u306e\u30ec\u30a4\u30a2\u30a6\u30c8\u3084\u30b9\u30bf\u30a4\u30eb\u306f\u3001 <code>theme.json<\/code> \u3084\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u3067\u51fa\u6765\u308b\u9650\u308a\u5b9f\u73fe\u3059\u3079\u304d<\/strong>\u3060\u3068\u3044\u3046\u8003\u3048\u306b\u57fa\u3065\u3044\u3066\u3044\u308b\u304b\u3089\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u3067\u3059\u304c\u73fe\u5b9f\u7684\u306b\u306f\u3001<code>theme.json<\/code> \u3084\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u3067\u306f\u5bfe\u5fdc\u51fa\u6765\u306a\u3044\u7b87\u6240\u3082\u591a\u3005\u3042\u308a\u3001\u305d\u308c\u3089\u3092\u30ab\u30d0\u30fc\u3059\u308b\u305f\u3081\u306b CSS \u3092\u66f8\u304f\u5fc5\u8981\u304c\u51fa\u3066\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u4f8b\u3048\u3070\u300c\u30e1\u30c7\u30a3\u30a2\u3068\u30c6\u30ad\u30b9\u30c8\u300d\u30d6\u30ed\u30c3\u30af\u3067\u3042\u308c\u3070\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u8981\u671b\u306f\u3001\u4f8b\u3048\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u3067\u3042\u3063\u305f\u3068\u3057\u3066\u3082 CSS \u3092\u66f8\u304b\u306a\u3044\u9650\u308a\u5b9f\u73fe\u51fa\u6765\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u30c6\u30ad\u30b9\u30c8\u30b3\u30f3\u30c6\u30f3\u30c4\u90e8\u5206\u306e\u5de6\u53f3 <code>padding<\/code> (8%) \u3092\u5909\u66f4\u3057\u305f\u3044<\/li>\n\n\n\n<li>\u5b50\u30d6\u30ed\u30c3\u30af\u306e\u4e0a\u4e0b\u30de\u30fc\u30b8\u30f3\u304c\u30d6\u30e9\u30a6\u30b6\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30de\u30fc\u30b8\u30f3\u3067\u53d6\u3089\u308c\u3066\u3044\u308b\u306e\u3067\u3001<code>theme.json<\/code> \u3067\u5b9a\u7fa9\u3057\u305f <code>blockGap<\/code> \u3092\u53cd\u6620\u3055\u305b\u305f\u3044<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"408\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_30-840x408.jpg\" alt=\"\u300c\u30e1\u30c7\u30a3\u30a2\u3068\u30c6\u30ad\u30b9\u30c8\u300d\u30d6\u30ed\u30c3\u30af\u306bCSS\u3092\u8ffd\u52a0\" class=\"wp-image-547\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_30-840x408.jpg 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_30-768x373.jpg 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_30.jpg 1484w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e2\u3064\u3092\u89e3\u6c7a\u3059\u308b\u305f\u3081\u306e\u30b3\u30fc\u30c9\u4f8b\u306f\u4ee5\u4e0b\u3068\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<pre class=\"wp-block-code lang-css\"><code>\/* \u30e1\u30c7\u30a3\u30a2\u3068\u30c6\u30ad\u30b9\u30c8\u9593\u306e\u4f59\u767d\u3092\u3001theme.json \u3067\u6307\u5b9a\u3057\u305f blockGap \u306e\u5024\u306b\u3059\u308b *\/\n.wp-block-media-text {\n\tgap: var(--wp--style--block-gap);\n}\n\n\/* \u30c6\u30ad\u30b9\u30c8\u30b3\u30f3\u30c6\u30f3\u30c4\u90e8\u5206\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u5de6\u53f3 padding \u3092\u6253\u3061\u6d88\u3059 *\/\n.wp-block-media-text .wp-block-media-text__content {\n\tpadding-left: 0;\n\tpadding-right: 0;\n}\n\n\/* \u30c6\u30ad\u30b9\u30c8\u30b3\u30f3\u30c6\u30f3\u30c4\u76f4\u4e0b\u306e\u30d6\u30ed\u30c3\u30af\u4e0a\u4e0b\u30de\u30fc\u30b8\u30f3\u3092\u30ea\u30bb\u30c3\u30c8\u3059\u308b *\/\n.wp-block-media-text .wp-block-media-text__content &gt; * {\n\tmargin-block-start: 0;\n\tmargin-block-end: 0;\n}\n\n\/* \u30c6\u30ad\u30b9\u30c8\u30b3\u30f3\u30c6\u30f3\u30c4\u76f4\u4e0b\u306e\u6700\u521d\u306e\u30d6\u30ed\u30c3\u30af\u3092\u9664\u3044\u3066\u3001\u4e0a\u30de\u30fc\u30b8\u30f3\u3092\u4ed8\u4e0e\u3059\u308b *\/\n.wp-block-media-text .wp-block-media-text__content &gt; * + * {\n\tmargin-block-start: var(--wp--style--block-gap);\n\tmargin-block-end: 0;\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u30d6\u30ed\u30c3\u30af\u4ee5\u5916\u306b\u3001 \u30ec\u30a4\u30a2\u30a6\u30c8\u30fb\u30b9\u30bf\u30a4\u30eb\u3092\u30b3\u30f3\u30c8\u30ed\u30fc\u30eb\u3059\u308b\u305f\u3081\u306b CSS \u3092\u66f8\u304f\u3079\u304d\u53ef\u80fd\u6027\u306e\u3042\u308b\u30b1\u30fc\u30b9\u306f\u591a\u6570\u3042\u308a\u307e\u3059\u304c\u3001\u4ee5\u4e0b\u304c\u305d\u306e\u4f8b\u3067\u3059\u3002\u591a\u304f\u306e\u5834\u5408\u306f\u3001\u30d6\u30ed\u30c3\u30af\u306e\u4e2d\u306b\u8981\u7d20\u304c\u8907\u6570\u3042\u308a\u3001\u305d\u308c\u3089\u3092 <code>theme.json<\/code> \u3084\u30d6\u30ed\u30c3\u30af\u30b5\u30dd\u30fc\u30c8\u3067\u306f\u30b3\u30f3\u30c8\u30ed\u30fc\u30eb\u51fa\u6765\u306a\u3044\u5834\u5408\u3067\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u300c\u30c6\u30fc\u30d6\u30eb\u300d\u30d6\u30ed\u30c3\u30af\u306e\u30bb\u30eb\u306e\u30dc\u30fc\u30c0\u30fc\u8272\u30fb\u30c6\u30ad\u30b9\u30c8\u5de6\u53f3\u63c3\u3048\u30fb\u30d1\u30c7\u30a3\u30f3\u30b0\u304c\u5909\u66f4\u51fa\u6765\u306a\u3044<\/li>\n\n\n\n<li>\u300c\u30d7\u30eb\u30af\u30aa\u30fc\u30c8\u300d\u30d6\u30ed\u30c3\u30af\u306e\u4e2d\u306e <code>blockQuote<\/code> \u8981\u7d20\u306b\u30c7\u30d5\u30a9\u30eb\u30c8\u30de\u30fc\u30b8\u30f3\u304c\u5f53\u305f\u3063\u3066\u3044\u308b<\/li>\n\n\n\n<li>\u300c\u6700\u8fd1\u306e\u30b3\u30e1\u30f3\u30c8\u300d\u30d6\u30ed\u30c3\u30af\u306e\u4e2d\u306e\u5404\u8981\u7d20<\/li>\n\n\n\n<li>\u300c\u30ab\u30d0\u30fc\u300d\u30d6\u30ed\u30c3\u30af\u306e\u5b50\u30d6\u30ed\u30c3\u30af\u9593\u306e\u4f59\u767d<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u305f\u3060\u3057\u3001\u3053\u308c\u3089\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u306f\u3053\u308c\u307e\u3067\u306e\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u3067\u3082\u5f53\u7136\u306e\u3088\u3046\u306b\u884c\u308f\u308c\u3066\u304d\u305f\u306f\u305a\u3067\u3059\u306e\u3067\u3001\u3053\u308c\u3089\u306f\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u500b\u5225\u306e\u8981\u4ef6\u306b\u5408\u308f\u305b\u3066\u5bfe\u5fdc\u3057\u3066\u3044\u3051\u3070\u3088\u3044\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u30d6\u30ed\u30c3\u30af\u30b9\u30bf\u30a4\u30eb\u306e\u8ffd\u52a0<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3061\u3089\u3082\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u306b\u9650\u3063\u305f\u3082\u306e\u3067\u306f\u3042\u308a\u307e\u305b\u3093\u304c\u3001\u4f8b\u3048\u3070\u300c\u4e0b\u30dc\u30fc\u30c0\u30fc\u3092\u6301\u3064 <code>h3<\/code> \u8981\u7d20\u3092\u3001\u56fa\u5b9a\u30da\u30fc\u30b8\u3067\u306f\u30d5\u30e9\u30c3\u30c8\u306a\u72b6\u614b\u3067\u4f7f\u3044\u305f\u3044\u300d\u3068\u3044\u3046\u30b1\u30fc\u30b9\u3067\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u300c\u898b\u51fa\u3057\u30d6\u30ed\u30c3\u30af\u306e\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u300d\u3067\u5bfe\u5fdc\u3057\u305f\u901a\u308a\u3001\u3053\u306e\u4e0b\u30dc\u30fc\u30c0\u30fc\u306f<code>theme.json<\/code> \u3067\u5b9a\u7fa9\u3057\u305f\u3082\u306e\u3067\u3059\u304c\u3001<strong>\u898b\u51fa\u3057\u30d6\u30ed\u30c3\u30af\u81ea\u4f53\u306f\u73fe\u5728\u30dc\u30fc\u30c0\u30fc\u3092\u30b5\u30dd\u30fc\u30c8\u3057\u3066\u3044\u306a\u3044<\/strong>\u305f\u3081\u3001\u30d6\u30ed\u30c3\u30af\u30b5\u30a4\u30c9\u30d0\u30fc\u304b\u3089\u6253\u3061\u6d88\u3059\u4e8b\u304c\u51fa\u6765\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"821\" height=\"445\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_31.png\" alt=\"\u30d6\u30ed\u30c3\u30af\u30b9\u30bf\u30a4\u30eb\u306e\u8ffd\u52a0\" class=\"wp-image-548\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_31.png 821w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_31-768x416.png 768w\" sizes=\"auto, (max-width: 821px) 100vw, 821px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001\u30d6\u30ed\u30c3\u30af\u30b5\u30a4\u30c9\u30d0\u30fc\u304b\u3089\u5168\u3066\u306e\u30b9\u30bf\u30a4\u30eb\u3092\u30b3\u30f3\u30c8\u30ed\u30fc\u30eb\u51fa\u6765\u305f\u3068\u3057\u3066\u3082\u3001\u591a\u304f\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u30b9\u30bf\u30a4\u30eb\u3092\u30d6\u30ed\u30c3\u30af\u5358\u4f4d\u3067\u6bce\u56de\u6253\u3061\u6d88\u3057\u3066\u3044\u304f\u306e\u306f\u624b\u9593\u304c\u304b\u304b\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u3053\u3067\u3001<code>theme.json<\/code> \u3067\u5b9a\u7fa9\u3057\u305f\u30b9\u30bf\u30a4\u30eb\u3092\u30ea\u30bb\u30c3\u30c8\u3057\u305f\u3044\u30d6\u30ed\u30c3\u30af\u306b\u9650\u3063\u3066\u306f\u3001\u30d5\u30e9\u30c3\u30c8\u306a\u72b6\u614b\u3067\u3042\u308b\u30d6\u30ed\u30c3\u30af\u30b9\u30bf\u30a4\u30eb\u3092\u5b9a\u7fa9\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"functions.php\" id=\"functions.php\" class=\"wp-block-code lang-php\"><code>function my_theme_register_block_styles() {\n\tregister_block_style(\n\t\t'core\/heading',\n\t\tarray(\n\t\t\t'name'  =&gt; 'flat',\n\t\t\t'label' =&gt; esc_html__( 'Flat', 'mytheme' ),\n\t\t)\n\t);\n}\nadd_action( 'init', 'my_theme_register_block_styles' );<\/code><\/pre>\n\n\n\n<pre data-label=\"style.css,editor-style.css\" id=\"style.css,editor-style.css\" class=\"wp-block-code lang-css\"><code>h3.is-style-flat {\n\tpadding: 0;\n\tborder-bottom: none;\n}<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"420\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_32-840x420.png\" alt=\"\u30d5\u30e9\u30c3\u30c8\u306a\u72b6\u614b\u3067\u3042\u308b\u30d6\u30ed\u30c3\u30af\u30b9\u30bf\u30a4\u30eb\u3092\u5b9a\u7fa9\" class=\"wp-image-549\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_32-840x420.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_32-768x384.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_32.png 911w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u30d6\u30ed\u30c3\u30af\u30b9\u30bf\u30a4\u30eb\u306f\u3001\u3042\u304f\u307e\u3067\u3082 <code>theme.json<\/code> \u3067\u5b9a\u7fa9\u3057\u305f\u30d6\u30ed\u30c3\u30af\u306e\u30c7\u30d5\u30a9\u30eb\u30c8\u30b9\u30bf\u30a4\u30eb\u3092\u6253\u3061\u6d88\u3059\u3082\u306e\u3067\u3059\u304c\u3001\u3082\u3061\u308d\u3093\u5f93\u6765\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u3067\u884c\u308f\u308c\u3066\u3044\u308b\u3088\u3046\u306b\u3001\u30d6\u30ed\u30c3\u30af\u306e\u30b9\u30bf\u30a4\u30eb\u30fb\u5916\u89b3\u306b\u30d0\u30ea\u30a8\u30fc\u30b7\u30e7\u30f3\u3092\u6301\u305f\u305b\u308b\u305f\u3081\u306e\u30d6\u30ed\u30c3\u30af\u30b9\u30bf\u30a4\u30eb\u3082\u5fc5\u8981\u306b\u5fdc\u3058\u3066\u8ffd\u52a0\u3057\u3066\u3044\u304d\u307e\u3059\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">theme.json \u3067\u5b9a\u7fa9\u3057\u305f\u30b9\u30bf\u30a4\u30eb\u3092\u30b3\u30f3\u30c6\u30f3\u30c4\u5916\u306b\u9069\u7528\u3059\u308b<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u307e\u3067\u306b\u6307\u5b9a\u3057\u305f\u8981\u7d20\u30ec\u30d9\u30eb (\u898b\u51fa\u3057\u3001\u30ea\u30f3\u30af) \u306e\u30b9\u30bf\u30a4\u30eb\u306f\u3001\u30bb\u30ec\u30af\u30bf\u3082\u8981\u7d20\u540d\u3067\u3042\u308b\u305f\u3081\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u5916\u306e\u540c\u3058\u8981\u7d20\u306b\u3082\u9069\u7528\u3055\u308c\u307e\u3059\u3002\u3053\u3053\u3067\u306f\u3001<code>button<\/code> \u8981\u7d20\u3082 <code>theme.json<\/code> \u4e0a\u3067\u30b9\u30bf\u30a4\u30eb\u3092\u5b9a\u7fa9\u51fa\u6765\u308b\u4e8b\u3092\u5229\u7528\u3057\u3066\u3001\u30dc\u30bf\u30f3\u30d6\u30ed\u30c3\u30af\u306b\u5bfe\u3057\u3066\u9069\u7528\u3057\u305f\u30b9\u30bf\u30a4\u30eb\u3092\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u5916\u306e\u30dc\u30bf\u30f3\u30d6\u30ed\u30c3\u30af\u3067\u306f\u306a\u3044 <code>button<\/code> \u8981\u7d20\u306b\u3082\u9069\u7528\u3057\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305a\u3001<code>styles.blocks.core\/button<\/code> \u306e\u5b9a\u7fa9\u3092\u3001<code>styles.elements.button<\/code> \u306b\u79fb\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"theme.json\" id=\"theme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"styles\": {\n\t\t\"elements\": {\n\t\t\t\"button\": {\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"text\": \"var(--wp--preset--color--contrast)\",\n\t\t\t\t\t\"background\": \"var(--wp--preset--color--tertiary)\"\n\t\t\t\t},\n\t\t\t\t\"border\": {\n\t\t\t\t\t\"radius\": \"8px\"\n\t\t\t\t},\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--small)\"\n\t\t\t\t},\n\t\t\t\t\"shadow\": \"2px 2px 4px var(--wp--preset--color--primary)\"\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u3057\u3066\u3001\u3053\u306e\u5b9a\u7fa9\u304b\u3089\u51fa\u529b\u3055\u308c\u3066\u3044\u308b\u30b9\u30bf\u30a4\u30eb\u306e\u30bb\u30ec\u30af\u30bf\u306b <code>.wp-element-button<\/code> \u304c\u4f7f\u308f\u308c\u3066\u3044\u308b\u4e8b\u3092\u5229\u7528\u3057\u3066\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u5916\u306e\u30d8\u30c3\u30c0\u30fc\u306b\u3053\u306e\u30af\u30e9\u30b9\u3092\u6301\u3063\u305f <code>button<\/code> \u8981\u7d20\u3092\u8ffd\u52a0\u3057\u3066\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<pre class=\"wp-block-code lang-html\"><code>&lt;header class=\"site-header\"&gt;\n\tSite Header\n\t&lt;button class=\"wp-element-button\"&gt;Push Me&lt;\/button&gt;\n&lt;\/header&gt;<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><code>theme.json<\/code> \u3067\u5b9a\u7fa9\u3057\u305f\u30dc\u30bf\u30f3\u30b9\u30bf\u30a4\u30eb\u304c\u3001\u30d8\u30c3\u30c0\u30fc\u306b\u8a2d\u7f6e\u3057\u305f\u30dc\u30bf\u30f3\u306b\u3082\u9069\u7528\u3055\u308c\u3066\u3044\u308b\u4e8b\u304c\u78ba\u8a8d\u51fa\u6765\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"436\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_33-840x436.png\" alt=\"theme.json \u3067\u5b9a\u7fa9\u3057\u305f\u30dc\u30bf\u30f3\u30b9\u30bf\u30a4\u30eb\u304c\u3001\u30d8\u30c3\u30c0\u30fc\u306b\u8a2d\u7f6e\u3057\u305f\u30dc\u30bf\u30f3\u306b\u3082\u9069\u7528\u3055\u308c\u3066\u3044\u308b\" class=\"wp-image-550\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_33-840x436.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_33-768x399.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_33.png 1000w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u306e\u3088\u3046\u306b\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u5185\u306e\u30d6\u30ed\u30c3\u30af (\u8981\u7d20) \u3068\u30b3\u30f3\u30c6\u30f3\u30c4\u5916\u306e\u8981\u7d20\u306b\u3001<code>theme.json<\/code> \u3092\u4ecb\u3057\u3066\u5171\u901a\u306e\u30b9\u30bf\u30a4\u30eb\u3092\u9069\u7528\u3059\u308b\u4e8b\u304c\u51fa\u6765\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/10\/10\/styling-elements-in-block-themes\/\" target=\"_blank\" rel=\"noreferrer noopener\">Styling elements in block themes \u2013 Make WordPress Core<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">WordPress6.1\u306b\u304a\u3044\u3066\u3001\u6307\u5b9a\u51fa\u6765\u308b\u8981\u7d20\u3068\u751f\u6210\u3055\u308c\u308b\u30bb\u30ec\u30af\u30bf\u306e\u4e00\u89a7\u306f\u4ee5\u4e0b\u3067\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><code>button<\/code>: <code>.wp-element-button, .wp-block-button__link<\/code><\/li>\n\n\n\n<li><code>caption<\/code>: <code>.wp-element-caption, .wp-block-XXX figcaption<\/code><\/li>\n\n\n\n<li><code>cite<\/code>: <code>cite<\/code><\/li>\n\n\n\n<li><code>heading<\/code>: <code>h1, h2, h3, h4, h5, h6<\/code><\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30a8\u30c7\u30a3\u30bf\u30fc\u306e\u5c0e\u5165<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">WordPress6.1\u3067\u5c0e\u5165\u3055\u308c\u305f\u3001\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u3067\u3082\u5229\u7528\u3067\u304d\u308b\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30a8\u30c7\u30a3\u30bf\u30fc\u3092\u4f7f\u3063\u3066\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u5916\u306e\u4efb\u610f\u306e\u30a8\u30ea\u30a2\u3092\u30d6\u30ed\u30c3\u30af\u30a8\u30c7\u30a3\u30bf\u30fc\u3067\u7de8\u96c6\u51fa\u6765\u308b\u3088\u3046\u306b\u3059\u308b\u3001\u3068\u3044\u3046\u30a2\u30d7\u30ed\u30fc\u30c1\u3067\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/make.wordpress.org\/core\/2022\/10\/04\/block-based-template-parts-in-traditional-themes\/\" target=\"_blank\" rel=\"noreferrer noopener\">Block-based \u201ctemplate parts\u201d in traditional themes \u2013 Make WordPress Core<\/a><\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u540c\u69d8\u306e\u4e8b\u306f\u3001\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u30d6\u30ed\u30c3\u30af\u30a8\u30c7\u30a3\u30bf\u30fc\u3092\u5229\u7528\u3059\u308c\u3070\u5b9f\u73fe\u51fa\u6765\u307e\u3059\u304c\u3001\u30a6\u30a3\u30b8\u30a7\u30c3\u30c8\u30d6\u30ed\u30c3\u30af\u30a8\u30c7\u30a3\u30bf\u30fc\u3068\u6bd4\u3079\u308b\u3068\u4ee5\u4e0b4\u3064\u306e\u30e1\u30ea\u30c3\u30c8\u304c\u3042\u308b\u3068\u8003\u3048\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u30c7\u30d5\u30a9\u30eb\u30c8\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u30c6\u30fc\u30de\u5074\u3067\u5b9a\u7fa9\u51fa\u6765\u308b<\/li>\n\n\n\n<li>\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u7de8\u96c6\u3057\u305f\u5f8c\u306b\u3001\u30c6\u30fc\u30de\u5074\u3067\u5b9a\u7fa9\u3057\u305f\u30c7\u30d5\u30a9\u30eb\u30c8\u30b3\u30f3\u30c6\u30f3\u30c4\u306b\u30ea\u30bb\u30c3\u30c8\u51fa\u6765\u308b<\/li>\n\n\n\n<li>\u30b3\u30fc\u30c9\u30a8\u30c7\u30a3\u30bf\u30fc\u3092\u4f7f\u7528\u51fa\u6765\u308b<\/li>\n\n\n\n<li>\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u6bce\u306b\u30a8\u30c7\u30a3\u30bf\u30fc\u30a4\u30f3\u30b9\u30bf\u30f3\u30b9\u304c\u5206\u304b\u308c\u3066\u3044\u308b<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u3067\u306f\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u8981\u4ef6\u3092\u5b9f\u73fe\u3059\u308b\u305f\u3081\u306b\u3001\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30a8\u30c7\u30a3\u30bf\u30fc\u3092\u5c0e\u5165\u3059\u308b\u3068\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>\u6295\u7a3f\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u4e0b\u90e8\u306b\u5171\u901a\u306e Call to Action \u30a8\u30ea\u30a2\u3092\u8a2d\u3051\u305f\u3044<\/li>\n\n\n\n<li>\u6642\u671f\u306b\u3088\u308a\u3001\u30c6\u30ad\u30b9\u30c8\u3084\u30ea\u30f3\u30af\u5148\u3092\u5909\u66f4\u51fa\u6765\u308b\u3088\u3046\u306b\u3057\u305f\u3044<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305a\u306f\u3001\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30a8\u30c7\u30a3\u30bf\u30fc\u6a5f\u80fd\u3092\u30aa\u30d7\u30c8\u30a4\u30f3\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<pre data-label=\"functions.php\" id=\"functions.php\" class=\"wp-block-code lang-php\"><code>function my_theme_setup() {\n\tadd_theme_support( 'block-template-parts' );\n}\nadd_action( 'after_setup_theme', 'my_theme_setup' );<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u6a5f\u80fd\u3092\u30aa\u30d7\u30c8\u30a4\u30f3\u3059\u308b\u3060\u3051\u3067\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30e1\u30cb\u30e5\u30fc\u306b\u306f\u30a2\u30af\u30bb\u30b9\u3067\u304d\u307e\u3059\u304c\u3001\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u304c\u898b\u3064\u304b\u3089\u306a\u3044\u3068\u8868\u793a\u3055\u308c\u308b\u3060\u3051\u3067\u3001\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u306e\u3088\u3046\u306b\u65b0\u3057\u304f\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u3092\u8ffd\u52a0\u3059\u308b\u4e8b\u3082\u51fa\u6765\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"420\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_34-840x420.png\" alt=\"\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30e1\u30cb\u30e5\u30fc\" class=\"wp-image-551\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_34-840x420.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_34-768x384.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_34.png 943w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u308c\u306f\u3001\u30af\u30e9\u30b7\u30c3\u30af\u30c6\u30fc\u30de\u3067\u4f8b\u3048\u7ba1\u7406\u753b\u9762\u4e0a\u3067\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u3092\u65b0\u898f\u8ffd\u52a0\u51fa\u6765\u305f\u3068\u3057\u3066\u3082\u3001<strong>\u305d\u306e\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u3092\u30d5\u30ed\u30f3\u30c8\u30a8\u30f3\u30c9\u3067\u8868\u793a\u3055\u305b\u308b\u305f\u3081\u306b\u306f\u3001\u7d50\u5c40 PHP \u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u5185\u3067\u547c\u3073\u51fa\u3059\u30b3\u30fc\u30c9\u3092\u660e\u793a\u7684\u306b\u66f8\u304f\u5fc5\u8981\u304c\u3042\u308b\u304b\u3089<\/strong>\u3067\u3059\u3002\u3064\u307e\u308a\u3001\u3042\u3089\u304b\u3058\u3081\u30c6\u30fc\u30de\u304c\u6301\u3063\u3066\u3044\u308b\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u306e\u7de8\u96c6\u306e\u307f\u3092\u884c\u3048\u308b\u3068\u3044\u3046\u4e8b\u306b\u306a\u308a\u307e\u3059\u3002\u4e00\u65b9\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u3067\u3042\u308c\u3070\u3001\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30a8\u30c7\u30a3\u30bf\u30fc\u4e0a\u3067\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u3092\u81ea\u7531\u306b\u633f\u5165\u51fa\u6765\u308b\u306e\u3067\u3001\u7ba1\u7406\u753b\u9762\u4e0a\u304b\u3089\u3082\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u3092\u65b0\u898f\u8ffd\u52a0\u51fa\u6765\u308b\u3001\u3068\u3044\u3046\u4e8b\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u306e\u305f\u3081\u3001\u307e\u305a\u306f\u30c7\u30d5\u30a9\u30eb\u30c8\u30b3\u30f3\u30c6\u30f3\u30c4\u3068\u306a\u308b HTML \u3092\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30d5\u30a1\u30a4\u30eb\u306b\u66f8\u304f\u305f\u3081\u306b\u3001\u901a\u5e38\u306e\u6295\u7a3f\u30a8\u30c7\u30a3\u30bf\u30fc\u4e0a\u3067\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u4f5c\u308a\u307e\u3059\u3002\u305d\u306e HTML \u3092\u3001\u30c6\u30fc\u30de\u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306e <code>parts\/cta.html<\/code> \u306b\u66f8\u304d\u8fbc\u307f\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"310\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_35-840x310.png\" alt=\"\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\" class=\"wp-image-552\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_35-840x310.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_35-768x283.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_35.png 1160w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<pre data-label=\"parts\/cta.html\" id=\"parts\/cta.html\" class=\"wp-block-code lang-html\"><code>&lt;!-- wp:group {\"align\":\"full\",\"style\":{\"color\":{\"background\":\"#ffffff\"},\"spacing\":{\"padding\":{\"top\":\"3rem\",\"bottom\":\"3rem\",\"right\":\"1rem\",\"left\":\"1rem\"}}},\"layout\":{\"type\":\"constrained\"}} --&gt;\n&lt;div class=\"wp-block-group alignfull has-background\" style=\"background-color:#ffffff;padding-top:3rem;padding-right:1rem;padding-bottom:3rem;padding-left:1rem\"&gt;&lt;!-- wp:paragraph {\"align\":\"center\",\"fontSize\":\"x-large\"} --&gt;\n&lt;p class=\"has-text-align-center has-x-large-font-size\"&gt;&lt;strong&gt;GET IN TOUCH&lt;\/strong&gt;&lt;\/p&gt;\n&lt;!-- \/wp:paragraph --&gt;\n\n&lt;!-- wp:paragraph --&gt;\n&lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.&lt;\/p&gt;\n&lt;!-- \/wp:paragraph --&gt;\n\n&lt;!-- wp:buttons {\"layout\":{\"type\":\"flex\",\"justifyContent\":\"center\",\"orientation\":\"horizontal\",\"flexWrap\":\"nowrap\"}} --&gt;\n&lt;div class=\"wp-block-buttons\"&gt;&lt;!-- wp:button {\"width\":50} --&gt;\n&lt;div class=\"wp-block-button has-custom-width wp-block-button__width-50\"&gt;&lt;a class=\"wp-block-button__link wp-element-button\"&gt;Contact us&lt;\/a&gt;&lt;\/div&gt;\n&lt;!-- \/wp:button --&gt;&lt;\/div&gt;\n&lt;!-- \/wp:buttons --&gt;&lt;\/div&gt;\n&lt;!-- \/wp:group --&gt;<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u307e\u3067\u306e\u5bfe\u5fdc\u3067\u3001\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30a8\u30c7\u30a3\u30bf\u30fc\u4e0a\u3067\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u7de8\u96c6\u51fa\u6765\u308b\u3088\u3046\u306b\u306a\u308a\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"376\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_36-840x376.png\" alt=\"\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30a8\u30c7\u30a3\u30bf\u30fc\u4e0a\u3067\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u7de8\u96c6\u51fa\u6765\u308b\" class=\"wp-image-553\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_36-840x376.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_36-768x343.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_36.png 1261w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u305d\u3057\u3066\u6700\u5f8c\u306b\u3001PHP \u30da\u30fc\u30b8\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u306b\u3053\u306e\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u3092\u547c\u3073\u51fa\u3059\u51e6\u7406\u3092\u66f8\u304d\u307e\u3059\u3002\u30e1\u30a4\u30f3\u306e\u30b3\u30f3\u30c6\u30f3\u30c4\u30a8\u30ea\u30a2\u540c\u69d8\u3001<strong><code>.entry-content<\/code> \u3068 <code>.is-layout-flow<\/code> \u30af\u30e9\u30b9\u3092\u4ed8\u4e0e\u3057\u3066\u3044\u308bdiv\u30bf\u30b0\u3067\u56f2\u3093\u3067\u3044\u308b\u6240<\/strong>\u304c\u30dd\u30a4\u30f3\u30c8\u3067\u3059\u3002\u3053\u306e\u30af\u30e9\u30b9\u304c\u7121\u3044\u3068\u3001\u300c<a href=\"#block-margin\">\u30d6\u30ed\u30c3\u30af\u9593\u306e\u30de\u30fc\u30b8\u30f3\u8a2d\u5b9a<\/a>\u300d\u300c<a href=\"#per-block-margin\">\u30d6\u30ed\u30c3\u30af\u500b\u5225\u306e\u30de\u30fc\u30b8\u30f3\u8a2d\u5b9a<\/a>\u300d\u3067\u884c\u3063\u305f\u5bfe\u5fdc\u304c\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30a8\u30ea\u30a2\u306b\u53cd\u6620\u3055\u308c\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u307e\u305f\u3001\u30e1\u30a4\u30f3\u30b3\u30f3\u30c6\u30f3\u30c4\u30a8\u30ea\u30a2\u3068\u533a\u5225\u3057\u3066\u30b9\u30bf\u30a4\u30ea\u30f3\u30b0\u3057\u305f\u3044\u6642\u306e\u305f\u3081\u306b\u3001<code>.parts-cta<\/code> \u306e\u3088\u3046\u306a\u5225\u306e\u30af\u30e9\u30b9\u3092\u8ffd\u52a0\u3059\u308b\u306e\u3082\u826f\u3044\u304b\u3082\u3057\u308c\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<pre data-label=\"index.php\" id=\"index.php\" class=\"wp-block-code lang-php\"><code>&lt;\/main&gt;\n\n&lt;div class=\"entry-content is-layout-flow\"&gt;\n\t&lt;?php block_template_part( 'cta' ); ?&gt;\n&lt;\/div&gt;<\/code><\/pre>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"840\" height=\"767\" src=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_37-840x767.png\" alt=\"\u30e1\u30a4\u30f3\u30b3\u30f3\u30c6\u30f3\u30c4\u30a8\u30ea\u30a2\u3068\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30a8\u30ea\u30a2\" class=\"wp-image-554\" srcset=\"https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_37-840x767.png 840w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_37-768x701.png 768w, https:\/\/aki-hamano.blog\/wp-content\/uploads\/2024\/06\/hybrid-theme_37.png 1242w\" sizes=\"auto, (max-width: 840px) 100vw, 840px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">\u7406\u8ad6\u7684\u306b\u306f\u3001\u30b3\u30f3\u30c6\u30f3\u30c4\u5916\u306e\u30a8\u30ea\u30a2\u3092\u5168\u3066\u30c6\u30f3\u30d7\u30ec\u30fc\u30c8\u30d1\u30fc\u30c4\u30a8\u30c7\u30a3\u30bf\u30fc\u5316\u3059\u308b\u3001\u3068\u3044\u3046\u4e8b\u3082\u51fa\u6765\u307e\u3059\u3002\u305f\u3060\u3057\u3053\u3053\u307e\u3067\u3084\u308b\u5fc5\u8981\u304c\u3042\u308b\u306a\u3089\u3001\u3082\u306f\u3084\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u3067\u306f\u7121\u304f\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u3067\u306e\u958b\u767a\u3092\u691c\u8a0e\u3057\u305f\u65b9\u304c\u826f\u3044\u304b\u3082\u3057\u308c\u307e\u305b\u3093\u3002<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u307e\u3068\u3081<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">\u3053\u3053\u307e\u3067\u3001\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u69cb\u7bc9\u306e\u305f\u3081\u306e\u3044\u304f\u3064\u304b\u306e\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u63d0\u6848\u3057\u307e\u3057\u305f\u304c\u3001\u5b9f\u969b\u306e\u30d7\u30ed\u30b8\u30a7\u30af\u30c8\u3067\u306f\u3053\u306e\u901a\u308a\u306b\u30b9\u30e0\u30fc\u30ba\u306b\u9032\u3080\u3053\u3068\u306f\u5c11\u306a\u304f\u3001\u30a4\u30ec\u30ae\u30e5\u30e9\u30fc\u306a\u5bfe\u5fdc\u3084\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u304c\u6c42\u3081\u3089\u308c\u308b\u4e8b\u304c\u307b\u3068\u3093\u3069\u3060\u3068\u601d\u3044\u307e\u3059\u3002\u3067\u3059\u304c\u3001\u305d\u308c\u306b\u3069\u3046\u5bfe\u51e6\u3059\u308b\u304b\u304c\u30a8\u30f3\u30b8\u30cb\u30a2\u3068\u3057\u3066\u306e\u8155\u306e\u898b\u305b\u6240\u3060\u3068\u601d\u3063\u3066\u3044\u307e\u3059\u306e\u3067\u3001\u305c\u3072\u30d9\u30b9\u30c8\u306a\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u63a2\u3063\u3066\u307f\u3066\u3044\u305f\u3060\u3051\u308c\u3070\u3068\u601d\u3044\u307e\u3059\u3002\u307e\u305f\u3001\u7279\u306b <code>theme.json<\/code> \u306e\u8a2d\u8a08\u306e\u30a2\u30a4\u30c7\u30a2\u306b\u3064\u3044\u3066\u306f\u3001\u4eca\u5f8c\u306e\u30d6\u30ed\u30c3\u30af\u30c6\u30fc\u30de\u958b\u767a\u306b\u3082\u305d\u306e\u307e\u307e\u751f\u304b\u305b\u308b\u306e\u3067\u306f\u306a\u3044\u304b\u3068\u601d\u3044\u307e\u3059\u3002<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u6700\u5f8c\u306b\u3001\u3053\u306e\u8a18\u4e8b\u3067\u4f5c\u6210\u3055\u308c\u305f\u6700\u7d42\u7684\u306a\u30c6\u30fc\u30de\u306e\u30bd\u30fc\u30b9\u4e00\u5f0f\u3092\u8a18\u8f09\u3057\u3066\u304a\u304d\u307e\u3059 (<code>assets<\/code> \u30c7\u30a3\u30ec\u30af\u30c8\u30ea\u306b\u914d\u7f6e\u3057\u305f\u30d5\u30a9\u30f3\u30c8\u30d5\u30a1\u30a4\u30eb\u306f\u9664\u304f)\u3002<\/p>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\"><summary>\u200btheme.json<\/summary>\n<pre data-label=\"\u200btheme.json\" id=\"\u200btheme.json\" class=\"wp-block-code lang-json\"><code>{\n\t\"$schema\": \"https:\/\/schemas.wp.org\/trunk\/theme.json\",\n\t\"version\": 2,\n\t\"settings\": {\n\t\t\"layout\": {\n\t\t\t\"contentSize\": \"960px\",\n\t\t\t\"wideSize\": \"1200px\"\n\t\t},\n\t\t\"spacing\": {\n\t\t\t\"blockGap\": true,\n\t\t\t\"margin\": true,\n\t\t\t\"padding\": true,\n\t\t\t\"spacingScale\": {\n\t\t\t\t\"steps\": 0\n\t\t\t},\n\t\t\t\"spacingSizes\": &#91;\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(0.75rem, 0.4090909090909091rem + 1.4545454545454546vw, 1.5rem)\",\n\t\t\t\t\t\"slug\": \"30\",\n\t\t\t\t\t\"name\": \"3\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(1rem, 0.5454545454545454rem + 1.9393939393939394vw, 2rem)\",\n\t\t\t\t\t\"slug\": \"40\",\n\t\t\t\t\t\"name\": \"4\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(1.5rem, 0.8181818181818182rem + 2.909090909090909vw, 3rem)\",\n\t\t\t\t\t\"slug\": \"50\",\n\t\t\t\t\t\"name\": \"5\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(2rem, 1.0909090909090908rem + 3.878787878787879vw, 4rem)\",\n\t\t\t\t\t\"slug\": \"60\",\n\t\t\t\t\t\"name\": \"6\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(3rem, 1.6363636363636365rem + 5.818181818181818vw, 6rem)\",\n\t\t\t\t\t\"slug\": \"70\",\n\t\t\t\t\t\"name\": \"7\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"size\": \"clamp(4rem, 2.1818181818181817rem + 7.757575757575758vw, 8rem)\",\n\t\t\t\t\t\"slug\": \"80\",\n\t\t\t\t\t\"name\": \"8\"\n\t\t\t\t}\n\t\t\t]\n\t\t},\n\t\t\"color\": {\n\t\t\t\"defaultPalette\": false,\n\t\t\t\"palette\": &#91;\n\t\t\t\t{\n\t\t\t\t\t\"color\": \"#F6F2EC\",\n\t\t\t\t\t\"name\": \"Base\",\n\t\t\t\t\t\"slug\": \"base\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"color\": \"#21251F\",\n\t\t\t\t\t\"name\": \"Contrast\",\n\t\t\t\t\t\"slug\": \"contrast\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"color\": \"#5B4460\",\n\t\t\t\t\t\"name\": \"Primary\",\n\t\t\t\t\t\"slug\": \"primary\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"color\": \"#FCC263\",\n\t\t\t\t\t\"name\": \"Secondary\",\n\t\t\t\t\t\"slug\": \"secondary\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"color\": \"#E7A1A9\",\n\t\t\t\t\t\"name\": \"Tertiary\",\n\t\t\t\t\t\"slug\": \"tertiary\"\n\t\t\t\t}\n\t\t\t]\n\t\t},\n\t\t\"typography\": {\n\t\t\t\"lineHeight\": true,\n\t\t\t\"letterSpacing\": false,\n\t\t\t\"textDecoration\": false,\n\t\t\t\"textTransform\": false,\n\t\t\t\"dropCap\": false,\n\t\t\t\"fontStyle\": false,\n\t\t\t\"fluid\": true,\n\t\t\t\"fontSizes\": &#91;\n\t\t\t\t{\n\t\t\t\t\t\"fluid\": {\n\t\t\t\t\t\t\"min\": \"0.875rem\",\n\t\t\t\t\t\t\"max\": \"1rem\"\n\t\t\t\t\t},\n\t\t\t\t\t\"size\": \"1rem\",\n\t\t\t\t\t\"slug\": \"small\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"fluid\": {\n\t\t\t\t\t\t\"min\": \"1rem\",\n\t\t\t\t\t\t\"max\": \"1.125rem\"\n\t\t\t\t\t},\n\t\t\t\t\t\"size\": \"1.125rem\",\n\t\t\t\t\t\"slug\": \"medium\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"fluid\": {\n\t\t\t\t\t\t\"min\": \"1.125rem\",\n\t\t\t\t\t\t\"max\": \"1.5rem\"\n\t\t\t\t\t},\n\t\t\t\t\t\"size\": \"1.5rem\",\n\t\t\t\t\t\"slug\": \"large\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"fluid\": {\n\t\t\t\t\t\t\"min\": \"1.25rem\",\n\t\t\t\t\t\t\"max\": \"1.875rem\"\n\t\t\t\t\t},\n\t\t\t\t\t\"size\": \"1.875rem\",\n\t\t\t\t\t\"slug\": \"x-large\"\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\t\"fluid\": {\n\t\t\t\t\t\t\"min\": \"1.5rem\",\n\t\t\t\t\t\t\"max\": \"2.25rem\"\n\t\t\t\t\t},\n\t\t\t\t\t\"size\": \"2.25rem\",\n\t\t\t\t\t\"slug\": \"xx-large\"\n\t\t\t\t}\n\t\t\t],\n\t\t\t\"fontFamilies\": &#91;\n\t\t\t\t{\n\t\t\t\t\t\"fontFace\": &#91;\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\"fontDisplay\": \"block\",\n\t\t\t\t\t\t\t\"fontFamily\": \"Noto Sans JP\",\n\t\t\t\t\t\t\t\"fontStretch\": \"normal\",\n\t\t\t\t\t\t\t\"fontStyle\": \"normal\",\n\t\t\t\t\t\t\t\"fontWeight\": \"400\",\n\t\t\t\t\t\t\t\"src\": &#91; \"file:.\/assets\/font\/NotoSansJP-Regular.woff2\" ]\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\"fontDisplay\": \"block\",\n\t\t\t\t\t\t\t\"fontFamily\": \"Noto Sans JP\",\n\t\t\t\t\t\t\t\"fontStretch\": \"normal\",\n\t\t\t\t\t\t\t\"fontStyle\": \"normal\",\n\t\t\t\t\t\t\t\"fontWeight\": \"700\",\n\t\t\t\t\t\t\t\"src\": &#91; \"file:.\/assets\/font\/NotoSansJP-Bold.woff2\" ]\n\t\t\t\t\t\t}\n\t\t\t\t\t],\n\t\t\t\t\t\"fontFamily\": \"Noto Sans JP\",\n\t\t\t\t\t\"name\": \"Noto Sans JP\",\n\t\t\t\t\t\"slug\": \"noto-sans-jp\"\n\t\t\t\t}\n\t\t\t]\n\t\t},\n\t\t\"custom\": {\n\t\t\t\"gutter\": \"1rem\",\n\t\t\t\"font-size\": {\n\t\t\t\t\"huge\": \"clamp(2rem, 2vw + 1rem, 3rem);\",\n\t\t\t\t\"gigantic\": \"clamp(2.5rem, 3vw + 1rem, 3.75rem);\"\n\t\t\t},\n\t\t\t\"line-height\": {\n\t\t\t\t\"small\": 1.4,\n\t\t\t\t\"normal\": 1.6\n\t\t\t},\n\t\t\t\"color\": {\n\t\t\t\t\"gray-light\": \"#cccccc\",\n\t\t\t\t\"gray\": \"#999999\",\n\t\t\t\t\"gray-dark\": \"#666666\"\n\t\t\t}\n\t\t}\n\t},\n\t\"styles\": {\n\t\t\"color\": {\n\t\t\t\"background\": \"var(--wp--preset--color--base)\",\n\t\t\t\"text\": \"var(--wp--preset--color--contrast)\"\n\t\t},\n\t\t\"spacing\": {\n\t\t\t\"blockGap\": \"1.5rem\"\n\t\t},\n\t\t\"typography\": {\n\t\t\t\"fontSize\": \"var(--wp--preset--font-size--medium)\",\n\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--normal)\",\n\t\t\t\"fontFamily\": \"var(--wp--preset--font-family--noto-sans-jp)\"\n\t\t},\n\t\t\"elements\": {\n\t\t\t\"link\": {\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"text\": \"var(--wp--preset--color--primary)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h1\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--custom--font-size--gigantic)\",\n\t\t\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--small)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h2\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--font-size--huge)\",\n\t\t\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--small)\"\n\t\t\t\t},\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"text\": \"var(--wp--preset--color--base)\",\n\t\t\t\t\t\"background\": \"var(--wp--preset--color--primary)\"\n\t\t\t\t},\n\t\t\t\t\"spacing\": {\n\t\t\t\t\t\"padding\": {\n\t\t\t\t\t\t\"left\": \"0.5em\",\n\t\t\t\t\t\t\"right\": \"0.5em\",\n\t\t\t\t\t\t\"top\": \"0.25em\",\n\t\t\t\t\t\t\"bottom\": \"0.25em\"\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h3\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--font-size--x-large)\",\n\t\t\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--small)\"\n\t\t\t\t},\n\t\t\t\t\"border\": {\n\t\t\t\t\t\"bottom\": {\n\t\t\t\t\t\t\"color\": \"var(--wp--preset--color--primary)\",\n\t\t\t\t\t\t\"width\": \"4px\",\n\t\t\t\t\t\t\"style\": \"solid\"\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t\"spacing\": {\n\t\t\t\t\t\"padding\": {\n\t\t\t\t\t\t\"bottom\": \"0.25em\"\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h4\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--font-size--large)\"\n\t\t\t\t},\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"text\": \"var(--wp--preset--color--primary)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h5\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--font-size--medium)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"h6\": {\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"fontSize\": \"var(--wp--preset--font-size--medium)\"\n\t\t\t\t}\n\t\t\t},\n\t\t\t\"button\": {\n\t\t\t\t\"color\": {\n\t\t\t\t\t\"text\": \"var(--wp--preset--color--contrast)\",\n\t\t\t\t\t\"background\": \"var(--wp--preset--color--tertiary)\"\n\t\t\t\t},\n\t\t\t\t\"border\": {\n\t\t\t\t\t\"radius\": \"8px\"\n\t\t\t\t},\n\t\t\t\t\"typography\": {\n\t\t\t\t\t\"lineHeight\": \"var(--wp--custom--line-height--small)\"\n\t\t\t\t},\n\t\t\t\t\"shadow\": \"2px 2px 4px var(--wp--preset--color--primary)\"\n\t\t\t}\n\t\t},\n\t\t\"blocks\": {\n\t\t\t\"core\/buttons\": {\n\t\t\t\t\"spacing\": {\n\t\t\t\t\t\"blockGap\": \"1rem\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n<\/details>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\"><summary>\u200bstyle.css<\/summary>\n<pre data-label=\"\u200bstyle.css\" id=\"\u200bstyle.css\" class=\"wp-block-code lang-css\"><code>\/*\nTheme Name: My Theme\n*\/\n\n*,\n*::before,\n*::after {\n\tbox-sizing: border-box;\n}\n\n.site-header,\n.site-footer {\n\tbackground-color: #ddd;\n\ttext-align: center;\n\tpadding: 1rem;\n}\n\n.site-main {\n\tpadding-top: 3rem;\n\tpadding-bottom: 3rem;\n}\n\n.page-title {\n\ttext-align: center;\n\tfont-size: 2rem;\n\tmargin-top: 0;\n\tmargin-bottom: 3rem;\n}\n\n.entry-content &gt; *:not(.alignwide):not(.alignfull) {\n\tmax-width: var(--wp--style--global--content-size);\n}\n\n.entry-content &gt; *.alignwide {\n\tmax-width: var(--wp--style--global--wide-size);\n}\n\n.entry-content &gt; *:not(.alignfull) {\n\tmargin-right: auto;\n\tmargin-left: auto;\n}\n\n.entry-content {\n\tpadding-left: var(--wp--custom--gutter);\n\tpadding-right: var(--wp--custom--gutter);\n}\n\n.entry-content &gt; *.alignfull {\n\tmargin-left: calc( var(--wp--custom--gutter) * -1);\n\tmargin-right: calc( var(--wp--custom--gutter) * -1);\n}\n\n.is-layout-flow &gt; * + h1,\n.is-layout-flow &gt; * + h2,\n.is-layout-flow &gt; * + h3,\n.is-layout-flow &gt; * + h4,\n.is-layout-flow &gt; * + h5,\n.is-layout-flow &gt; * + h6 {\n\tmargin-top: 3rem;\n}\n\n.wp-block-media-text {\n\tgap: var(--wp--style--block-gap);\n}\n\n.wp-block-media-text .wp-block-media-text__content {\n\tpadding-left: 0;\n\tpadding-right: 0;\n}\n\n.wp-block-media-text .wp-block-media-text__content &gt; * {\n\tmargin-block-start: 0;\n\tmargin-block-end: 0;\n}\n\n.wp-block-media-text .wp-block-media-text__content &gt; * + * {\n\tmargin-block-start: var(--wp--style--block-gap);\n\tmargin-block-end: 0;\n}\n\nh3.is-style-flat {\n\tpadding: 0;\n\tborder-bottom: none;\n}<\/code><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n<\/details>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\"><summary>\u200beditor-style.css<\/summary>\n<pre data-label=\"\u200beditor-style.css\" id=\"\u200beditor-style.css\" class=\"wp-block-code lang-css\"><code>body {\n\tpadding-left: var(--wp--custom--gutter);\n\tpadding-right: var(--wp--custom--gutter);\n}\n\n.alignfull {\n\tmargin-left: calc( var(--wp--custom--gutter) * -1);\n\tmargin-right: calc( var(--wp--custom--gutter) * -1);\n}\n\n.is-layout-flow &gt; * + .wp-block-heading {\n\tmargin-top: 3rem;\n}\n\n.wp-block {\n\tbox-sizing: border-box;\n}\n\n.wp-block-media-text {\n\tgap: var(--wp--style--block-gap);\n}\n\n.wp-block-media-text .wp-block-media-text__content {\n\tpadding-left: 0;\n\tpadding-right: 0;\n}\n\n.wp-block-media-text .wp-block-media-text__content &gt; * {\n\tmargin-block-start: 0;\n\tmargin-block-end: 0;\n}\n\n.wp-block-media-text .wp-block-media-text__content &gt; * + * {\n\tmargin-block-start: var(--wp--style--block-gap);\n\tmargin-block-end: 0;\n}\n\nh3.is-style-flat {\n\tpadding: 0;\n\tborder-bottom: none;\n}<\/code><\/pre>\n<\/details>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\"><summary>index.php<\/summary>\n<pre data-label=\"\u200bindex.php\" id=\"\u200bindex.php\" class=\"wp-block-code lang-php\"><code>&lt;!doctype html&gt;\n&lt;html &lt;?php language_attributes(); ?&gt;&gt;\n&lt;head&gt;\n\t&lt;meta charset=\"&lt;?php bloginfo( 'charset' ); ?&gt;\" \/&gt;\n\t&lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" \/&gt;\n\t&lt;?php wp_head(); ?&gt;\n&lt;\/head&gt;\n\n&lt;body &lt;?php body_class(); ?&gt;&gt;\n\n&lt;header class=\"site-header\"&gt;\n\tSite Header\n&lt;\/header&gt;\n\n&lt;main class=\"site-main\"&gt;\n\t&lt;h1 class=\"page-title\"&gt;&lt;?php the_title(); ?&gt;&lt;\/h1&gt;\n\t&lt;?php\n\tif ( have_posts() ) :\n\t\twhile ( have_posts() ) :\n\t\t\tthe_post();\n\t\t\t?&gt;\n\t\t\t&lt;div class=\"entry-content is-layout-flow\"&gt;\n\t\t\t\t&lt;?php the_content(); ?&gt;\n\t\t\t&lt;\/div&gt;\n\t\t&lt;?php endwhile; ?&gt;\n\t&lt;?php endif; ?&gt;\n&lt;\/main&gt;\n\n&lt;div class=\"entry-content is-layout-flow\"&gt;\n\t&lt;?php block_template_part( 'cta' ); ?&gt;\n&lt;\/div&gt;\n\n&lt;footer class=\"site-footer\"&gt;\n\tSite Footer\n&lt;\/footer&gt;\n\n&lt;?php wp_footer(); ?&gt;\n\n&lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n<\/details>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\"><summary>\u200bfunctions.php<\/summary>\n<pre data-label=\"\u200bfunctions.php\" id=\"\u200bfunctions.php\" class=\"wp-block-code lang-php\"><code>&lt;?php\nfunction my_theme_scripts() {\n\twp_enqueue_style(\n\t\t'my-theme-style',\n\t\tget_template_directory_uri() . '\/style.css',\n\t\tarray(),\n\t\twp_get_theme()-&gt;get( 'Version' )\n\t);\n}\nadd_action( 'wp_enqueue_scripts', 'my_theme_scripts' );\n\nfunction my_theme_setup() {\n\tadd_theme_support( 'editor-styles' );\n\tadd_editor_style( 'editor-style.css' );\n\tadd_theme_support( 'block-template-parts' );\n}\nadd_action( 'after_setup_theme', 'my_theme_setup' );\n\nfunction my_theme_register_block_styles() {\n\tregister_block_style(\n\t\t'core\/heading',\n\t\tarray(\n\t\t\t'name'  =&gt; 'flat',\n\t\t\t'label' =&gt; esc_html__( 'Flat', 'mytheme' ),\n\t\t)\n\t);\n}\nadd_action( 'init', 'my_theme_register_block_styles' );<\/code><\/pre>\n<\/details>\n\n\n\n<details class=\"wp-block-details is-layout-flow wp-block-details-is-layout-flow\"><summary>\u200bparts\/cta.html<\/summary>\n<pre data-label=\"\u200bparts\/cta.html\" id=\"\u200bparts\/cta.html\" class=\"wp-block-code lang-html\"><code>&lt;!-- wp:group {\"align\":\"full\",\"style\":{\"color\":{\"background\":\"#ffffff\"},\"spacing\":{\"padding\":{\"top\":\"3rem\",\"bottom\":\"3rem\",\"right\":\"1rem\",\"left\":\"1rem\"}}},\"layout\":{\"type\":\"constrained\"}} --&gt;\n&lt;div class=\"wp-block-group alignfull has-background\" style=\"background-color:#ffffff;padding-top:3rem;padding-right:1rem;padding-bottom:3rem;padding-left:1rem\"&gt;&lt;!-- wp:paragraph {\"align\":\"center\",\"fontSize\":\"x-large\"} --&gt;\n&lt;p class=\"has-text-align-center has-x-large-font-size\"&gt;&lt;strong&gt;GET IN TOUCH&lt;\/strong&gt;&lt;\/p&gt;\n&lt;!-- \/wp:paragraph --&gt;\n\n&lt;!-- wp:paragraph --&gt;\n&lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.&lt;\/p&gt;\n&lt;!-- \/wp:paragraph --&gt;\n\n&lt;!-- wp:buttons {\"layout\":{\"type\":\"flex\",\"justifyContent\":\"center\",\"orientation\":\"horizontal\",\"flexWrap\":\"nowrap\"}} --&gt;\n&lt;div class=\"wp-block-buttons\"&gt;&lt;!-- wp:button {\"width\":50} --&gt;\n&lt;div class=\"wp-block-button has-custom-width wp-block-button__width-50\"&gt;&lt;a class=\"wp-block-button__link wp-element-button\"&gt;Contact us&lt;\/a&gt;&lt;\/div&gt;\n&lt;!-- \/wp:button --&gt;&lt;\/div&gt;\n&lt;!-- \/wp:buttons --&gt;&lt;\/div&gt;\n&lt;!-- \/wp:group --&gt;<\/code><\/pre>\n<\/details>\n","protected":false},"excerpt":{"rendered":"<p>\u306f\u3058\u3081\u306b \u3053\u306e\u8a18\u4e8b\u3067\u306f\u3001\u53d7\u8a17\u958b\u767a\u306b\u304a\u3044\u3066 WordPress \u30c6\u30fc\u30de\u3092\u5236\u4f5c\u3059\u308b\u6642\u306b\u3001\u30cf\u30a4\u30d6\u30ea\u30c3\u30c9\u30c6\u30fc\u30de\u3067\u69cb\u7bc9\u3059\u308b\u305f\u3081\u306e\u8a2d\u8a08\u30fb\u30a2\u30d7\u30ed\u30fc\u30c1\u3092\u63d0\u6848\u3059\u308b\u3082\u306e\u3067\u3059\u3002 \u8a18\u4e8b\u30bf\u30a4\u30c8\u30eb\u306b\u300c\u53d7\u8a17\u958b\u767a\u306b\u304a\u3051\u308b\u300d\u3068\u542b\u3081\u305f\u7406\u7531\u306f\u3001WordPre [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_locale":"ja","_original_post":"https:\/\/aki-hamano.blog\/?p=373","footnotes":""},"categories":[10],"tags":[],"class_list":["post-373","post","type-post","status-publish","format-standard","hentry","category-tips","ja"],"_links":{"self":[{"href":"https:\/\/aki-hamano.blog\/wp-json\/wp\/v2\/posts\/373","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/aki-hamano.blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/aki-hamano.blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/aki-hamano.blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/aki-hamano.blog\/wp-json\/wp\/v2\/comments?post=373"}],"version-history":[{"count":79,"href":"https:\/\/aki-hamano.blog\/wp-json\/wp\/v2\/posts\/373\/revisions"}],"predecessor-version":[{"id":1100,"href":"https:\/\/aki-hamano.blog\/wp-json\/wp\/v2\/posts\/373\/revisions\/1100"}],"wp:attachment":[{"href":"https:\/\/aki-hamano.blog\/wp-json\/wp\/v2\/media?parent=373"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/aki-hamano.blog\/wp-json\/wp\/v2\/categories?post=373"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/aki-hamano.blog\/wp-json\/wp\/v2\/tags?post=373"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}