5b:I[473921,["/creators-assets/_next/static/immutable/chunks/2bxtessbrg0z1.js","/creators-assets/_next/static/immutable/chunks/0lpbs3388m8i9.js","/creators-assets/_next/static/immutable/chunks/1cyyov0z5q-kt.js","/creators-assets/_next/static/immutable/chunks/3283ev4bymz-y.js","/creators-assets/_next/static/immutable/chunks/1tyeiicl34tqo.js","/creators-assets/_next/static/immutable/chunks/24bk4ojcoor5n.js","/creators-assets/_next/static/immutable/chunks/19vaojedolulr.js","/creators-assets/_next/static/immutable/chunks/1zalsqf-ioaic.js","/creators-assets/_next/static/immutable/chunks/00hohn9l3ocx9.js","/creators-assets/_next/static/immutable/chunks/09klh1t314i6_.js","/creators-assets/_next/static/immutable/chunks/0vxt9zvn936s0.js","/creators-assets/_next/static/immutable/chunks/1eyot9c9uwocm.js","/creators-assets/_next/static/immutable/chunks/15qb5jvtj_j-a.js","/creators-assets/_next/static/immutable/chunks/3p2-jhwmdt2w4.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/102julo6bufcv.js","/creators-assets/_next/static/immutable/chunks/2e-sz6cfsc9_9.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/3uo-268z2xnq9.js","/creators-assets/_next/static/immutable/chunks/3fujn21cf_mt1.js","/creators-assets/_next/static/immutable/chunks/2ypcsbrcjzeke.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/3nnozhk_k4v6s.js","/creators-assets/_next/static/immutable/chunks/2ch5kewqiwntv.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/3xmobvbzj3637.js","/creators-assets/_next/static/immutable/chunks/26fs9mkd8gzie.js","/creators-assets/_next/static/immutable/chunks/0toe1wcov_38e.js","/creators-assets/_next/static/immutable/chunks/21ae0xqjlej6m.js","/creators-assets/_next/static/immutable/chunks/3xnhxg14xjx1h.js","/creators-assets/_next/static/immutable/chunks/0q4_4jbe5r70f.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/2warb3xv9rce7.js","/creators-assets/_next/static/immutable/chunks/1tvhyiuh-gmez.js","/creators-assets/_next/static/immutable/chunks/3un-l23eued0s.js","/creators-assets/_next/static/immutable/chunks/0u_jiik6ovv_e.js","/creators-assets/_next/static/immutable/chunks/3nd1mzwm7q_f7.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js"],"PostDetailCard"] 5c:Tb26,

In-Line CMS Searchbar

The In-Line CMS Searchbar is a drop-in Framer component that lets users instantly filter CMS content directly on the page. Instead of sending visitors to a separate search page or modal, this component keeps search inline, fast, and intuitive—perfect for CMS grids and directories.

As users type, CMS items update in real time, making it easy to find content without scrolling or reloading the page.

Key Features

Instant CMS filteringFilters CMS collections live as users type.
Inline placementSits directly above your CMS grid or list—no popups or overlays.
Case-insensitive searchMatches results regardless of capitalization.
Clean, minimal UIDesigned to blend naturally into modern Framer layouts.
Drop-in readyNo custom code required.

Best Use Cases

CMS directories
Resource libraries
Blog or article collections
Product grids
FAQ or knowledge bases
Any CMS list where quick discovery matters

How to Use

1. Place the Component

Add CMSInlineSearch to the same section/frame as your CMS collection.

Important:The search bar must live in the same parent container as the CMS list it filters.

2. Positioning (Recommended)

Inside your layout:

Page heading (optional)
CMSInlineSearch
CMS collection (grid or list)

This ensures the search feels native and filters correctly.

3. Layout Tips

Set the search bar width to Fill
Set the CMS collection width to Fill
Keep both inside the same container to maintain alignment
Works best in a vertical Stack or column layout

Responsive Behavior

Fully responsive across Desktop, Tablet, and Phone
Scales naturally with your CMS layout
Adjust spacing per breakpoint if needed

Notes & Requirements

Must be used with a Framer CMS collection
The search will only filter CMS items within the same parent frame
Designed for inline filtering—not full-page search results

Why Inline Search?

Inline search keeps users focused and reduces friction. Instead of navigating away or scanning long lists, visitors can type and instantly see relevant results—cleaner UX, faster discovery, better engagement.

58:[["$","$L5b",null,{"post":{"id":"019c1ec6-c4da-7769-8c50-2225498dc125","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"1e86c660-593f-4aa7-9bc2-8324490d40a8","name":"Brandon Grimes","slug":"brandon-grimes-l3xd","avatar":"https://framerusercontent.com/avatars/users/1e86c660-593f-4aa7-9bc2-8324490d40a8/Ah2TXSIrI","followed":false,"followsYou":false},"media":[],"resources":[{"id":"LnKCBKy35UlivSWqtT7N","resolved":true,"title":"In-Line CMS Search","body":"$5c","bodyJson":null,"introduction":"Drop-in inline search for Framer CMS col","slug":"in-line-cms-search","author":{"framerUserId":"1e86c660-593f-4aa7-9bc2-8324490d40a8","name":"Brandon Grimes","slug":"brandon-grimes-l3xd","avatar":"https://framerusercontent.com/avatars/users/1e86c660-593f-4aa7-9bc2-8324490d40a8/Ah2TXSIrI","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/LnKCBKy35UlivSWqtT7N/in-line-cms-search-aRa1IjaLQNLX1lNFogbviCzbfg1jIe","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-01-24T01:44:52.857Z","updatedAt":"2026-02-28T17:42:19.042Z","publishedAt":"2026-02-02T14:34:28.954Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://inlinecmssearch.framer.website","price":"12","paymentUrl":"https://bcgrimes1995.gumroad.com/l/jsotf","workshop":true,"categories":[{"id":"bc230830-1d89-456e-96fe-6a9de5a801d0","name":"Forms","slug":"forms"}],"lastSaveId":"hV3xe10qDFL6zbL8jFCT","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":4,"liked":false},"comments":{"count":1},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-02-02T14:34:28.954Z","updatedAt":"2026-02-02T14:34:28.954Z","reported":false,"type":"post"}}],"$L5d"]

Suggested for you