Blog 4

ImageButtons3 ColumnsCards179 nodes · 44 styles

Description

Blog listing section with centered header, category filter tabs, and 3-column grid of bordered article cards with category badges, reading time, titles, excerpts, and read more links.

Detailed Analysis

This blog layout presents a centered header section with 'Blog' label, main heading, and supporting text. The category filter includes a bordered 'View all' button and text category links. Article cards are arranged in a 3-column grid with thin borders. Each card features a large image placeholder, then below the image shows a category badge (dark pill style), reading time, bold article title, excerpt paragraph, and a 'Read more' link with chevron arrow. Cards use borders for definition with content flowing cleanly inside each container.

Webflow Paste

Copy and paste directly into Webflow Designer

Keywords

blog sectionbordered cardscategory badgesread more CTA3-column gridarticle cardsreading timeblog listingcontent cardsnews sectionpill badgeschevron linksarticle previewcontent filtering

Raw Data (spacer)

{
  "meta": {
    "droppedLinks": 0,
    "dynBindRemovedCount": 0,
    "unlinkedSymbolCount": 0,
    "paginationRemovedCount": 0,
    "dynListBindRemovedCount": 0
  },
  "type": "@webflow/XscpData",
  "payload": {
    "ix1": [],
    "ix2": {
      "events": [],
      "actionLists": [],
      "interactions": []
    },
    "nodes": [
      {
        "_id": "4744f2e5-e221-0a1f-6749-7923f440ef10",
        "tag": "header",
        "data": {
          "tag": "header",
          "attr": {
            "id": "blog-header-4"
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
          },
          "devlink": {
            "slot": "",
            "runtimeProps": {}
          },
          "visibility": {
            "conditions": []
          },
          "displayName": ""
        },
        "type": "Block",
        "classes": [
          "8c787968-37af-381d-a7e7-5a0baacfb7b7"
        ],
        "children": [
          "4744f2e5-e221-0a1f-6749-7923f440ef11"
        ]
      },
      {
        "_id": "4744f2e5-e221-0a1f-6749-7923f440ef11",
        "tag": "div",
        "data": {
          "tag": "div",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude": false
          },
          "devlink": {
            "slot": "",
            "runtimeProps": {}
          },
          "visibility": {
            "conditions": []
          },
          "displayName": ""
        },
        "type": "Block",
        "classes": [
          "b0934d9a-875a-bb42-0630-12090a77fc73"
        ],
        "children": [
          "4744f2e5-e221-0a1f-6749-7923f440ef12"
        ]
      },
      {
        "_id": "4744f2e5-e221-0a1f-6749-7923f440ef12",
        "tag": "div",
        "data": {
          "tag": "div",
          "attr": {
            "id": ""
          },
          "text": false,
          "xattr": [],
          "search": {
            "exclude":
... (truncated)

Detailed Analysis

{ "meta": { "droppedLinks": 0, "dynBindRemovedCount": 0, "unlinkedSymbolCount": 0, "paginationRemovedCount": 0, "dynListBindRemovedCount": 0 }, "type": "@webflow/XscpData", "payload": { "ix1": [], "ix2": { "events": [], "actionLists": [], "interactions": [] }, "nodes": [ { "_id": "4744f2e5-e221-0a1f-6749-7923f440ef10", "tag": "header", "data": { "tag": "header", "attr": { "id": "blog-header-4" }, "text": false, "xattr": [], "search": { "exclude": false }, "devlink": { "slot": "", "runtimeProps": {} }, "visibility": { "conditions": [] }, "displayName": "" }, "type": "Block", "classes": [ "8c787968-37af-381d-a7e7-5a0baacfb7b7" ], "children": [ "4744f2e5-e221-0a1f-6749-7923f440ef11" ] }, { "_id": "4744f2e5-e221-0a1f-6749-7923f440ef11", "tag": "div", "data": { "tag": "div", "attr": { "id": "" }, "text": false, "xattr": [], "search": { "exclude": false }, "devlink": { "slot": "", "runtimeProps": {} }, "visibility": { "conditions": [] }, "displayName": "" }, "type": "Block", "classes": [ "b0934d9a-875a-bb42-0630-12090a77fc73" ], "children": [ "4744f2e5-e221-0a1f-6749-7923f440ef12" ] }, { "_id": "4744f2e5-e221-0a1f-6749-7923f440ef12", "tag": "div", "data": { "tag": "div", "attr": { "id": "" }, "text": false, "xattr": [], "search": { "exclude": ... (truncated)