5c:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/3gx96u50v9idb.js","/creators-assets/_next/static/immutable/chunks/125_ce2ese0y_.js","/creators-assets/_next/static/immutable/chunks/2ii8lkleumgkk.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/069_m7850i8jf.js","/creators-assets/_next/static/immutable/chunks/03586ab1rea-b.js","/creators-assets/_next/static/immutable/chunks/19qq0hy3mz_vv.js","/creators-assets/_next/static/immutable/chunks/2oixy7hansmjm.js","/creators-assets/_next/static/immutable/chunks/2rczsbgoa3afm.js","/creators-assets/_next/static/immutable/chunks/2a63j-5qkrdf4.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/0-lv0573a1cyl.js","/creators-assets/_next/static/immutable/chunks/3kkqflhmmpg9p.js","/creators-assets/_next/static/immutable/chunks/0ib-rcz4b0eq3.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/24gcuxpvxd8dy.js","/creators-assets/_next/static/immutable/chunks/0xd4yj8g3g-ci.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/3vd9_7_mqx0kl.js","/creators-assets/_next/static/immutable/chunks/3l37d07td4kzk.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3nw4q_evu8ge1.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/2qsfz_74auu2_.js","/creators-assets/_next/static/immutable/chunks/1xkjm3oyldl_r.js","/creators-assets/_next/static/immutable/chunks/16d5vpfsnfybw.js","/creators-assets/_next/static/immutable/chunks/3yfgkb3cck8zt.js","/creators-assets/_next/static/immutable/chunks/0rfcd366io6r9.js","/creators-assets/_next/static/immutable/chunks/2r15b2hek61lg.js","/creators-assets/_next/static/immutable/chunks/3kyaj4hrugjs0.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/2ryuxt_mk774w.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/3eh5q_6ksmw0l.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/0pc9t50m5x90i.js","/creators-assets/_next/static/immutable/chunks/2ee50z0bknh40.js","/creators-assets/_next/static/immutable/chunks/3f4d4x4z1mrzh.js","/creators-assets/_next/static/immutable/chunks/2rdaqkxiyeq_6.js","/creators-assets/_next/static/immutable/chunks/0e-wwv74y78f7.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js"],"PostDetailCard"] 5d:T798,

Aisol Services Wall is a services section that runs on your CMS collection, not on a copy of your content.

Every item is reachable by keyboard and announced properly by a screen reader — nothing is hidden behind hover.

Motion respects prefers-reduced-motion, and the Framer canvas renders exactly what the published page renders.

- Three layouts in one component. Split (media and text alternating sides), cards, or compact rows. Switching is a control, not a different component.

- Reveal without measuring. Items appear as they enter the viewport using an observer on this component's own items — no scroll listeners, no element measuring, nothing read from the page around it.

- Reduced motion means no observer at all. Visitors who ask for less motion get the plain section immediately, with none of the machinery running.

- No image? Still finished. An item falls back to an emoji icon, then to a numbered badge — no empty grey panels while you wait for artwork.

- Bullets, a small label, a link per item, and a heading level you choose. Media ratio is CSS aspect-ratio, so nothing jumps as images load.

- Columns step down on their own: three, two, one. The breakpoints live in CSS inside the component, so the canvas matches the live page.

What you control

• Layout: split (media and text alternating), cards, or compact rows; columns 1–4 with two step-down breakpoints

• Media ratio, reveal on scroll or off, title level, label and bullets on or off

• Per service: title, blurb, label, icon, image and alt text, bullets, link and link text

• Service cards slots — bind a CMS collection, slot 1 replaces service 1

• Gap, radius, text size, padding; accent, text, muted, media fill and border colours; empty-state text

More components at Aisol Studio → https://thistle-timing-694660.framer.app/

59:[["$","$L5c",null,{"post":{"id":"01a067e3-7af7-706f-b5f6-ef0e650cc213","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"82d016d2-8113-4080-8f2a-7c3796dceab4","name":"ulz song","slug":"ulz-song","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/82d016d2-8113-4080-8f2a-7c3796dceab4/cyjym4k1","followed":false,"followsYou":false},"media":[],"resources":[{"id":"tAOE4bA24NrUtgHxtvx4","resolved":true,"title":"Aisol Services Wall","body":"$5d","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Aisol Services Wall is a services section that runs on your CMS collection, not on a copy of your content."}]},{"type":"paragraph","content":[{"type":"text","text":"Every item is reachable by keyboard and announced properly by a screen reader — nothing is hidden behind hover."}]},{"type":"paragraph","content":[{"type":"text","text":"Motion respects prefers-reduced-motion, and the Framer canvas renders exactly what the published page renders."}]},{"type":"paragraph"},{"type":"paragraph","content":[{"type":"text","text":"- Three layouts in one component. Split (media and text alternating sides), cards, or compact rows. Switching is a control, not a different component."}]},{"type":"paragraph","content":[{"type":"text","text":"- Reveal without measuring. Items appear as they enter the viewport using an observer on this component's own items — no scroll listeners, no element measuring, nothing read from the page around it."}]},{"type":"paragraph","content":[{"type":"text","text":"- Reduced motion means no observer at all. Visitors who ask for less motion get the plain section immediately, with none of the machinery running."}]},{"type":"paragraph","content":[{"type":"text","text":"- No image? Still finished. An item falls back to an emoji icon, then to a numbered badge — no empty grey panels while you wait for artwork."}]},{"type":"paragraph","content":[{"type":"text","text":"- Bullets, a small label, a link per item, and a heading level you choose. Media ratio is CSS aspect-ratio, so nothing jumps as images load."}]},{"type":"paragraph","content":[{"type":"text","text":"- Columns step down on their own: three, two, one. The breakpoints live in CSS inside the component, so the canvas matches the live page."}]},{"type":"paragraph"},{"type":"paragraph","content":[{"type":"text","text":"What you control"}]},{"type":"paragraph","content":[{"type":"text","text":"• Layout: split (media and text alternating), cards, or compact rows; columns 1–4 with two step-down breakpoints"}]},{"type":"paragraph","content":[{"type":"text","text":"• Media ratio, reveal on scroll or off, title level, label and bullets on or off"}]},{"type":"paragraph","content":[{"type":"text","text":"• Per service: title, blurb, label, icon, image and alt text, bullets, link and link text"}]},{"type":"paragraph","content":[{"type":"text","text":"• Service cards slots — bind a CMS collection, slot 1 replaces service 1"}]},{"type":"paragraph","content":[{"type":"text","text":"• Gap, radius, text size, padding; accent, text, muted, media fill and border colours; empty-state text"}]},{"type":"paragraph"},{"type":"paragraph","content":[{"type":"text","text":"More components at Aisol Studio → https://thistle-timing-694660.framer.app/"}]}]},"introduction":"Services section on your CMS","slug":"aisol-services-wall","author":{"framerUserId":"82d016d2-8113-4080-8f2a-7c3796dceab4","name":"ulz song","slug":"ulz-song","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/82d016d2-8113-4080-8f2a-7c3796dceab4/cyjym4k1","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/82d016d2-8113-4080-8f2a-7c3796dceab4/01a067e3-2679-7249-a8cb-3c6d5e8442d4.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-09-03T15:29:15.984Z","updatedAt":"2026-09-08T17:04:29.323Z","publishedAt":"2026-09-03T15:29:15.980Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://thistle-timing-694660.framer.app/aisol-service-showcase","price":"10","paymentUrl":"https://payhip.com/b/kehUu","workshop":false,"categories":[{"id":"5c50a4d9-4405-49ca-8956-4909a204480d","name":"Sections","slug":"sections"}],"lastSaveId":"WlTaQb1Oq9g9yQOWf049","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":0,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-09-03T15:29:16.535Z","updatedAt":"2026-09-03T15:29:16.535Z","reported":false}}],"$L5e"]

Suggested for you