[
  {
    "id": 3176,
    "title": "スタッツハイライト_P-27",
    "icon": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewbox=\"0 0 256 256\"><path d=\"M208,40V208H152V40Z\" fill=\"#9aa8c9\"/><path d=\"M224,200h-8V40a8,8,0,0,0-8-8H152a8,8,0,0,0-8,8V80H96a8,8,0,0,0-8,8v40H48a8,8,0,0,0-8,8v64H32a8,8,0,0,0,0,16H224a8,8,0,0,0,0-16ZM160,48h40V200H160ZM104,96h40V200H104ZM56,144H88v56H56Z\" fill=\"#1a1a2e\"/></svg>",
    "keywords": [
      "stats",
      "統計",
      "数字",
      "カウンター",
      "実績",
      "ハイライト",
      "テーブル・データ表示",
      "スタッツハイライト"
    ],
    "slug": "lazyblock/daily-2026-07-12-stats-highlight",
    "description": "大きな数字＋トレンド矢印でスクロール時にカウントアップする実績・統計ハイライトカード。AIツールの効果や導入実績を数字で見せるのに向く。",
    "category": "Lazyblocks Pro",
    "category_label": "Lazyblocks Pro",
    "supports": {
      "customClassName": true,
      "anchor": false,
      "html": false,
      "multiple": true,
      "inserter": true,
      "reusable": true,
      "color": false,
      "layout": false,
      "shadow": false,
      "spacing": false,
      "dimensions": false,
      "typography": false,
      "lock": true,
      "align": [
        "wide",
        "full"
      ],
      "ghostkit": {
        "effects": false,
        "position": false,
        "spacings": false,
        "frame": false,
        "transform": false,
        "customCSS": false,
        "display": false,
        "attributes": false
      }
    },
    "controls": {
      "control_26950b5bc3": {
        "type": "text",
        "name": "section_title",
        "default": "",
        "label": "セクション見出し（任意）",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "id": "control_26950b5bc3"
      },
      "control_6431330bd5": {
        "type": "textarea",
        "name": "section_lead",
        "default": "",
        "label": "リード文（任意）",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "id": "control_6431330bd5"
      },
      "control_2f43f774a0": {
        "type": "repeater",
        "name": "stats",
        "default": "",
        "label": "スタッツ一覧",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "rows_min": "1",
        "rows_max": "",
        "rows_label": "スタッツ {#}",
        "rows_add_button_label": "スタッツを追加",
        "rows_collapsible": "true",
        "rows_collapsed": "false",
        "id": "control_2f43f774a0"
      },
      "control_0e586600e6": {
        "type": "text",
        "name": "stat_number",
        "default": "",
        "label": "数字（例：98、1200、4.8）",
        "help": "",
        "child_of": "control_2f43f774a0",
        "placement": "content",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "true",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "id": "control_0e586600e6"
      },
      "control_5d8e06b899": {
        "type": "text",
        "name": "stat_prefix",
        "default": "",
        "label": "接頭辞（任意・例：+、$）",
        "help": "",
        "child_of": "control_2f43f774a0",
        "placement": "content",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "id": "control_5d8e06b899"
      },
      "control_c807c88e88": {
        "type": "text",
        "name": "stat_suffix",
        "default": "",
        "label": "接尾辞（任意・例：%、万人、件）",
        "help": "",
        "child_of": "control_2f43f774a0",
        "placement": "content",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "id": "control_c807c88e88"
      },
      "control_d844af3152": {
        "type": "text",
        "name": "stat_label",
        "default": "",
        "label": "ラベル（例：時短効果）",
        "help": "",
        "child_of": "control_2f43f774a0",
        "placement": "content",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "id": "control_d844af3152"
      },
      "control_ed340713a4": {
        "type": "text",
        "name": "stat_icon",
        "default": "",
        "label": "アイコン（絵文字1文字・任意）",
        "help": "",
        "child_of": "control_2f43f774a0",
        "placement": "content",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "id": "control_ed340713a4"
      },
      "control_d7d0464399": {
        "type": "select",
        "name": "stat_trend",
        "default": "none",
        "label": "トレンド矢印",
        "help": "",
        "child_of": "control_2f43f774a0",
        "placement": "content",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "choices": "[{\"label\":\"なし\",\"value\":\"none\"},{\"label\":\"上昇 ▲\",\"value\":\"up\"},{\"label\":\"下降 ▼\",\"value\":\"down\"}]",
        "allow_null": "false",
        "multiple": "false",
        "output_format": "",
        "id": "control_d7d0464399"
      },
      "control_e6542e64cf": {
        "type": "select",
        "name": "stat_accent",
        "default": "blue",
        "label": "アクセント色",
        "help": "",
        "child_of": "control_2f43f774a0",
        "placement": "content",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "choices": "[{\"label\":\"ブルー\",\"value\":\"blue\"},{\"label\":\"パープル\",\"value\":\"purple\"},{\"label\":\"グリーン\",\"value\":\"green\"},{\"label\":\"オレンジ\",\"value\":\"orange\"},{\"label\":\"ピンク\",\"value\":\"pink\"},{\"label\":\"スレート\",\"value\":\"slate\"}]",
        "allow_null": "false",
        "multiple": "false",
        "output_format": "",
        "id": "control_e6542e64cf"
      }
    },
    "code": {
      "output_method": "php",
      "editor_html": "<?php\n$title = isset( $attributes['section_title'] ) ? $attributes['section_title'] : '';\n$lead  = isset( $attributes['section_lead'] ) ? $attributes['section_lead'] : '';\n$stats_raw = isset( $attributes['stats'] ) ? $attributes['stats'] : array();\n$items = array();\nif ( is_array( $stats_raw ) ) { $items = $stats_raw; } elseif ( is_string( $stats_raw ) && '' !== $stats_raw ) { $decoded = json_decode( $stats_raw, true ); if ( is_array( $decoded ) ) { $items = $decoded; } }\nif ( ! empty( $items ) ) {\n?>\n<div class=\"ptstats\">\n\t<?php if ( '' !== $title ) { ?><h3 class=\"ptstats__title\"><?php echo esc_html( $title ); ?></h3><?php } ?>\n\t<?php if ( '' !== $lead ) { ?><p class=\"ptstats__lead\"><?php echo esc_html( $lead ); ?></p><?php } ?>\n\t<div class=\"ptstats__grid\">\n\t\t<?php foreach ( $items as $item ) {\n\t\t\t$accent = ( isset( $item['stat_accent'] ) && $item['stat_accent'] ) ? $item['stat_accent'] : 'blue';\n\t\t\t$trend  = ( isset( $item['stat_trend'] ) && $item['stat_trend'] ) ? $item['stat_trend'] : 'none';\n\t\t\t$number = isset( $item['stat_number'] ) ? $item['stat_number'] : '';\n\t\t\t$prefix = isset( $item['stat_prefix'] ) ? $item['stat_prefix'] : '';\n\t\t\t$suffix = isset( $item['stat_suffix'] ) ? $item['stat_suffix'] : '';\n\t\t\t$icon   = isset( $item['stat_icon'] ) ? $item['stat_icon'] : '';\n\t\t\t$label  = isset( $item['stat_label'] ) ? $item['stat_label'] : '';\n\t\t?>\n\t\t\t<div class=\"ptstats__card ptstats__card--<?php echo esc_attr( $accent ); ?>\">\n\t\t\t\t<?php if ( '' !== $icon ) { ?><span class=\"ptstats__icon\" aria-hidden=\"true\"><?php echo esc_html( $icon ); ?></span><?php } ?>\n\t\t\t\t<div class=\"ptstats__num-row\">\n\t\t\t\t\t<span class=\"ptstats__num\" data-count=\"<?php echo esc_attr( $number ); ?>\">\n\t\t\t\t\t\t<?php if ( '' !== $prefix ) { ?><span class=\"ptstats__affix\"><?php echo esc_html( $prefix ); ?></span><?php } ?><span class=\"ptstats__num-value\"><?php echo esc_html( $number ); ?></span><?php if ( '' !== $suffix ) { ?><span class=\"ptstats__affix\"><?php echo esc_html( $suffix ); ?></span><?php } ?>\n\t\t\t\t\t</span>\n\t\t\t\t\t<?php if ( 'up' === $trend ) { ?><span class=\"ptstats__trend ptstats__trend--up\" aria-hidden=\"true\">&#9650;</span><?php} elseif ( 'down' === $trend ) { ?><span class=\"ptstats__trend ptstats__trend--down\" aria-hidden=\"true\">&#9660;</span><?php } ?>\n\t\t\t\t</div>\n\t\t\t\t<?php if ( '' !== $label ) { ?><p class=\"ptstats__label\"><?php echo esc_html( $label ); ?></p><?php } ?>\n\t\t\t</div>\n\t\t<?php } ?>\n\t</div>\n</div>\n<?php } ?>\n",
      "editor_callback": "",
      "frontend_html": "<?php\n$title = isset( $attributes['section_title'] ) ? $attributes['section_title'] : '';\n$lead  = isset( $attributes['section_lead'] ) ? $attributes['section_lead'] : '';\n$stats_raw = isset( $attributes['stats'] ) ? $attributes['stats'] : array();\n$items = array();\nif ( is_array( $stats_raw ) ) { $items = $stats_raw; } elseif ( is_string( $stats_raw ) && '' !== $stats_raw ) { $decoded = json_decode( $stats_raw, true ); if ( is_array( $decoded ) ) { $items = $decoded; } }\nif ( ! empty( $items ) ) :\n?>\n<div class=\"ptstats\">\n\t<?php if ( '' !== $title ) : ?><div class=\"ptstats__title\"><?php echo esc_html( $title ); ?></div><?php endif; ?>\n\t<?php if ( '' !== $lead ) : ?><p class=\"ptstats__lead\"><?php echo esc_html( $lead ); ?></p><?php endif; ?>\n\t<div class=\"ptstats__grid\">\n\t\t<?php foreach ( $items as $item ) :\n\t\t\t$accent = ( isset( $item['stat_accent'] ) && $item['stat_accent'] ) ? $item['stat_accent'] : 'blue';\n\t\t\t$trend  = ( isset( $item['stat_trend'] ) && $item['stat_trend'] ) ? $item['stat_trend'] : 'none';\n\t\t\t$number = isset( $item['stat_number'] ) ? $item['stat_number'] : '';\n\t\t\t$prefix = isset( $item['stat_prefix'] ) ? $item['stat_prefix'] : '';\n\t\t\t$suffix = isset( $item['stat_suffix'] ) ? $item['stat_suffix'] : '';\n\t\t\t$icon   = isset( $item['stat_icon'] ) ? $item['stat_icon'] : '';\n\t\t\t$label  = isset( $item['stat_label'] ) ? $item['stat_label'] : '';\n\t\t?>\n\t\t\t<div class=\"ptstats__card ptstats__card--<?php echo esc_attr( $accent ); ?>\">\n\t\t\t\t<?php if ( '' !== $icon ) : ?><span class=\"ptstats__icon\" aria-hidden=\"true\"><?php echo esc_html( $icon ); ?></span><?php endif; ?>\n\t\t\t\t<div class=\"ptstats__num-row\">\n\t\t\t\t\t<span class=\"ptstats__num\" data-count=\"<?php echo esc_attr( $number ); ?>\">\n\t\t\t\t\t\t<?php if ( '' !== $prefix ) : ?><span class=\"ptstats__affix\"><?php echo esc_html( $prefix ); ?></span><?php endif; ?><span class=\"ptstats__num-value\"><?php echo esc_html( $number ); ?></span><?php if ( '' !== $suffix ) : ?><span class=\"ptstats__affix\"><?php echo esc_html( $suffix ); ?></span><?php endif; ?>\n\t\t\t\t\t</span>\n\t\t\t\t\t<?php if ( 'up' === $trend ) : ?><span class=\"ptstats__trend ptstats__trend--up\" aria-hidden=\"true\">&#9650;</span><?php elseif ( 'down' === $trend ) : ?><span class=\"ptstats__trend ptstats__trend--down\" aria-hidden=\"true\">&#9660;</span><?php endif; ?>\n\t\t\t\t</div>\n\t\t\t\t<?php if ( '' !== $label ) : ?><p class=\"ptstats__label\"><?php echo esc_html( $label ); ?></p><?php endif; ?>\n\t\t\t</div>\n\t\t<?php endforeach; ?>\n\t</div>\n</div>\n<?php endif; ?>\n",
      "frontend_callback": "",
      "show_preview": "always",
      "single_output": true
    },
    "style": {
      "block": ".ptstats{margin:2em 0;}\n.ptstats__title{font-size:1.25em;font-weight:700;margin:0 0 .3em;color:#0f172a;}\n.ptstats__lead{margin:0 0 1em;color:#475569;line-height:1.7;}\n.ptstats__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;}\n.ptstats__card{position:relative;background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:24px 12px 18px;text-align:center;overflow:hidden;transition:transform .25s ease,box-shadow .25s ease;}\n.ptstats__card::before{content:\"\";position:absolute;top:0;left:0;right:0;height:4px;background:var(--pts-accent,#3b82f6);}\n.ptstats__card:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(15,23,42,.08);}\n.ptstats__card--blue{--pts-accent:#3b82f6;}\n.ptstats__card--purple{--pts-accent:#8b5cf6;}\n.ptstats__card--green{--pts-accent:#10b981;}\n.ptstats__card--orange{--pts-accent:#f59e0b;}\n.ptstats__card--pink{--pts-accent:#ec4899;}\n.ptstats__card--slate{--pts-accent:#64748b;}\n.ptstats__icon{display:block;font-size:1.5em;margin-bottom:6px;line-height:1;}\n.ptstats__num-row{display:flex;align-items:baseline;justify-content:center;gap:2px;flex-wrap:nowrap;max-width:100%;}\n.ptstats__num{display:inline-flex;align-items:baseline;gap:1px;font-size:clamp(1.3em,6cqw,2.2em);font-weight:800;color:#0f172a;line-height:1.05;font-variant-numeric:tabular-nums;white-space:nowrap;min-width:0;}\n.ptstats__num-value{white-space:nowrap;}\n.ptstats__affix{font-size:.5em;font-weight:700;color:var(--pts-accent,#3b82f6);white-space:nowrap;}\n.ptstats__trend{font-size:.7em;flex-shrink:0;}\n.ptstats__trend--up{color:#10b981;}\n.ptstats__trend--down{color:#ef4444;}\n.ptstats__label{margin:6px 0 0;font-size:.82em;color:#475569;}\n@container (max-width: 180px){.ptstats__num{font-size:1.3em;}}\n@media (max-width:600px){.ptstats__grid{grid-template-columns:repeat(2,1fr);}}\n.ptstats__card{container-type:inline-size;}\n",
      "editor": ".ptstats{margin:1em 0;}\n.ptstats__grid{gap:12px;}\n.ptstats__card{padding:18px 14px 14px;}\n"
    },
    "script": {
      "view": "(function(){\n\tfunction parseNum(str){\n\t\tif (!str) return null;\n\t\tvar cleaned = String(str).replace(/,/g,'').trim();\n\t\tif (!/^-?\\d+(\\.\\d+)?$/.test(cleaned)) return null;\n\t\treturn parseFloat(cleaned);\n\t}\n\tfunction animate(el, target, decimals){\n\t\tvar duration = 1200, start = null;\n\t\tfunction step(ts){\n\t\t\tif (!start) start = ts;\n\t\t\tvar p = Math.min((ts - start) / duration, 1);\n\t\t\tvar eased = 1 - Math.pow(1 - p, 3);\n\t\t\tvar val = target * eased;\n\t\t\tel.textContent = decimals > 0 ? val.toFixed(decimals) : Math.round(val).toString();\n\t\t\tif (p < 1) {\n\t\t\t\trequestAnimationFrame(step);\n\t\t\t} else {\n\t\t\t\tel.textContent = decimals > 0 ? target.toFixed(decimals) : target.toString();\n\t\t\t}\n\t\t}\n\t\trequestAnimationFrame(step);\n\t}\n\tfunction init(){\n\t\tvar nums = document.querySelectorAll('.ptstats__num[data-count]');\n\t\tif (!nums.length || typeof IntersectionObserver === 'undefined') return;\n\t\tvar io = new IntersectionObserver(function(entries){\n\t\t\tentries.forEach(function(entry){\n\t\t\t\tif (!entry.isIntersecting) return;\n\t\t\t\tvar wrap = entry.target;\n\t\t\t\tvar raw = wrap.getAttribute('data-count');\n\t\t\t\tvar target = parseNum(raw);\n\t\t\t\tvar valueEl = wrap.querySelector('.ptstats__num-value');\n\t\t\t\tif (target !== null && valueEl){\n\t\t\t\t\tvar decimals = (raw.split('.')[1] || '').length;\n\t\t\t\t\tanimate(valueEl, target, decimals);\n\t\t\t\t}\n\t\t\t\tio.unobserve(wrap);\n\t\t\t});\n\t\t}, {threshold:0.4});\n\t\tnums.forEach(function(n){ io.observe(n); });\n\t}\n\tif (document.readyState === 'loading') {\n\t\tdocument.addEventListener('DOMContentLoaded', init);\n\t} else {\n\t\tinit();\n\t}\n})();\n"
    },
    "styles": [],
    "condition": [],
    "edit_url": null,
    "provide_context_to_blocks": false,
    "custom_context_slug": "",
    "allowed_blocks": "",
    "ancestor": ""
  }
]