外部AI向けガイドに戻る

LiteWord テーマ情報

{
    "name": "wdl/lw-pr-button-6",
    "title": "ボタン 06",
    "category": "lw-button",
    "description": "グリッドレイアウトのボタンブロック。複数ボタンを配置可能。",
    "aiHint": {
        "description": "グリッドレイアウト複数ボタン。2〜4個のボタンを格子状に配置。ナビゲーション・サービス一覧のリンクに",
        "excludeFromAutoSelect": false,
        "contentAttributes": [
            "button6Buttons"
        ],
        "imageAttributes": [],
        "notes": "✅ **`url` が空でも `href=\"#\"` に落ちる**（`lw-button-03` と違って安全）。🚨 **枠線 `button6BorderColor` と矢印 `button6ArrowColor` の既定が `var(--color-main)`。**背景は白・文字は黒なので読めなくなりはしないが、明るいサイト色だと**枠線が消えてボタンに見えない**。`color-mix(in srgb, var(--color-main) 50%, #000)` にする。`button6Buttons` は `[{text, linkType, url, isBlank}]`（`textMain` ではない）。3つ以上並べるなら `button6ColumnsPc` を明示する（既定は2）。スマホは1列のままにするのが読みやすい。矢印を出すなら `button6ShowArrow: true`。"
    },
    "attributes": {
        "button6Buttons": {
            "type": "array",
            "default": [
                {
                    "text": "リンクテキスト",
                    "url": "",
                    "isBlank": false
                },
                {
                    "text": "リンクテキスト",
                    "url": "",
                    "isBlank": false
                }
            ],
            "aiHint": {
                "role": "list",
                "contentGuide": "ボタン配列。各要素に text(4〜15文字) と url を設定。2〜4個",
                "example": [
                    {
                        "text": "サービス紹介",
                        "url": "/service/"
                    },
                    {
                        "text": "料金プラン",
                        "url": "/pricing/"
                    }
                ]
            }
        }
    }
}